mirror of
https://github.com/lukevella/rallly.git
synced 2025-05-01 03:06:32 +02:00
More fixes
This commit is contained in:
parent
c9f6b67cbf
commit
a13df41bae
2 changed files with 22 additions and 22 deletions
|
@ -34,8 +34,7 @@ import {
|
||||||
} from "../../../../utils/date-time-utils";
|
} from "../../../../utils/date-time-utils";
|
||||||
import DateCard from "../../../date-card";
|
import DateCard from "../../../date-card";
|
||||||
import { useHeadlessDatePicker } from "../../../headless-date-picker";
|
import { useHeadlessDatePicker } from "../../../headless-date-picker";
|
||||||
import type { DateTimeOption } from "..";
|
import type { DateTimeOption, DateTimePickerProps } from "../types";
|
||||||
import type { DateTimePickerProps } from "../types";
|
|
||||||
import { formatDateWithoutTime, formatDateWithoutTz } from "../utils";
|
import { formatDateWithoutTime, formatDateWithoutTz } from "../utils";
|
||||||
import TimePicker from "./time-picker";
|
import TimePicker from "./time-picker";
|
||||||
|
|
||||||
|
@ -127,7 +126,7 @@ const MonthCalendar: React.FunctionComponent<DateTimePickerProps> = ({
|
||||||
{datepicker.days.map((day, i) => {
|
{datepicker.days.map((day, i) => {
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
key={i}
|
key={day.date.toISOString()}
|
||||||
className={cn("h-11", {
|
className={cn("h-11", {
|
||||||
"border-r": (i + 1) % 7 !== 0,
|
"border-r": (i + 1) % 7 !== 0,
|
||||||
"border-b": i < datepicker.days.length - 7,
|
"border-b": i < datepicker.days.length - 7,
|
||||||
|
@ -411,11 +410,11 @@ const MonthCalendar: React.FunctionComponent<DateTimePickerProps> = ({
|
||||||
},
|
},
|
||||||
);
|
);
|
||||||
const newOptions: DateTimeOption[] = [];
|
const newOptions: DateTimeOption[] = [];
|
||||||
Object.keys(optionsByDay).forEach(
|
for (const dateString of Object.keys(
|
||||||
(dateString) => {
|
optionsByDay,
|
||||||
times.forEach((time) => {
|
)) {
|
||||||
const start =
|
for (const time of times) {
|
||||||
dateString + time.startTime;
|
const start = dateString + time.startTime;
|
||||||
newOptions.push({
|
newOptions.push({
|
||||||
type: "timeSlot",
|
type: "timeSlot",
|
||||||
start: start,
|
start: start,
|
||||||
|
@ -424,9 +423,8 @@ const MonthCalendar: React.FunctionComponent<DateTimePickerProps> = ({
|
||||||
.add(duration, "minutes")
|
.add(duration, "minutes")
|
||||||
.format("YYYY-MM-DDTHH:mm"),
|
.format("YYYY-MM-DDTHH:mm"),
|
||||||
});
|
});
|
||||||
});
|
}
|
||||||
},
|
}
|
||||||
);
|
|
||||||
onChange(newOptions);
|
onChange(newOptions);
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
|
@ -462,10 +460,10 @@ const MonthCalendar: React.FunctionComponent<DateTimePickerProps> = ({
|
||||||
<div className="flex flex-wrap gap-3 p-3 sm:gap-4 sm:p-4">
|
<div className="flex flex-wrap gap-3 p-3 sm:gap-4 sm:p-4">
|
||||||
{datepicker.selection
|
{datepicker.selection
|
||||||
.sort((a, b) => a.getTime() - b.getTime())
|
.sort((a, b) => a.getTime() - b.getTime())
|
||||||
.map((selectedDate, i) => {
|
.map((selectedDate) => {
|
||||||
return (
|
return (
|
||||||
<DateCard
|
<DateCard
|
||||||
key={i}
|
key={selectedDate.toISOString()}
|
||||||
{...getDateProps(selectedDate)}
|
{...getDateProps(selectedDate)}
|
||||||
// annotation={
|
// annotation={
|
||||||
// <CompactButton
|
// <CompactButton
|
||||||
|
|
|
@ -17,7 +17,7 @@ export const ParticipantAvatarBar = ({
|
||||||
return (
|
return (
|
||||||
<ul className="flex items-center -space-x-1">
|
<ul className="flex items-center -space-x-1">
|
||||||
{participants.slice(0, visibleCount).map((participant, index) => (
|
{participants.slice(0, visibleCount).map((participant, index) => (
|
||||||
<Tooltip key={index}>
|
<Tooltip key={`${participant.name}-${index}`}>
|
||||||
<TooltipTrigger asChild>
|
<TooltipTrigger asChild>
|
||||||
<li className="z-10 inline-flex items-center justify-center rounded-full ring-2 ring-white">
|
<li className="z-10 inline-flex items-center justify-center rounded-full ring-2 ring-white">
|
||||||
<OptimizedAvatarImage name={participant.name} size="xs" />
|
<OptimizedAvatarImage name={participant.name} size="xs" />
|
||||||
|
@ -45,7 +45,9 @@ export const ParticipantAvatarBar = ({
|
||||||
{participants
|
{participants
|
||||||
.slice(visibleCount, 10)
|
.slice(visibleCount, 10)
|
||||||
.map((participant, index) => (
|
.map((participant, index) => (
|
||||||
<li key={index}>{participant.name}</li>
|
<li key={`${participant.name}-${index}`}>
|
||||||
|
{participant.name}
|
||||||
|
</li>
|
||||||
))}
|
))}
|
||||||
</ul>
|
</ul>
|
||||||
</TooltipContent>
|
</TooltipContent>
|
||||||
|
|
Loading…
Add table
Reference in a new issue