diff --git a/src/app/components/dashboard/ItemRow.tsx b/src/app/components/dashboard/ItemRow.tsx index 7b1920cb..4f3c5025 100644 --- a/src/app/components/dashboard/ItemRow.tsx +++ b/src/app/components/dashboard/ItemRow.tsx @@ -58,6 +58,13 @@ export default function ItemRow(props: ItemRowProps) { return created !== "" && updated !== "" && created !== updated; }); + const compactDateTooltip = createMemo(() => { + if (shouldShowUpdated()) { + return `${staticDateInfo().updatedTitle}\n${staticDateInfo().createdTitle}`; + } + return staticDateInfo().createdTitle; + }); + const compactLabelTooltip = createMemo(() => { const parts: string[] = []; if (props.labels.length > 0) { @@ -172,9 +179,11 @@ export default function ItemRow(props: ItemRowProps) { {props.author} {" ยท "} - + + + diff --git a/tests/components/ItemRow.test.tsx b/tests/components/ItemRow.test.tsx index daab24ea..d9c43b4c 100644 --- a/tests/components/ItemRow.test.tsx +++ b/tests/components/ItemRow.test.tsx @@ -151,6 +151,28 @@ describe("ItemRow", () => { const timeEls = container.querySelectorAll("time"); expect(timeEls.length).toBe(1); }); + + it("shows both updated and created dates in tooltip on hover", () => { + vi.useFakeTimers(); + const { container, unmount } = render(() => ); + const updatedTrigger = container.querySelector( + `time[datetime="${defaultProps.updatedAt}"]` + )?.closest("span.inline-flex"); + expect(updatedTrigger).not.toBeNull(); + expect(updatedTrigger!.className).toContain("z-10"); + fireEvent.pointerEnter(updatedTrigger!); + vi.advanceTimersByTime(300); + expect(document.body.textContent).toContain( + `Updated: ${new Date(defaultProps.updatedAt).toLocaleString()}` + ); + expect(document.body.textContent).toContain( + `Created: ${new Date(defaultProps.createdAt).toLocaleString()}` + ); + fireEvent.pointerLeave(updatedTrigger!); + vi.advanceTimersByTime(500); + unmount(); + vi.useRealTimers(); + }); }); it("renders no labels section when labels array is empty", () => {