Add dashboard, layout components, and CRM scaffolding

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-06-27 14:25:37 +05:30
parent ffedda86a9
commit 50b120e184
11 changed files with 238 additions and 64 deletions
+14
View File
@@ -0,0 +1,14 @@
import { Sidebar } from "@/components/layout/sidebar";
export default function DashboardLayout({
children,
}: {
children: React.ReactNode;
}) {
return (
<div className="flex min-h-screen">
<Sidebar />
<div className="flex-1 flex flex-col">{children}</div>
</div>
);
}
+41
View File
@@ -0,0 +1,41 @@
import type { Metadata } from "next";
import { Header } from "@/components/layout/header";
export const metadata: Metadata = {
title: "Dashboard",
};
const stats = [
{ label: "Total Leads", value: "0" },
{ label: "Open Deals", value: "0" },
{ label: "Contacts", value: "0" },
{ label: "Revenue", value: "$0" },
];
export default function DashboardPage() {
return (
<>
<Header title="Dashboard" />
<main className="flex-1 p-6 bg-neutral-50 dark:bg-neutral-900">
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
{stats.map((stat) => (
<div
key={stat.label}
className="rounded-xl border border-black/10 dark:border-white/10 bg-white dark:bg-neutral-950 p-5"
>
<p className="text-sm text-neutral-500">{stat.label}</p>
<p className="mt-2 text-2xl font-semibold">{stat.value}</p>
</div>
))}
</div>
<div className="mt-6 rounded-xl border border-black/10 dark:border-white/10 bg-white dark:bg-neutral-950 p-6">
<p className="text-neutral-500 text-sm">
Yahan pages add karenge Leads, Contacts, Deals, Tasks. Aap batao
kaunsa page pehle banana hai.
</p>
</div>
</main>
</>
);
}
+6 -2
View File
@@ -1,5 +1,6 @@
import type { Metadata } from "next";
import { Geist, Geist_Mono } from "next/font/google";
import { siteConfig } from "@/config/site";
import "./globals.css";
const geistSans = Geist({
@@ -13,8 +14,11 @@ const geistMono = Geist_Mono({
});
export const metadata: Metadata = {
title: "Create Next App",
description: "Generated by create next app",
title: {
default: siteConfig.name,
template: `%s | ${siteConfig.shortName}`,
},
description: siteConfig.description,
};
export default function RootLayout({
+19 -60
View File
@@ -1,65 +1,24 @@
import Image from "next/image";
import Link from "next/link";
import { siteConfig } from "@/config/site";
export default function Home() {
return (
<div className="flex flex-col flex-1 items-center justify-center bg-zinc-50 font-sans dark:bg-black">
<main className="flex flex-1 w-full max-w-3xl flex-col items-center justify-between py-32 px-16 bg-white dark:bg-black sm:items-start">
<Image
className="dark:invert"
src="/next.svg"
alt="Next.js logo"
width={100}
height={20}
priority
/>
<div className="flex flex-col items-center gap-6 text-center sm:items-start sm:text-left">
<h1 className="max-w-xs text-3xl font-semibold leading-10 tracking-tight text-black dark:text-zinc-50">
To get started, edit the page.tsx file.
</h1>
<p className="max-w-md text-lg leading-8 text-zinc-600 dark:text-zinc-400">
Looking for a starting point or more instructions? Head over to{" "}
<a
href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
className="font-medium text-zinc-950 dark:text-zinc-50"
>
Templates
</a>{" "}
or the{" "}
<a
href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
className="font-medium text-zinc-950 dark:text-zinc-50"
>
Learning
</a>{" "}
center.
</p>
</div>
<div className="flex flex-col gap-4 text-base font-medium sm:flex-row">
<a
className="flex h-12 w-full items-center justify-center gap-2 rounded-full bg-foreground px-5 text-background transition-colors hover:bg-[#383838] dark:hover:bg-[#ccc] md:w-[158px]"
href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
target="_blank"
rel="noopener noreferrer"
>
<Image
className="dark:invert"
src="/vercel.svg"
alt="Vercel logomark"
width={16}
height={16}
/>
Deploy Now
</a>
<a
className="flex h-12 w-full items-center justify-center rounded-full border border-solid border-black/[.08] px-5 transition-colors hover:border-transparent hover:bg-black/[.04] dark:border-white/[.145] dark:hover:bg-[#1a1a1a] md:w-[158px]"
href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
target="_blank"
rel="noopener noreferrer"
>
Documentation
</a>
</div>
</main>
</div>
<main className="flex-1 flex flex-col items-center justify-center text-center px-6 py-24">
<span className="text-sm font-medium text-neutral-500">
{siteConfig.shortName}
</span>
<h1 className="mt-3 text-4xl sm:text-5xl font-bold tracking-tight">
{siteConfig.name}
</h1>
<p className="mt-4 max-w-xl text-neutral-500">
{siteConfig.description}
</p>
<Link
href="/dashboard"
className="mt-8 inline-flex items-center rounded-full bg-neutral-900 text-white dark:bg-white dark:text-neutral-900 px-6 py-3 text-sm font-medium hover:opacity-90 transition-opacity"
>
Go to Dashboard
</Link>
</main>
);
}