Skip to content

Commit 6d1f2b2

Browse files
committed
refactor: clean up imports and formatting across multiple files
- Reorganized import statements for better readability in EventItem.tsx, EventsList.tsx, Schedule.tsx, Splash.tsx, and others. - Improved formatting and consistency in JSX elements and class names. - Removed unnecessary line breaks and adjusted spacing for better code clarity. - Ensured consistent use of semicolons and commas in function parameters and object properties. - Enhanced the overall structure of the codebase for maintainability.
1 parent c4d7c2d commit 6d1f2b2

35 files changed

Lines changed: 399 additions & 720 deletions

src/app/router.tsx

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,61 +1,61 @@
1+
import { Suspense, lazy } from "react";
12
import { Routes, Route } from "react-router";
2-
import LoadingPage from "@/components/LoadingPage";
33

4-
import { Suspense, lazy } from "react";
4+
import LoadingPage from "@/components/LoadingPage";
55
import NotFound from "@/components/NotFound";
66

77
const SplashRoute = lazy(() =>
88
import("../features/splash/Splash").then((module) => ({
99
default: module.Splash,
10-
}))
10+
})),
1111
);
1212

1313
const ConferencesRoute = lazy(() =>
1414
import("../features/conferences/Conferences").then((module) => ({
1515
default: module.Conferences,
16-
}))
16+
})),
1717
);
1818

1919
const AboutRoute = lazy(() =>
2020
import("../pages/About").then((module) => ({
2121
default: module.About,
22-
}))
22+
})),
2323
);
2424

2525
const SupportRoute = lazy(() =>
2626
import("../pages/Support").then((module) => ({
2727
default: module.Support,
28-
}))
28+
})),
2929
);
3030

3131
const ScheduleRoute = lazy(() =>
3232
import("../features/schedule/Schedule").then((module) => ({
3333
default: module.Schedule,
34-
}))
34+
})),
3535
);
3636

3737
const BookmarksRoute = lazy(() =>
3838
import("../features/bookmarks/Bookmarks").then((module) => ({
3939
default: module.Bookmarks,
40-
}))
40+
})),
4141
);
4242

4343
const EventRoute = lazy(() =>
4444
import("../features/event/Event").then((module) => ({
4545
default: module.Event,
46-
}))
46+
})),
4747
);
4848

4949
const PeopleRoute = lazy(() =>
5050
import("../features/people/People").then((module) => ({
5151
default: module.People,
52-
}))
52+
})),
5353
);
5454

5555
const PersonRoute = lazy(() =>
5656
import("../features/person/Person").then((module) => ({
5757
default: module.Person,
58-
}))
58+
})),
5959
);
6060

