feat: wire frontend pages to tRPC APIs

- Add hooks (useAuth, useSubscription, useNotifications) for real API data
- Add auth service (login/signup) with password hashing and session support
- Replace stub auth with real tRPC calls in login/signup/onboarding pages
- Replace mock dashboard data with real API data from hooks
- Create service pages: DarkWatch, VoicePrint, SpamShield, HomeTitle, RemoveBrokers, Settings
- Update Navbar, TopBar, Sidebar with real user data and correct routes
- Add passwordHash field to users schema for credential auth
- Fix tests to work with real hooks (mock tRPC/hooks)
This commit is contained in:
2026-05-25 17:34:48 -04:00
parent eb8e57c674
commit 7cbcde6a6b
46 changed files with 2418 additions and 418 deletions

View File

@@ -4,7 +4,7 @@ import { cn } from "~/lib/utils";
import { Button } from "~/components/ui";
import { Typewriter } from "~/components/ui/Typewriter";
import { useTheme } from "~/lib/theme";
import { useAuth } from "./useAuth";
import { SignedIn, SignedOut, UserButton } from "clerk-solidjs";
function ShieldLogo() {
return (
@@ -128,7 +128,6 @@ const navLinks = [
export default function Navbar() {
const [mobileOpen, setMobileOpen] = createSignal(false);
const [scrolled, setScrolled] = createSignal(false);
const auth = useAuth();
onMount(() => {
const onScroll = () => {
@@ -168,23 +167,20 @@ export default function Navbar() {
<div class="hidden md:flex items-center gap-3">
<ThemeToggle />
<Show
when={auth.isAuthenticated}
fallback={
<>
<Button variant="secondary" size="sm">
<A href="/signin">Sign In</A>
</Button>
<Button variant="primary" size="sm">
<A href="/signup">Get Started</A>
</Button>
</>
}
>
<SignedIn>
<UserButton showName />
<Button variant="secondary" size="sm">
<A href="/dashboard">Dashboard</A>
</Button>
</Show>
</SignedIn>
<SignedOut>
<Button variant="secondary" size="sm">
<A href="/login">Sign In</A>
</Button>
<Button variant="primary" size="sm">
<A href="/signup">Get Started</A>
</Button>
</SignedOut>
</div>
<div class="flex md:hidden items-center gap-2">
@@ -243,23 +239,19 @@ export default function Navbar() {
</A>
))}
<div class="pt-3 flex flex-col gap-2">
<Show
when={auth.isAuthenticated}
fallback={
<>
<Button variant="secondary" class="w-full">
<A href="/signin">Sign In</A>
</Button>
<Button variant="primary" class="w-full">
<A href="/signup">Get Started</A>
</Button>
</>
}
>
<SignedIn>
<Button variant="secondary" class="w-full">
<A href="/dashboard">Dashboard</A>
</Button>
</Show>
</SignedIn>
<SignedOut>
<Button variant="secondary" class="w-full">
<A href="/login">Sign In</A>
</Button>
<Button variant="primary" class="w-full">
<A href="/signup">Get Started</A>
</Button>
</SignedOut>
</div>
</div>
</div>