diff --git a/app/components/league/settings/DraftSetupSection.tsx b/app/components/league/settings/DraftSetupSection.tsx index eeaec80..5f44905 100644 --- a/app/components/league/settings/DraftSetupSection.tsx +++ b/app/components/league/settings/DraftSetupSection.tsx @@ -1,4 +1,5 @@ import { Swords, CalendarIcon } from "lucide-react"; +import { useLocalTimezone } from "~/hooks/useLocalTimezone"; import { format } from "date-fns"; import { Label } from "~/components/ui/label"; import { Input } from "~/components/ui/input"; @@ -64,6 +65,8 @@ export function DraftSetupSection({ onOvernightTimezoneChange: (v: string) => void; commishTimezone: string | null; }) { + const localTz = useLocalTimezone(); + return (

Set this before starting the draft room. + {localTz && <> Times are in your local timezone ({localTz}).}

diff --git a/app/components/league/settings/SportsSection.tsx b/app/components/league/settings/SportsSection.tsx index 5c8de02..6c30e67 100644 --- a/app/components/league/settings/SportsSection.tsx +++ b/app/components/league/settings/SportsSection.tsx @@ -8,8 +8,6 @@ import { SettingsSection, SettingsStatusPill } from "./SettingsSection"; type SportsSeason = { id: string; name: string; - year: number; - scoringType: string; sport: { id: string; name: string; slug: string; type: string; iconUrl: string | null }; }; @@ -75,9 +73,8 @@ export function SportsSection({ - {ss.sport.slug === BRACKT_SLUG ? "Brackt" : `${ss.sport.name} - ${ss.name} (${ss.year})`} + {ss.sport.slug === BRACKT_SLUG ? "Brackt" : ss.name} - {ss.scoringType.replace("_", " ")} ); diff --git a/app/components/league/settings/__tests__/SportsSection.test.tsx b/app/components/league/settings/__tests__/SportsSection.test.tsx index 6a8c98b..763c74f 100644 --- a/app/components/league/settings/__tests__/SportsSection.test.tsx +++ b/app/components/league/settings/__tests__/SportsSection.test.tsx @@ -7,24 +7,18 @@ import { SportsSection } from "../SportsSection"; type SportsSeason = { id: string; name: string; - year: number; - scoringType: string; sport: { id: string; name: string; slug: string; type: string; iconUrl: string | null }; }; const displaySportsSeasons: SportsSeason[] = [ { id: "nba-2025", - name: "2025 Season", - year: 2025, - scoringType: "standings", + name: "2025 NBA Season", sport: { id: "sport-1", name: "NBA", slug: "nba", type: "team", iconUrl: "/sports-icons/nba.svg" }, }, { id: "mlb-2025", - name: "2025 Season", - year: 2025, - scoringType: "playoffs", + name: "2025 MLB Season", sport: { id: "sport-2", name: "MLB", slug: "mlb", type: "team", iconUrl: "/sports-icons/mlb.svg" }, }, ]; @@ -82,10 +76,10 @@ describe("SportsSection", () => { const user = userEvent.setup(); render(); - const mlbCheckbox = screen.getByRole("checkbox", { name: /mlb - 2025 season \(2025\)/i }); + const mlbCheckbox = screen.getByRole("checkbox", { name: /2025 mlb season/i }); expect(mlbCheckbox).not.toBeChecked(); - await user.click(screen.getByText("MLB - 2025 Season (2025)")); + await user.click(screen.getByText("2025 MLB Season")); expect(mlbCheckbox).toBeChecked(); }); @@ -95,7 +89,7 @@ describe("SportsSection", () => { const handleSubmit = vi.fn(); render(); - await user.click(screen.getByText("MLB - 2025 Season (2025)")); + await user.click(screen.getByText("2025 MLB Season")); await user.click(screen.getByRole("button", { name: "Save" })); expect(handleSubmit).toHaveBeenCalledWith(["nba-2025", "mlb-2025"]); diff --git a/app/hooks/useLocalTimezone.ts b/app/hooks/useLocalTimezone.ts new file mode 100644 index 0000000..ef1ae10 --- /dev/null +++ b/app/hooks/useLocalTimezone.ts @@ -0,0 +1,10 @@ +import { useState, useEffect } from "react"; + +export function useLocalTimezone() { + const [tz, setTz] = useState(""); + useEffect(() => { + const parts = Intl.DateTimeFormat(undefined, { timeZoneName: "short" }).formatToParts(new Date()); + setTz(parts.find((p) => p.type === "timeZoneName")?.value ?? ""); + }, []); + return tz; +} diff --git a/app/routes/leagues/new.tsx b/app/routes/leagues/new.tsx index 801427e..43f7ede 100644 --- a/app/routes/leagues/new.tsx +++ b/app/routes/leagues/new.tsx @@ -25,6 +25,7 @@ import { Checkbox } from "~/components/ui/checkbox"; import { cn } from "~/lib/utils"; import { parseDraftSpeed, formatTime12h } from "~/lib/draft-timer"; import { TIMEZONE_OPTIONS } from "~/components/league/TimezoneSelect"; +import { useLocalTimezone } from "~/hooks/useLocalTimezone"; import { saveWizardState, buildFormDataFromSnapshot } from "~/lib/wizard-state"; import { type ScoringRules, DEFAULT_SCORING_RULES } from "~/lib/scoring-types"; import { SportIcon } from "~/components/league/SportIcon"; @@ -533,7 +534,7 @@ function Step2Sports({ className="inline-flex items-center gap-1 pl-2 pr-1 py-0.5 rounded-md bg-primary/10 border border-primary text-primary text-sm font-medium" > - {s.sport.name} {s.year} + {s.name}