maaz519
205418fc4e
Fix blank /org/login (and /admin/login): the guarded portal layout was wrapping its own login route, rendering null when unauthenticated. Move each portal's authed pages into a (authed)/(chapter) route group so login pages live outside the guard. Structure: - app/(chapter)/* — chapter admin pages + guarded layout (was root-level) - app/org/(authed)/* — org pages + guarded layout; /org/login now free - app/admin/(authed)/* — admin pages + guarded layout; /admin/login free - Root layout slimmed to providers only (no shared sidebar) - Convert moved files' relative imports to @/app alias Design system: - PortalShell: shared sidebar shell (brand mark, themed active nav with accent bar, avatar dropdown user menu, loading skeletons) - portal-theme.ts: per-portal theme tokens (violet/slate/blue/emerald) - PortalLoginShell redesigned: two-column with gradient branding panel, dotted pattern, value-prop highlights, built-in back link - New shadcn components: Avatar, DropdownMenu, Skeleton - Move shared DraftCard to _components/draft-card.tsx (used by 2 portals) - Portal selector: remove Super Admin card, icon tiles, hover lift - All 4 login pages use react-hook-form + Zod + themed shell - Member nav restored to full 11-section list with icons Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
74 lines
2.7 KiB
TypeScript
74 lines
2.7 KiB
TypeScript
import Link from 'next/link';
|
|
import { ArrowRight, Building2, Network, UserRound } from 'lucide-react';
|
|
|
|
const PORTALS = [
|
|
{
|
|
href: '/org/login',
|
|
title: 'Organisation',
|
|
description: 'Manage chapters, org-wide rules and admin access.',
|
|
icon: Network,
|
|
iconWrap: 'bg-violet-100 text-violet-600',
|
|
ring: 'hover:ring-violet-200 hover:border-violet-300',
|
|
},
|
|
{
|
|
href: '/login',
|
|
title: 'Chapter',
|
|
description: 'Approve messages, manage groups and routing rules.',
|
|
icon: Building2,
|
|
iconWrap: 'bg-blue-100 text-blue-600',
|
|
ring: 'hover:ring-blue-200 hover:border-blue-300',
|
|
},
|
|
{
|
|
href: '/member-login',
|
|
title: 'Member',
|
|
description: 'View digests, manage privacy and explore your community.',
|
|
icon: UserRound,
|
|
iconWrap: 'bg-emerald-100 text-emerald-600',
|
|
ring: 'hover:ring-emerald-200 hover:border-emerald-300',
|
|
},
|
|
];
|
|
|
|
export default function Home() {
|
|
return (
|
|
<div className="min-h-screen flex items-center justify-center bg-gradient-to-b from-muted/40 to-background p-6">
|
|
<div className="w-full max-w-md space-y-10">
|
|
<div className="text-center space-y-3">
|
|
<div className="inline-flex size-12 rounded-2xl bg-gradient-to-br from-slate-700 to-slate-900 items-center justify-center text-white font-bold text-xl shadow-lg mx-auto">
|
|
T
|
|
</div>
|
|
<div className="space-y-1">
|
|
<h1 className="text-2xl font-bold tracking-tight">Welcome to TOWER</h1>
|
|
<p className="text-sm text-muted-foreground">Choose how you want to sign in</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="space-y-3">
|
|
{PORTALS.map((p) => {
|
|
const Icon = p.icon;
|
|
return (
|
|
<Link
|
|
key={p.href}
|
|
href={p.href}
|
|
className={`group flex items-center gap-4 bg-card rounded-2xl border p-4 shadow-sm ring-1 ring-transparent transition-all hover:shadow-md ${p.ring}`}
|
|
>
|
|
<div className={`size-11 rounded-xl flex items-center justify-center shrink-0 ${p.iconWrap}`}>
|
|
<Icon className="size-5" />
|
|
</div>
|
|
<div className="flex-1 min-w-0">
|
|
<p className="font-semibold text-sm">{p.title} Portal</p>
|
|
<p className="text-xs text-muted-foreground leading-relaxed mt-0.5">{p.description}</p>
|
|
</div>
|
|
<ArrowRight className="size-4 text-muted-foreground shrink-0 transition-transform group-hover:translate-x-0.5" />
|
|
</Link>
|
|
);
|
|
})}
|
|
</div>
|
|
|
|
<p className="text-center text-xs text-muted-foreground">
|
|
Access is provisioned by your organisation admin
|
|
</p>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|