diff --git a/src/components/calendar/OccurrenceChip.tsx b/src/components/calendar/OccurrenceChip.tsx index 0592e3f..87a2fd5 100644 --- a/src/components/calendar/OccurrenceChip.tsx +++ b/src/components/calendar/OccurrenceChip.tsx @@ -1,15 +1,9 @@ import type { Occurrence } from '@models'; -import { - Badge, - Button, - Popover, - PopoverContent, - PopoverTrigger, - Tooltip, -} from '@nextui-org/react'; -import { Note, Trash } from '@phosphor-icons/react'; +import { Badge, Button, Tooltip } from '@nextui-org/react'; +import { Trash } from '@phosphor-icons/react'; import { useNotesStore } from '@stores'; import { getHabitIconUrl } from '@utils'; +import { format } from 'date-fns'; import React from 'react'; export type OccurrenceChipProps = { @@ -26,57 +20,51 @@ const OccurrenceChip = ({ onDelete, colorOverride, }: OccurrenceChipProps) => { + const occurrenceIds = occurrences.map((o) => o.id); const [occurrence] = occurrences; const { habit } = occurrence; const { notes } = useNotesStore(); const { name: habitName, iconPath, trait } = habit || {}; const { color: traitColor } = trait || {}; const iconUrl = getHabitIconUrl(iconPath); - const occurrenceNote = notes.find( - (note) => note.occurrenceId === occurrences[0].id + const occurrenceTimes = occurrences.map((o) => ({ + occurrenceId: o.id, + time: format(new Date(o.timestamp), 'p'), + })); + const occurrenceNotes = notes.filter( + (n) => n.occurrenceId && occurrenceIds.includes(n.occurrenceId) ); - const [isOccurrenceTooltipOpen, setIsOccurrenceTooltipOpen] = - React.useState(false); - const [isNotePopoverOpen, setIsNotePopoverOpen] = React.useState(false); const chipStyle = { borderColor: colorOverride || traitColor, }; const tooltipContent = ( -