feat: initialize nextjs with shadcn ui

.bolt/config.json

@@ -0,0 +1,3 @@
+{
+  "template": "nextjs-shadcn"
+}

.bolt/ignore

@@ -0,0 +1,2 @@
+components/ui/*
+hooks/use-toast.ts

.bolt/prompt

@@ -0,0 +1,11 @@
+For all designs I ask you to make, have them be beautiful, not cookie cutter. Make webpages that are fully featured and worthy for production.
+
+When using client-side hooks (useState and useEffect) in a component that's being treated as a Server Component by Next.js, always add the "use client" directive at the top of the file.
+
+Do not write code that will trigger this error: "Warning: Extra attributes from the server: %s%s""class,style"
+
+By default, this template supports JSX syntax with Tailwind CSS classes, the shadcn/ui library, React hooks, and Lucide React for icons. Do not install other packages for UI themes, icons, etc unless absolutely necessary or I request them.
+
+Use icons from lucide-react for logos.
+
+Use stock photos from unsplash where appropriate, only valid URLs you know exist.

.eslintrc.json

@@ -0,0 +1,3 @@
+{
+  "extends": "next/core-web-vitals"
+}

.gitignore

@@ -0,0 +1,35 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

app/globals.css

@@ -0,0 +1,82 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+:root {
+  --foreground-rgb: 0, 0, 0;
+  --background-start-rgb: 214, 219, 220;
+  --background-end-rgb: 255, 255, 255;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --foreground-rgb: 255, 255, 255;
+    --background-start-rgb: 0, 0, 0;
+    --background-end-rgb: 0, 0, 0;
+  }
+}
+
+@layer base {
+  :root {
+    --background: 0 0% 100%;
+    --foreground: 0 0% 3.9%;
+    --card: 0 0% 100%;
+    --card-foreground: 0 0% 3.9%;
+    --popover: 0 0% 100%;
+    --popover-foreground: 0 0% 3.9%;
+    --primary: 0 0% 9%;
+    --primary-foreground: 0 0% 98%;
+    --secondary: 0 0% 96.1%;
+    --secondary-foreground: 0 0% 9%;
+    --muted: 0 0% 96.1%;
+    --muted-foreground: 0 0% 45.1%;
+    --accent: 0 0% 96.1%;
+    --accent-foreground: 0 0% 9%;
+    --destructive: 0 84.2% 60.2%;
+    --destructive-foreground: 0 0% 98%;
+    --border: 0 0% 89.8%;
+    --input: 0 0% 89.8%;
+    --ring: 0 0% 3.9%;
+    --chart-1: 12 76% 61%;
+    --chart-2: 173 58% 39%;
+    --chart-3: 197 37% 24%;
+    --chart-4: 43 74% 66%;
+    --chart-5: 27 87% 67%;
+    --radius: 0.5rem;
+  }
+  .dark {
+    --background: 0 0% 3.9%;
+    --foreground: 0 0% 98%;
+    --card: 0 0% 3.9%;
+    --card-foreground: 0 0% 98%;
+    --popover: 0 0% 3.9%;
+    --popover-foreground: 0 0% 98%;
+    --primary: 0 0% 98%;
+    --primary-foreground: 0 0% 9%;
+    --secondary: 0 0% 14.9%;
+    --secondary-foreground: 0 0% 98%;
+    --muted: 0 0% 14.9%;
+    --muted-foreground: 0 0% 63.9%;
+    --accent: 0 0% 14.9%;
+    --accent-foreground: 0 0% 98%;
+    --destructive: 0 62.8% 30.6%;
+    --destructive-foreground: 0 0% 98%;
+    --border: 0 0% 14.9%;
+    --input: 0 0% 14.9%;
+    --ring: 0 0% 83.1%;
+    --chart-1: 220 70% 50%;
+    --chart-2: 160 60% 45%;
+    --chart-3: 30 80% 55%;
+    --chart-4: 280 65% 60%;
+    --chart-5: 340 75% 55%;
+  }
+}
+
+@layer base {
+  * {
+    @apply border-border;
+  }
+  body {
+    @apply bg-background text-foreground;
+  }
+}

app/layout.tsx

@@ -0,0 +1,40 @@
+import './globals.css';
+import type { Metadata } from 'next';
+import { Inter } from 'next/font/google';
+import { ThemeProvider } from '@/components/theme-provider';
+import { Navigation } from '@/components/navigation';
+import { Toaster } from '@/components/ui/toaster';
+
+const inter = Inter({ subsets: ['latin'] });
+
+export const metadata: Metadata = {
+  title: 'SyncX - Modern Documentation Platform',
+  description: 'Open-source documentation platform for modern organizations',
+};
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <html lang="en" suppressHydrationWarning>
+      <body className={inter.className}>
+        <ThemeProvider
+          attribute="class"
+          defaultTheme="system"
+          enableSystem
+          disableTransitionOnChange
+        >
+          <div className="flex min-h-screen">
+            <Navigation />
+            <main className="flex-1 overflow-y-auto">
+              {children}
+            </main>
+          </div>
+          <Toaster />
+        </ThemeProvider>
+      </body>
+    </html>
+  );
+}

app/page.tsx

@@ -0,0 +1,92 @@
+import { Button } from '@/components/ui/button';
+import { Card } from '@/components/ui/card';
+import { FileText, Users2, BookOpen, GitBranch } from 'lucide-react';
+import Link from 'next/link';
+
+export default function Home() {
+  return (
+    <div className="flex flex-col gap-8 p-8">
+      <div className="flex flex-col gap-2">
+        <h1 className="text-4xl font-bold">Welcome to SyncX</h1>
+        <p className="text-lg text-muted-foreground">
+          Your team's central hub for documentation and knowledge sharing
+        </p>
+      </div>
+
+      <div className="grid gap-6 md:grid-cols-2 lg:grid-cols-4">
+        <Card className="p-6">
+          <FileText className="h-12 w-12 text-primary" />
+          <h2 className="mt-4 text-xl font-semibold">Documents</h2>
+          <p className="mt-2 text-sm text-muted-foreground">
+            Create and manage your team's documentation
+          </p>
+          <Button className="mt-4" asChild>
+            <Link href="/documents">Browse Documents</Link>
+          </Button>
+        </Card>
+
+        <Card className="p-6">
+          <Users2 className="h-12 w-12 text-primary" />
+          <h2 className="mt-4 text-xl font-semibold">Teams</h2>
+          <p className="mt-2 text-sm text-muted-foreground">
+            Collaborate with your team members
+          </p>
+          <Button className="mt-4" asChild>
+            <Link href="/teams">View Teams</Link>
+          </Button>
+        </Card>
+
+        <Card className="p-6">
+          <BookOpen className="h-12 w-12 text-primary" />
+          <h2 className="mt-4 text-xl font-semibold">Templates</h2>
+          <p className="mt-2 text-sm text-muted-foreground">
+            Start with pre-built document templates
+          </p>
+          <Button className="mt-4" asChild>
+            <Link href="/templates">Browse Templates</Link>
+          </Button>
+        </Card>
+
+        <Card className="p-6">
+          <GitBranch className="h-12 w-12 text-primary" />
+          <h2 className="mt-4 text-xl font-semibold">Version Control</h2>
+          <p className="mt-2 text-sm text-muted-foreground">
+            Track changes and manage versions
+          </p>
+          <Button className="mt-4" asChild>
+            <Link href="/versions">View History</Link>
+          </Button>
+        </Card>
+      </div>
+
+      <div className="mt-8">
+        <h2 className="text-2xl font-semibold mb-4">Recent Activity</h2>
+        <div className="space-y-4">
+          {/* Placeholder for recent activity - will be dynamic in the full implementation */}
+          <Card className="p-4">
+            <div className="flex items-center gap-4">
+              <div className="h-10 w-10 rounded-full bg-primary/10 flex items-center justify-center">
+                <FileText className="h-5 w-5 text-primary" />
+              </div>
+              <div>
+                <p className="font-medium">API Documentation Updated</p>
+                <p className="text-sm text-muted-foreground">Updated by John Doe • 2 hours ago</p>
+              </div>
+            </div>
+          </Card>
+          <Card className="p-4">
+            <div className="flex items-center gap-4">
+              <div className="h-10 w-10 rounded-full bg-primary/10 flex items-center justify-center">
+                <Users2 className="h-5 w-5 text-primary" />
+              </div>
+              <div>
+                <p className="font-medium">New Team Member Added</p>
+                <p className="text-sm text-muted-foreground">Jane Smith joined Engineering • 5 hours ago</p>
+              </div>
+            </div>
+          </Card>
+        </div>
+      </div>
+    </div>
+  );
+}