6161
export default function AppRouter() {

src/components/ConferenceHeader.tsx

Lines changed: 45 additions & 75 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,4 @@
1-
import { Fragment, useEffect, useMemo, useState } from "react";
2-
import { Link, useLocation, useSearchParams } from "react-router";
3-
import {
4-
Popover,
5-
Transition,
6-
PopoverButton,
7-
PopoverPanel,
8-
} from "@headlessui/react";
1+
import { Popover, Transition, PopoverButton, PopoverPanel } from "@headlessui/react";
92
import {
103
Bars3Icon,
114
XMarkIcon,
@@ -16,6 +9,9 @@ import {
169
CalendarDaysIcon,
1710
UserGroupIcon,
1811
} from "@heroicons/react/24/outline";
12+
import { Fragment, useEffect, useMemo, useState } from "react";
13+
import { Link, useLocation, useSearchParams } from "react-router";
14+
1915
import type { HTConference } from "@/types/db";
2016

2117
type NavItem = {
@@ -47,14 +43,10 @@ export function ConferenceHeader({ conference }: { conference: HTConference }) {
4743

4844
// Active states (path + query awareness)
4945
const isSchedule =
50-
pathname.startsWith("/schedule") &&
51-
(params.get("conf") ?? confCode) === confCode;
46+
pathname.startsWith("/schedule") && (params.get("conf") ?? confCode) === confCode;
5247
const isBookmarks =
53-
pathname.startsWith("/bookmarks") &&
54-
(params.get("conf") ?? confCode) === confCode;
55-
const isPeople =
56-
pathname.startsWith("/people") &&
57-
(params.get("conf") ?? confCode) === confCode;
48+
pathname.startsWith("/bookmarks") && (params.get("conf") ?? confCode) === confCode;
49+
const isPeople = pathname.startsWith("/people") && (params.get("conf") ?? confCode) === confCode;
5850

5951
const items: NavItem[] = useMemo(() => {
6052
const base: NavItem[] = [
@@ -104,44 +96,36 @@ export function ConferenceHeader({ conference }: { conference: HTConference }) {
10496
});
10597
}
10698
return base;
107-
}, [
108-
scheduleHref,
109-
isSchedule,
110-
bookmarksHref,
111-
isBookmarks,
112-
peopleHref,
113-
isPeople,
114-
conference.link,
115-
]);
99+
}, [scheduleHref, isSchedule, bookmarksHref, isBookmarks, peopleHref, isPeople, conference.link]);
116100

117101
const baseHeader =
118102
"sticky top-0 h-14 z-50 border-b border-neutral-800 transition-colors backdrop-blur supports-[backdrop-filter]:backdrop-blur";
119103
const bg = scrolled ? "bg-neutral-950/90" : "bg-neutral-950/70";
120104

121105
return (
122106
<header className={`${baseHeader} ${bg}`}>
123-
<div className="flex w-full items-center justify-between h-14 px-4 sm:px-6 lg:px-10">
107+
<div className="flex h-14 w-full items-center justify-between px-4 sm:px-6 lg:px-10">
124108
{/* Left: Conference name / brand */}
125109
<div className="min-w-0">
126110
<Link
127111
to={scheduleHref}
128-
className="block truncate text-lg sm:text-xl font-extrabold text-white hover:opacity-90"
112+
className="block truncate text-lg font-extrabold text-white hover:opacity-90 sm:text-xl"
129113
aria-label={`${conference.name} — view schedule`}
130114
>
131115
{conference.name}
132116
</Link>
133117
</div>
134118

135119
{/* Desktop nav */}
136-
<nav className="hidden sm:flex items-center gap-2">
120+
<nav className="hidden items-center gap-2 sm:flex">
137121
{items.map(({ key, label, to, external, icon: Icon, ariaCurrent }) =>
138122
external ? (
139123
<a
140124
key={key}
141125
href={to}
142126
target="_blank"
143127
rel="noreferrer"
144-
className="inline-flex items-center gap-2 rounded-lg border border-neutral-800 bg-neutral-900/60 px-3 py-2 text-sm text-neutral-300 hover:bg-neutral-900 hover:text-white transition-colors"
128+
className="inline-flex items-center gap-2 rounded-lg border border-neutral-800 bg-neutral-900/60 px-3 py-2 text-sm text-neutral-300 transition-colors hover:bg-neutral-900 hover:text-white"
145129
aria-label={label}
146130
title={label}
147131
>
@@ -165,7 +149,7 @@ export function ConferenceHeader({ conference }: { conference: HTConference }) {
165149
<Icon className="h-5 w-5" />
166150
<span className="hidden md:inline">{label}</span>
167151
</Link>
168-
)
152+
),
169153
)}
170154
</nav>
171155

@@ -182,15 +166,9 @@ export function ConferenceHeader({ conference }: { conference: HTConference }) {
182166
].join(" ")}
183167
>
184168
{open ? (
185-
<XMarkIcon
186-
className="h-5 w-5 text-neutral-200"
187-
aria-hidden="true"
188-
/>
169+
<XMarkIcon className="h-5 w-5 text-neutral-200" aria-hidden="true" />
189170
) : (
190-
<Bars3Icon
191-
className="h-5 w-5 text-neutral-200"
192-
aria-hidden="true"
193-
/>
171+
<Bars3Icon className="h-5 w-5 text-neutral-200" aria-hidden="true" />
194172
)}
195173
</PopoverButton>
196174

@@ -205,44 +183,36 @@ export function ConferenceHeader({ conference }: { conference: HTConference }) {
205183
>
206184
<PopoverPanel className="absolute right-0 mt-2 w-56 origin-top-right rounded-lg border border-neutral-800 bg-neutral-950/95 p-2 shadow-lg backdrop-blur">
207185
<div className="space-y-1 text-sm">
208-
{items.map(
209-
({
210-
key,
211-
label,
212-
to,
213-
external,
214-
icon: Icon,
215-
ariaCurrent,
216-
}) =>
217-
external ? (
218-
<PopoverButton
219-
key={key}
220-
as="a"
221-
href={to}
222-
target="_blank"
223-
rel="noreferrer"
224-
className="flex w-full items-center gap-2 rounded-md px-3 py-2 text-left text-neutral-300 hover:bg-neutral-900 hover:text-white transition-colors"
225-
>
226-
<Icon className="h-5 w-5" />
227-
{label}
228-
</PopoverButton>
229-
) : (
230-
<PopoverButton
231-
key={key}
232-
as={Link}
233-
to={to}
234-
className={[
235-
"flex w-full items-center gap-2 rounded-md px-3 py-2 text-left transition-colors",
236-
ariaCurrent
237-
? "bg-neutral-900 text-white"
238-
: "text-neutral-300 hover:bg-neutral-900 hover:text-white",
239-
].join(" ")}
240-
aria-current={ariaCurrent ? "page" : undefined}
241-
>
242-
<Icon className="h-5 w-5" />
243-
{label}
244-
</PopoverButton>
245-
)
186+
{items.map(({ key, label, to, external, icon: Icon, ariaCurrent }) =>
187+
external ? (
188+
<PopoverButton
189+
key={key}
190+
as="a"
191+
href={to}
192+
target="_blank"
193+
rel="noreferrer"
194+
className="flex w-full items-center gap-2 rounded-md px-3 py-2 text-left text-neutral-300 transition-colors hover:bg-neutral-900 hover:text-white"
195+
>
196+
<Icon className="h-5 w-5" />
197+
{label}
198+
</PopoverButton>
199+
) : (
200+
<PopoverButton
201+
key={key}
202+
as={Link}
203+
to={to}
204+
className={[
205+
"flex w-full items-center gap-2 rounded-md px-3 py-2 text-left transition-colors",
206+
ariaCurrent
207+
? "bg-neutral-900 text-white"
208+
: "text-neutral-300 hover:bg-neutral-900 hover:text-white",
209+
].join(" ")}
210+
aria-current={ariaCurrent ? "page" : undefined}
211+
>
212+
<Icon className="h-5 w-5" />
213+
{label}
214+
</PopoverButton>
215+
),
246216
)}
247217
</div>
248218
</PopoverPanel>

src/components/ErrorPage.tsx

Lines changed: 11 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,28 @@
11
import { Link } from "react-router";
2-
import { HTHeader } from "./HTHeader";
2+
33
import { HTFooter } from "./HTFooter";
4+
import { HTHeader } from "./HTHeader";
45

56
export default function ErrorPage({ msg }: { msg?: string }) {
67
return (
7-
<div className="min-h-dvh flex flex-col">
8+
<div className="flex min-h-dvh flex-col">
89
<HTHeader />
910

10-
<main id="main" className="flex-1 flex items-center justify-center px-6">
11+
<main id="main" className="flex flex-1 items-center justify-center px-6">
1112
<div className="relative text-center">
1213
{/* Glitchy title */}
13-
<div className="relative inline-block select-none isolation-isolate">
14-
<h1
15-
className="
16-
relative text-4xl md:text-6xl font-extrabold tracking-tight
17-
text-red-400
18-
motion-safe:animate-[glitch_2s_steps(12,end)_infinite]
19-
"
20-
>
14+
<div className="isolation-isolate relative inline-block select-none">
15+
<h1 className="relative text-4xl font-extrabold tracking-tight text-red-400 motion-safe:animate-[glitch_2s_steps(12,end)_infinite] md:text-6xl">
2116
ERROR
2217
<span
2318
aria-hidden
24-
className="absolute inset-0 text-cyan-300 mix-blend-screen opacity-95
25-
motion-safe:animate-[rgb_2.4s_ease-in-out_infinite]"
19+
className="absolute inset-0 text-cyan-300 opacity-95 mix-blend-screen motion-safe:animate-[rgb_2.4s_ease-in-out_infinite]"
2620
>
2721
ERROR
2822
</span>
2923
<span
3024
aria-hidden
31-
className="absolute inset-0 text-fuchsia-400 mix-blend-screen opacity-95
32-
-translate-x-[2px] translate-y-[1px]
33-
motion-safe:animate-[rgb_2.4s_ease-in-out_infinite]"
25+
className="absolute inset-0 -translate-x-[2px] translate-y-[1px] text-fuchsia-400 opacity-95 mix-blend-screen motion-safe:animate-[rgb_2.4s_ease-in-out_infinite]"
3426
style={{ animationDelay: "0.15s" }}
3527
>
3628
ERROR
@@ -42,9 +34,7 @@ export default function ErrorPage({ msg }: { msg?: string }) {
4234
{msg ? (
4335
<pre
4436
role="alert"
45-
className="mx-auto mt-6 max-w-xl overflow-x-auto rounded-lg
46-
border border-red-700/70 bg-red-950/30 p-4 text-left
47-
font-mono text-xs md:text-sm text-red-200"
37+
className="mx-auto mt-6 max-w-xl overflow-x-auto rounded-lg border border-red-700/70 bg-red-950/30 p-4 text-left font-mono text-xs text-red-200 md:text-sm"
4838
>
4939
{msg}
5040
</pre>
@@ -58,21 +48,13 @@ export default function ErrorPage({ msg }: { msg?: string }) {
5848
<div className="mt-8 flex flex-wrap justify-center gap-3">
5949
<Link
6050
to="/"
61-
className="rounded-md border border-gray-600/70 px-4 py-2
62-
text-sm font-semibold text-gray-100
63-
hover:bg-gray-800/70 hover:border-gray-500
64-
focus:outline-none focus:ring-2 focus:ring-indigo-400
65-
transition-colors"
51+
className="rounded-md border border-gray-600/70 px-4 py-2 text-sm font-semibold text-gray-100 transition-colors hover:border-gray-500 hover:bg-gray-800/70 focus:ring-2 focus:ring-indigo-400 focus:outline-none"
6652
>
6753
Return Home
6854
</Link>
6955
<Link
7056
to="/support"
71-
className="rounded-md border border-gray-600/70 px-4 py-2
72-
text-sm font-semibold text-gray-100
73-
hover:bg-gray-800/70 hover:border-gray-500
74-
focus:outline-none focus:ring-2 focus:ring-indigo-400
75-
transition-colors"
57+
className="rounded-md border border-gray-600/70 px-4 py-2 text-sm font-semibold text-gray-100 transition-colors hover:border-gray-500 hover:bg-gray-800/70 focus:ring-2 focus:ring-indigo-400 focus:outline-none"
7658
>
7759
Contact Support
7860
</Link>

src/components/HTFooter.tsx

Lines changed: 7 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ export function HTFooter() {
77
className="h-px w-full bg-gradient-to-r from-cyan-500/20 via-fuchsia-400/20 to-amber-400/20"
88
/>
99
<div className="mx-auto max-w-7xl px-4 py-8">
10-
<div className="grid gap-6 sm:grid-cols-3 items-start text-sm">
10+
<div className="grid items-start gap-6 text-sm sm:grid-cols-3">
1111
<div className="text-neutral-300">
1212
<p className="font-semibold">HackerTracker</p>
1313
<p className="mt-1 text-neutral-400">
@@ -16,37 +16,27 @@ export function HTFooter() {
1616
</div>
1717

1818
<nav className="flex flex-wrap gap-x-6 gap-y-2 text-neutral-300">
19-
<a
20-
href="/conferences"
21-
className="hover:text-white underline-offset-4 hover:underline"
22-
>
19+
<a href="/conferences" className="underline-offset-4 hover:text-white hover:underline">
2320
Conferences
2421
</a>
25-
<a
26-
href="/about"
27-
className="hover:text-white underline-offset-4 hover:underline"
28-
>
22+
<a href="/about" className="underline-offset-4 hover:text-white hover:underline">
2923
About
3024
</a>
31-
<a
32-
href="/support"
33-
className="hover:text-white underline-offset-4 hover:underline"
34-
>
25+
<a href="/support" className="underline-offset-4 hover:text-white hover:underline">
3526
Support
3627
</a>
3728
<a
3829
href="https://github.com/junctor/hackertracker-web"
3930
target="_blank"
4031
rel="noopener noreferrer"
41-
className="hover:text-white underline-offset-4 hover:underline"
32+
className="underline-offset-4 hover:text-white hover:underline"
4233
>
4334
GitHub
4435
</a>
4536
</nav>
4637

47-
<div className="sm:text-right text-neutral-400">
48-
Built with <span className="text-red-500"></span> by the
49-
HackerTracker team
38+
<div className="text-neutral-400 sm:text-right">
39+
Built with <span className="text-red-500"></span> by the HackerTracker team
5040
</div>
5141
</div>
5242
</div>

0 commit comments

Comments
 (0)