refactor: update DayDetail component and tests for clarity and functionality
Some checks failed
CI / lint-and-test (push) Failing after 28s

- Revised unit tests for DayDetailContent to reflect changes in duty entry display, ensuring only time and name are shown without contact links.
- Updated styling in DayDetail component to enhance visual consistency with background color adjustments.
- Removed unused ContactLinks component from DayDetailContent to streamline the code and improve readability.
This commit is contained in:
2026-03-03 18:29:34 +03:00
parent 8bf92bd4a1
commit 54f85a8f14
3 changed files with 7 additions and 15 deletions

View File

@@ -1,5 +1,5 @@
/** /**
* Unit tests for DayDetailContent: sorts duties by start_at, includes contact info. * Unit tests for DayDetailContent: sorts duties by start_at; duty entries show time and name only (no contact links).
* Ported from webapp/js/dayDetail.test.js buildDayDetailContent. * Ported from webapp/js/dayDetail.test.js buildDayDetailContent.
*/ */
@@ -54,7 +54,7 @@ describe("DayDetailContent", () => {
expect(ivanovPos).toBeLessThan(petrovPos); expect(ivanovPos).toBeLessThan(petrovPos);
}); });
it("includes contact info (phone, username) for duty entries when present", () => { it("shows duty time and name on one line and does not show contact links", () => {
const dateKey = "2025-03-01"; const dateKey = "2025-03-01";
const duties = [ const duties = [
duty("Alice", "2025-03-01T09:00:00Z", "2025-03-01T17:00:00Z", { duty("Alice", "2025-03-01T09:00:00Z", "2025-03-01T17:00:00Z", {
@@ -70,8 +70,8 @@ describe("DayDetailContent", () => {
/> />
); );
expect(screen.getByText("Alice")).toBeInTheDocument(); expect(screen.getByText("Alice")).toBeInTheDocument();
expect(document.querySelector('a[href^="tel:"]')).toBeInTheDocument(); expect(document.querySelector('a[href^="tel:"]')).toBeNull();
expect(document.querySelector('a[href*="t.me"]')).toBeInTheDocument(); expect(document.querySelector('a[href*="t.me"]')).toBeNull();
expect(screen.getByText(/alice_dev/)).toBeInTheDocument(); expect(screen.queryByText(/alice_dev/)).not.toBeInTheDocument();
}); });
}); });

View File

@@ -204,7 +204,7 @@ export const DayDetail = React.forwardRef<DayDetailHandle, DayDetailProps>(
<SheetContent <SheetContent
side="bottom" side="bottom"
className={cn( className={cn(
"rounded-t-2xl pt-3 pb-[calc(24px+env(safe-area-inset-bottom,0px))] max-h-[70vh]", "rounded-t-2xl pt-3 pb-[calc(24px+env(safe-area-inset-bottom,0px))] max-h-[70vh] bg-[var(--surface)]",
className className
)} )}
showCloseButton={false} showCloseButton={false}

View File

@@ -9,7 +9,6 @@ import { useMemo } from "react";
import { useTranslation } from "@/i18n/use-translation"; import { useTranslation } from "@/i18n/use-translation";
import { localDateString, dateKeyToDDMM } from "@/lib/date-utils"; import { localDateString, dateKeyToDDMM } from "@/lib/date-utils";
import { getDutyMarkerRows } from "@/lib/duty-marker-rows"; import { getDutyMarkerRows } from "@/lib/duty-marker-rows";
import { ContactLinks } from "@/components/contact";
import type { DutyWithUser } from "@/types"; import type { DutyWithUser } from "@/types";
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
@@ -113,20 +112,13 @@ export function DayDetailContent({
> >
{t("event_type.duty")} {t("event_type.duty")}
</h3> </h3>
<ul className="list-[disc] pl-5 m-0 text-[0.9rem] leading-snug space-y-2.5 [&_li]:flex [&_li]:flex-col [&_li]:gap-1"> <ul className="list-[disc] pl-5 m-0 text-[0.9rem] leading-snug space-y-1 [&_li]:flex [&_li]:items-baseline [&_li]:gap-1">
{dutyRows.map((r) => ( {dutyRows.map((r) => (
<li key={r.id}> <li key={r.id}>
{r.timePrefix && ( {r.timePrefix && (
<span className="text-muted-foreground">{r.timePrefix} </span> <span className="text-muted-foreground">{r.timePrefix} </span>
)} )}
<span className="font-semibold">{r.fullName}</span> <span className="font-semibold">{r.fullName}</span>
<ContactLinks
phone={r.phone}
username={r.username}
layout="inline"
showLabels={true}
className="text-[0.85rem] mt-0.5"
/>
</li> </li>
))} ))}
</ul> </ul>