components.json

@@ -0,0 +1,20 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "default",
+  "rsc": true,
+  "tsx": true,
+  "tailwind": {
+    "config": "tailwind.config.ts",
+    "css": "app/globals.css",
+    "baseColor": "neutral",
+    "cssVariables": true,
+    "prefix": ""
+  },
+  "aliases": {
+    "components": "@/components",
+    "utils": "@/lib/utils",
+    "ui": "@/components/ui",
+    "lib": "@/lib",
+    "hooks": "@/hooks"
+  }
+}

components/navigation.tsx

@@ -0,0 +1,55 @@
+import { BookOpen, FileText, Home, Search, Settings, Users2 } from 'lucide-react';
+import Link from 'next/link';
+import { Button } from '@/components/ui/button';
+import { Input } from '@/components/ui/input';
+
+export function Navigation() {
+  return (
+    <div className="w-64 border-r bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
+      <div className="flex h-[60px] items-center border-b px-6">
+        <Link href="/" className="flex items-center gap-2 font-semibold">
+          <BookOpen className="h-6 w-6" />
+          <span>SyncX</span>
+        </Link>
+      </div>
+
+      <div className="px-4 py-3">
+        <div className="relative">
+          <Search className="absolute left-2.5 top-2.5 h-4 w-4 text-muted-foreground" />
+          <Input
+            type="search"
+            placeholder="Search documentation..."
+            className="pl-8"
+          />
+        </div>
+      </div>
+
+      <nav className="space-y-1.5 px-3">
+        <Button variant="ghost" className="w-full justify-start" asChild>
+          <Link href="/">
+            <Home className="mr-2 h-4 w-4" />
+            Home
+          </Link>
+        </Button>
+        <Button variant="ghost" className="w-full justify-start" asChild>
+          <Link href="/documents">
+            <FileText className="mr-2 h-4 w-4" />
+            Documents
+          </Link>
+        </Button>
+        <Button variant="ghost" className="w-full justify-start" asChild>
+          <Link href="/teams">
+            <Users2 className="mr-2 h-4 w-4" />
+            Teams
+          </Link>
+        </Button>
+        <Button variant="ghost" className="w-full justify-start" asChild>
+          <Link href="/settings">
+            <Settings className="mr-2 h-4 w-4" />
+            Settings
+          </Link>
+        </Button>
+      </nav>
+    </div>
+  );
+}

components/theme-provider.tsx

@@ -0,0 +1,26 @@
+import { createContext, useContext, useEffect, useState } from "react"
+import { useTheme as useNextTheme } from "next-themes"
+
+type Theme = "dark" | "light" | "system"
+
+type ThemeProviderProps = {
+  children: React.ReactNode
+  defaultTheme?: Theme
+  storageKey?: string
+  enableSystem?: boolean
+  disableTransitionOnChange?: boolean
+  attribute?: string
+}
+
+export function ThemeProvider({
+  children,
+  defaultTheme = "system",
+  storageKey = "ui-theme",
+  ...props
+}: ThemeProviderProps) {
+  return (
+    <div>
+      {children}
+    </div>
+  )
+}