feat(web): add sidebar nav layout and dashboard home page

This commit is contained in:
2026-05-28 01:15:53 +05:30
parent d92476f841
commit f7b3ef5a7c
3 changed files with 42 additions and 7 deletions
+13 -1
View File
@@ -1,4 +1,5 @@
import type { Metadata } from 'next';
import Link from 'next/link';
import './globals.css';
export const metadata: Metadata = {
@@ -9,7 +10,18 @@ export const metadata: Metadata = {
export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
<html lang="en">
<body className="bg-white text-gray-900 antialiased">{children}</body>
<body className="flex min-h-screen bg-gray-50 text-gray-900 antialiased">
<nav className="w-52 shrink-0 bg-white border-r border-gray-200 p-4 flex flex-col gap-1">
<span className="font-bold text-base mb-4">TOWER</span>
<Link href="/search" className="rounded px-3 py-2 text-sm hover:bg-gray-100">
Search
</Link>
<Link href="/groups" className="rounded px-3 py-2 text-sm hover:bg-gray-100">
Groups &amp; Routes
</Link>
</nav>
<main className="flex-1 overflow-auto p-6">{children}</main>
</body>
</html>
);
}
+7 -2
View File
@@ -7,8 +7,13 @@ describe('Home page', () => {
expect(screen.getByRole('heading', { name: /insignia tower/i })).toBeInTheDocument();
});
it('renders the platform tagline', () => {
it('renders a link to the search page', () => {
render(<Home />);
expect(screen.getByText(/community knowledge infrastructure/i)).toBeInTheDocument();
expect(screen.getByRole('link', { name: /search/i })).toHaveAttribute('href', '/search');
});
it('renders a link to the groups page', () => {
render(<Home />);
expect(screen.getByRole('link', { name: /groups/i })).toHaveAttribute('href', '/groups');
});
});
+22 -4
View File
@@ -1,8 +1,26 @@
import Link from 'next/link';
export default function Home() {
return (
<main className="flex min-h-screen flex-col items-center justify-center gap-4">
<h1 className="text-4xl font-bold tracking-tight">Insignia TOWER</h1>
<p className="text-lg text-gray-500">Community Knowledge Infrastructure Platform</p>
</main>
<div className="flex flex-col gap-6 max-w-xl">
<h1 className="text-3xl font-bold tracking-tight">Insignia TOWER</h1>
<p className="text-gray-500">Community Knowledge Infrastructure Platform</p>
<div className="flex gap-4">
<Link
href="/search"
className="flex-1 rounded-xl border border-gray-200 bg-white p-5 hover:border-blue-400 transition-colors"
>
<h2 className="font-semibold mb-1">Search</h2>
<p className="text-sm text-gray-500">Full-text search of approved messages</p>
</Link>
<Link
href="/groups"
className="flex-1 rounded-xl border border-gray-200 bg-white p-5 hover:border-blue-400 transition-colors"
>
<h2 className="font-semibold mb-1">Groups</h2>
<p className="text-sm text-gray-500">Manage groups and sync routes</p>
</Link>
</div>
</div>
);
}