PreRelease v2

app/(dashboard)/contacts/layout.tsx

@@ -1,5 +1,11 @@
 import { redirect } from "next/navigation";
 import { auth } from "@clerk/nextjs/server";
+import { Metadata } from "next";
+
+export const metadata: Metadata = {
+  title: "Contracts | LexiChain",
+  description: "Upload, manage, and analyze your financial contracts with LexiChain's AI.",
+};
 
 export default async function ContactsLayout({
   children,

app/(dashboard)/contacts/page.tsx

@@ -1,11 +1,11 @@
 "use client";
 
-import { ContractUploadForm } from "@/components/views/dashboard/contract-upload-form";
-import { EmptyContractsState } from "@/components/views/dashboard/empty-contracts-state";
-import { ContractsList } from "@/components/views/dashboard/contracts-list";
-import { ContactsHeader } from "@/components/views/dashboard/contacts-header";
+import { ContractUploadForm } from "@/features/contracts/components/forms/contract-upload-form";
+import { EmptyContractsState } from "@/features/contracts/components/list/empty-contracts-state";
+import { ContractsList } from "@/features/contracts/components/list/contracts-list";
+import { ContactsHeader } from "@/components/layout/contacts-header";
 import { useState, useEffect } from "react";
-import { getContracts } from "@/lib/actions/contract.action";
+import { getContracts } from "@/features/contracts/api/contract.action";
 import { Card } from "@/components/ui/card";
 
 export default function ContactsPage() {

app/(dashboard)/dashboard/page.tsx

@@ -19,13 +19,14 @@ import {
 } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import { Card } from "@/components/ui/card";
-import { getStatsAction } from "@/lib/actions/stats.action";
-import { checkDeadlineNotifications } from "@/lib/actions/notification.action";
-import {
-  ContractStatusChart,
-  ContractTypeChart,
-  TrendChart,
-} from "@/components/views/dashboard/charts";
+import { getStatsAction } from "@/features/analytics/api/stats.action";
+import { checkDeadlineNotifications } from "@/features/notifications/api/notification.action";
+import dynamic from "next/dynamic";
+
+// Dynamically import heavy charting libraries to dramatically improve initial load and rendering time
+const ContractStatusChart = dynamic(() => import("@/features/analytics/components/charts").then(mod => mod.ContractStatusChart), { ssr: false, loading: () => <div className="h-full w-full animate-pulse bg-muted/30 rounded-lg"></div> });
+const ContractTypeChart = dynamic(() => import("@/features/analytics/components/charts").then(mod => mod.ContractTypeChart), { ssr: false, loading: () => <div className="h-full w-full animate-pulse bg-muted/30 rounded-lg"></div> });
+const TrendChart = dynamic(() => import("@/features/analytics/components/charts").then(mod => mod.TrendChart), { ssr: false, loading: () => <div className="h-full w-full animate-pulse bg-muted/30 rounded-lg"></div> });
 
 interface DashboardStats {
   totalContracts: number;

app/(dashboard)/layout.tsx

@@ -1,6 +1,12 @@
 import { auth } from "@clerk/nextjs/server";
 import { redirect } from "next/navigation";
-import { DashboardNavigation } from "@/components/views/dashboard/navigation";
+import { DashboardNavigation } from "@/components/layout/navigation";
+import { Metadata } from "next";
+
+export const metadata: Metadata = {
+  title: "Dashboard | LexiChain Contract Intelligence",
+  description: "View and manage your AI-processed financial contracts, analytics, and metrics in real time.",
+};
 
 export default async function DashboardLayout({
   children,

app/globals.css

@@ -123,6 +123,60 @@
   :focus-visible {
     @apply outline-none ring-2 ring-primary ring-offset-2;
   }
+
+  /* Global branded scrollbar */
+  * {
+    scrollbar-width: thin;
+    scrollbar-color: hsl(var(--primary) / 0.65) hsl(var(--muted));
+  }
+
+  *::-webkit-scrollbar {
+    width: 11px;
+    height: 11px;
+  }
+
+  *::-webkit-scrollbar-track {
+    background: linear-gradient(
+      180deg,
+      hsl(var(--muted)) 0%,
+      hsl(var(--background)) 100%
+    );
+    border-radius: 999px;
+  }
+
+  *::-webkit-scrollbar-thumb {
+    background: linear-gradient(
+      180deg,
+      hsl(var(--primary) / 0.85) 0%,
+      hsl(var(--secondary) / 0.8) 100%
+    );
+    border: 2px solid hsl(var(--background));
+    border-radius: 999px;
+  }
+
+  *::-webkit-scrollbar-thumb:hover {
+    background: linear-gradient(
+      180deg,
+      hsl(var(--primary)) 0%,
+      hsl(var(--accent) / 0.95) 100%
+    );
+  }
+
+  .dark * {
+    scrollbar-color: hsl(var(--primary) / 0.8) hsl(var(--muted));
+  }
+
+  .dark *::-webkit-scrollbar-track {
+    background: linear-gradient(
+      180deg,
+      hsl(var(--muted)) 0%,
+      hsl(var(--background) / 0.92) 100%
+    );
+  }
+
+  .dark *::-webkit-scrollbar-thumb {
+    border-color: hsl(var(--background));
+  }
 }
 
 @layer utilities {

app/page.tsx

@@ -1,4 +1,14 @@
-import { HomePage } from "@/components/views/Home/HomePage";
+import { Metadata } from "next";
+import { HomePage } from "@/features/home/components/HomePage";
+
+export const metadata: Metadata = {
+  title: "LexiChain | AI-Powered Fast Contract Management",
+  description: "Accelerate your BFSI contract management with AI. LexiChain is the premier blockchain-verified platform for smart contracts, loans, and insurance.",
+  openGraph: {
+    title: "LexiChain | AI-Powered Fast Contract Management",
+    description: "Accelerate your BFSI contract management with AI. LexiChain is the premier blockchain-verified platform for smart contracts, loans, and insurance.",
+  }
+};
 
 export default function Home() {
   return <HomePage />;