feat: add dashboard pages for documents, projects, and team management with AI-powered insights

app/(dashboard)/documents/page.tsx

@@ -1,17 +1,154 @@
+"use client";
+
+import { Plus, Search, Filter, Brain, FileText, Download, MoreHorizontal, FileSpreadsheet, FileIcon, MessageSquare } from "lucide-react";
+
+// Mock Data
+const documents = [
+  {
+    id: 1,
+    name: "Q3 Strategy Planning.docx",
+    type: "word",
+    size: "2.4 MB",
+    updated: "2 hours ago",
+    aiStatus: "Summarized",
+    aiSummary: "Focuses on user acquisition and shifting marketing budget to TikTok ads. AI extracted 4 key action items."
+  },
+  {
+    id: 2,
+    name: "Financial_Report_May.xlsx",
+    type: "excel",
+    size: "5.1 MB",
+    updated: "Yesterday",
+    aiStatus: "Analyzing",
+    aiSummary: "AI is currently detecting anomalies in the Q2 vs Q3 expense margins."
+  },
+  {
+    id: 3,
+    name: "Design_System_Guidelines.pdf",
+    type: "pdf",
+    size: "12 MB",
+    updated: "May 04, 2026",
+    aiStatus: "Summarized",
+    aiSummary: "Details the new dark mode color tokens (#0A0710). AI created a searchable index for developers."
+  },
+  {
+    id: 4,
+    name: "Client_Feedback_Transcript.txt",
+    type: "text",
+    size: "145 KB",
+    updated: "May 01, 2026",
+    aiStatus: "Action Required",
+    aiSummary: "Sentiment analysis is extremely negative regarding the login flow. AI flagged this for urgent review."
+  }
+];
+
 export default function DocumentsPage() {
   return (
-    <div className="space-y-6">
+    <div className="mx-auto max-w-7xl animate-in fade-in slide-in-from-bottom-4 duration-500 h-full flex flex-col text-foreground font-sans space-y-6">
-      <div className="flex items-center justify-between">
+      
-        <div>
+      {/* Top Header */}
-          <h1 className="text-3xl font-bold tracking-tight text-foreground">Dökümanlar</h1>
+      <div className="flex items-center justify-between pb-4 border-b border-white/5 mt-4">
-          <p className="text-muted-foreground mt-2">
+        <h1 className="text-lg font-medium text-muted-foreground">
-            Notlarınızı, raporlarınızı ve belgelerinizi saklayın.
+          <span className="text-foreground">Management</span> / Documents
-          </p>
+        </h1>
+        <div className="flex items-center gap-3">
+          <div className="bg-[#150F1D] border border-white/5 rounded-sm px-3 py-1.5 flex items-center gap-2">
+            <Search className="h-4 w-4 text-muted-foreground" />
+            <input 
+              type="text" 
+              placeholder="Search documents or ask AI..." 
+              className="bg-transparent border-none outline-none text-xs w-64 placeholder:text-muted-foreground/50 text-foreground"
+            />
+          </div>
+          <button className="bg-primary hover:bg-primary/90 text-primary-foreground border border-primary/20 px-4 py-1.5 rounded-sm text-xs font-semibold flex items-center gap-2 transition-colors">
+            <Plus className="h-4 w-4" />
+            UPLOAD
+          </button>
         </div>
       </div>
-      <div className="rounded-2xl border border-white/5 bg-white/5 p-8 text-center text-muted-foreground">
+
-        Döküman yönetim modülü yakında eklenecek.
+      {/* AI Semantic Search Banner */}
+      <div className="rounded-sm border border-primary/20 bg-[linear-gradient(90deg,rgba(108,91,176,0.1)_0%,rgba(10,7,16,0)_100%)] p-6 flex flex-col gap-4">
+        <div className="flex items-center gap-2">
+          <Brain className="h-5 w-5 text-primary" />
+          <h2 className="text-sm font-semibold">Talk to your Workspace</h2>
+        </div>
+        <p className="text-xs text-muted-foreground w-1/2 leading-relaxed">
+          The AI has indexed 1,240 documents. Instead of searching by keywords, ask a direct question like <em>"What were the key takeaways from the Q3 Strategy?"</em>
+        </p>
+        <div className="flex gap-2">
+          <input 
+            type="text" 
+            placeholder="Ask anything about your files..." 
+            className="flex-1 bg-[#0A0710] border border-white/10 rounded-sm px-4 py-2 text-sm outline-none focus:border-primary/50 transition-colors"
+          />
+          <button className="bg-primary hover:bg-primary/90 text-primary-foreground px-6 py-2 rounded-sm text-sm font-semibold transition-colors">
+            Ask AI
+          </button>
+        </div>
       </div>
+
+      {/* Document List */}
+      <div className="grid grid-cols-1 gap-4">
+        {documents.map((doc) => (
+          <div key={doc.id} className="rounded-sm border border-white/5 bg-[#0A0710] p-5 flex flex-col md:flex-row md:items-center gap-6 group hover:border-white/10 transition-colors">
+            
+            {/* File Info */}
+            <div className="flex items-center gap-4 min-w-[300px]">
+              <div className={`p-3 rounded-sm flex items-center justify-center shrink-0 ${
+                doc.type === 'word' ? 'bg-blue-500/10 text-blue-400' :
+                doc.type === 'excel' ? 'bg-emerald-500/10 text-emerald-400' :
+                doc.type === 'pdf' ? 'bg-red-500/10 text-red-400' :
+                'bg-white/10 text-foreground'
+              }`}>
+                {doc.type === 'word' ? <FileText className="h-6 w-6" /> :
+                 doc.type === 'excel' ? <FileSpreadsheet className="h-6 w-6" /> :
+                 <FileIcon className="h-6 w-6" />}
+              </div>
+              <div className="min-w-0">
+                <h3 className="text-sm font-semibold truncate hover:text-primary cursor-pointer transition-colors mb-1">{doc.name}</h3>
+                <div className="flex items-center gap-3 text-xs text-muted-foreground">
+                  <span>{doc.size}</span>
+                  <span className="w-1 h-1 rounded-full bg-white/20"></span>
+                  <span>{doc.updated}</span>
+                </div>
+              </div>
+            </div>
+
+            {/* AI Insight */}
+            <div className="flex-1 flex flex-col bg-[#150F1D]/50 border border-white/5 p-3 rounded-sm relative overflow-hidden">
+              <div className="absolute left-0 top-0 bottom-0 w-0.5 bg-primary/50"></div>
+              <div className="flex items-center gap-2 mb-1.5">
+                <Brain className="h-3 w-3 text-primary" />
+                <span className={`text-[10px] font-bold uppercase tracking-wider ${
+                  doc.aiStatus === 'Action Required' ? 'text-red-400' :
+                  doc.aiStatus === 'Analyzing' ? 'text-orange-400 animate-pulse' :
+                  'text-primary'
+                }`}>{doc.aiStatus}</span>
+              </div>
+              <p className="text-[11px] text-muted-foreground leading-snug">
+                {doc.aiSummary}
+              </p>
+            </div>
+
+            {/* Actions */}
+            <div className="flex items-center gap-2">
+              <button className="bg-primary/10 hover:bg-primary/20 text-primary border border-primary/20 px-3 py-1.5 rounded-sm text-xs font-semibold flex items-center gap-2 transition-colors">
+                <MessageSquare className="h-3.5 w-3.5" />
+                Chat
+              </button>
+              <button className="p-2 hover:bg-white/5 rounded-sm text-muted-foreground transition-colors">
+                <Download className="h-4 w-4" />
+              </button>
+              <button className="p-2 hover:bg-white/5 rounded-sm text-muted-foreground transition-colors">
+                <MoreHorizontal className="h-4 w-4" />
+              </button>
+            </div>
+
+          </div>
+        ))}
+      </div>
+
     </div>
   );
 }

app/(dashboard)/projects/page.tsx

@@ -1,17 +1,166 @@
+"use client";
+
+import { Plus, Search, Filter, Brain, AlertCircle, Clock, CheckCircle2, MoreHorizontal, Users, BarChart } from "lucide-react";
+
+// Mock Data
+const projects = [
+  {
+    id: 1,
+    name: "Cognis Mobile App",
+    status: "In Progress",
+    progress: 65,
+    dueDate: "May 28, 2026",
+    team: ["JD", "AK", "LM"],
+    aiRisk: "Low",
+    aiSuggestion: "On track. Consistent velocity detected."
+  },
+  {
+    id: 2,
+    name: "Q3 Marketing Site",
+    status: "At Risk",
+    progress: 32,
+    dueDate: "Jun 15, 2026",
+    team: ["RK", "ST"],
+    aiRisk: "High",
+    aiSuggestion: "Bottleneck detected in Design phase. Suggest assigning 1 more designer."
+  },
+  {
+    id: 3,
+    name: "Database Migration",
+    status: "Review",
+    progress: 90,
+    dueDate: "May 20, 2026",
+    team: ["JS", "AL", "BQ", "MK"],
+    aiRisk: "Medium",
+    aiSuggestion: "QA testing is taking 20% longer than historical average."
+  },
+  {
+    id: 4,
+    name: "User Authentication V2",
+    status: "To Do",
+    progress: 0,
+    dueDate: "Jul 01, 2026",
+    team: ["AK", "LM"],
+    aiRisk: "Low",
+    aiSuggestion: "Dependencies cleared. Ready to start."
+  }
+];
+
 export default function ProjectsPage() {
   return (
-    <div className="space-y-6">
+    <div className="mx-auto max-w-7xl animate-in fade-in slide-in-from-bottom-4 duration-500 h-full flex flex-col text-foreground font-sans space-y-6">
-      <div className="flex items-center justify-between">
+      
-        <div>
+      {/* Top Header */}
-          <h1 className="text-3xl font-bold tracking-tight text-foreground">Projeler</h1>
+      <div className="flex items-center justify-between pb-4 border-b border-white/5 mt-4">
-          <p className="text-muted-foreground mt-2">
+        <h1 className="text-lg font-medium text-muted-foreground">
-            Geniş çaplı projelerinizi ve aşamalarını takip edin.
+          <span className="text-foreground">Management</span> / Projects
-          </p>
+        </h1>
+        <div className="flex items-center gap-3">
+          <div className="bg-[#150F1D] border border-white/5 rounded-sm px-3 py-1.5 flex items-center gap-2">
+            <Search className="h-4 w-4 text-muted-foreground" />
+            <input 
+              type="text" 
+              placeholder="Search projects..." 
+              className="bg-transparent border-none outline-none text-xs w-48 placeholder:text-muted-foreground/50 text-foreground"
+            />
+          </div>
+          <button className="bg-[#150F1D] hover:bg-white/5 text-foreground border border-white/10 px-3 py-1.5 rounded-sm text-xs font-semibold flex items-center gap-2 transition-colors">
+            <Filter className="h-4 w-4" />
+          </button>
+          <button className="bg-primary hover:bg-primary/90 text-primary-foreground border border-primary/20 px-4 py-1.5 rounded-sm text-xs font-semibold flex items-center gap-2 transition-colors">
+            <Plus className="h-4 w-4" />
+            NEW PROJECT
+          </button>
         </div>
       </div>
-      <div className="rounded-2xl border border-white/5 bg-white/5 p-8 text-center text-muted-foreground">
+
-        Proje yönetim modülü yakında eklenecek.
+      {/* AI Project Manager Insight */}
+      <div className="rounded-sm border border-primary/20 bg-primary/5 p-6 flex items-start gap-4">
+        <div className="p-3 bg-primary/10 rounded-sm">
+          <Brain className="h-6 w-6 text-primary" />
+        </div>
+        <div className="flex-1">
+          <h3 className="text-sm font-semibold text-primary mb-1 flex items-center gap-2">
+            AI Project Assistant
+            <span className="bg-primary/20 text-primary text-[9px] uppercase px-1.5 py-0.5 rounded-sm">Active</span>
+          </h3>
+          <p className="text-xs text-foreground/80 leading-relaxed mb-3">
+            I have analyzed your active projects. <strong>Q3 Marketing Site</strong> is showing a high risk of delay based on current commit velocity. 
+            I recommend redistributing tasks or extending the deadline by 4 days.
+          </p>
+          <div className="flex gap-3">
+            <button className="bg-primary hover:bg-primary/90 text-primary-foreground px-4 py-1.5 rounded-sm text-xs font-semibold transition-colors">
+              Apply AI Reallocation
+            </button>
+            <button className="bg-transparent hover:bg-white/5 text-foreground border border-white/10 px-4 py-1.5 rounded-sm text-xs font-semibold transition-colors">
+              View Detailed Analysis
+            </button>
+          </div>
+        </div>
       </div>
+
+      {/* Project Cards Grid */}
+      <div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
+        {projects.map((project) => (
+          <div key={project.id} className="rounded-sm border border-white/5 bg-[#0A0710] flex flex-col group">
+            {/* Card Header */}
+            <div className="p-6 border-b border-white/5 flex justify-between items-start">
+              <div>
+                <div className="flex items-center gap-3 mb-2">
+                  <h2 className="text-base font-semibold">{project.name}</h2>
+                  <span className={`text-[10px] uppercase font-bold px-2 py-0.5 rounded-sm border ${
+                    project.status === 'In Progress' ? 'bg-blue-500/10 text-blue-400 border-blue-500/20' :
+                    project.status === 'At Risk' ? 'bg-red-500/10 text-red-400 border-red-500/20' :
+                    project.status === 'Review' ? 'bg-orange-500/10 text-orange-400 border-orange-500/20' :
+                    'bg-white/5 text-muted-foreground border-white/10'
+                  }`}>
+                    {project.status}
+                  </span>
+                </div>
+                <div className="flex items-center gap-4 text-xs text-muted-foreground">
+                  <div className="flex items-center gap-1.5"><Clock className="h-3.5 w-3.5" /> Due {project.dueDate}</div>
+                  <div className="flex items-center gap-1.5"><Users className="h-3.5 w-3.5" /> {project.team.length} Members</div>
+                </div>
+              </div>
+              <button className="text-muted-foreground hover:text-foreground opacity-0 group-hover:opacity-100 transition-opacity">
+                <MoreHorizontal className="h-5 w-5" />
+              </button>
+            </div>
+
+            {/* AI Risk & Suggestion */}
+            <div className="p-4 bg-[#150F1D]/50 border-b border-white/5 flex gap-3 items-start">
+              {project.aiRisk === "High" ? <AlertCircle className="h-4 w-4 text-red-400 mt-0.5 shrink-0" /> : 
+               project.aiRisk === "Medium" ? <BarChart className="h-4 w-4 text-orange-400 mt-0.5 shrink-0" /> : 
+               <CheckCircle2 className="h-4 w-4 text-emerald-400 mt-0.5 shrink-0" />}
+              <div>
+                <div className="text-[10px] font-bold uppercase tracking-wider mb-0.5 flex items-center gap-1.5">
+                  <Brain className="h-3 w-3" />
+                  AI Risk: <span className={
+                    project.aiRisk === 'High' ? 'text-red-400' : 
+                    project.aiRisk === 'Medium' ? 'text-orange-400' : 'text-emerald-400'
+                  }>{project.aiRisk}</span>
+                </div>
+                <p className="text-xs text-muted-foreground">{project.aiSuggestion}</p>
+              </div>
+            </div>
+
+            {/* Progress & Actions */}
+            <div className="p-6 mt-auto">
+              <div className="flex justify-between items-center mb-2">
+                <span className="text-xs font-medium">Progress</span>
+                <span className="text-xs font-bold text-primary">{project.progress}%</span>
+              </div>
+              <div className="h-1.5 w-full bg-white/5 rounded-full overflow-hidden">
+                <div 
+                  className="h-full bg-primary rounded-full transition-all duration-1000" 
+                  style={{ width: `${project.progress}%` }}
+                ></div>
+              </div>
+            </div>
+          </div>
+        ))}
+      </div>
+
     </div>
   );
 }

app/(dashboard)/team/page.tsx

@@ -1,17 +1,165 @@
+"use client";
+
+import { Plus, Search, Filter, Brain, MoreVertical, Mail, Activity, ArrowUpRight } from "lucide-react";
+
+// Mock Data
+const teamMembers = [
+  {
+    id: 1,
+    name: "Sarah Jenkins",
+    role: "Lead Designer",
+    capacity: 95,
+    status: "Overloaded",
+    aiInsight: "Sarah is operating at 95% capacity. AI suggests delaying non-critical UI reviews."
+  },
+  {
+    id: 2,
+    name: "Alex Rivera",
+    role: "Frontend Engineer",
+    capacity: 60,
+    status: "Optimal",
+    aiInsight: "Alex has high availability. Perfect candidate for the Q3 Marketing Site bottleneck."
+  },
+  {
+    id: 3,
+    name: "Michael Chen",
+    role: "Backend Engineer",
+    capacity: 85,
+    status: "Busy",
+    aiInsight: "Consistent high output. AI predicts 100% sprint completion."
+  },
+  {
+    id: 4,
+    name: "Emma Watson",
+    role: "Product Manager",
+    capacity: 75,
+    status: "Optimal",
+    aiInsight: "Meetings occupy 60% of Emma's time. AI recommends a no-meeting day on Thursdays."
+  }
+];
+
 export default function TeamPage() {
   return (
-    <div className="space-y-6">
+    <div className="mx-auto max-w-7xl animate-in fade-in slide-in-from-bottom-4 duration-500 h-full flex flex-col text-foreground font-sans space-y-6">
-      <div className="flex items-center justify-between">
+      
-        <div>
+      {/* Top Header */}
-          <h1 className="text-3xl font-bold tracking-tight text-foreground">Ekip / Kişiler</h1>
+      <div className="flex items-center justify-between pb-4 border-b border-white/5 mt-4">
-          <p className="text-muted-foreground mt-2">
+        <h1 className="text-lg font-medium text-muted-foreground">
-            Birlikte çalıştığınız kişileri ve takım koordinasyonunu yönetin.
+          <span className="text-foreground">Management</span> / Team Directory
-          </p>
+        </h1>
+        <div className="flex items-center gap-3">
+          <div className="bg-[#150F1D] border border-white/5 rounded-sm px-3 py-1.5 flex items-center gap-2">
+            <Search className="h-4 w-4 text-muted-foreground" />
+            <input 
+              type="text" 
+              placeholder="Search team..." 
+              className="bg-transparent border-none outline-none text-xs w-48 placeholder:text-muted-foreground/50 text-foreground"
+            />
+          </div>
+          <button className="bg-primary hover:bg-primary/90 text-primary-foreground border border-primary/20 px-4 py-1.5 rounded-sm text-xs font-semibold flex items-center gap-2 transition-colors">
+            <Plus className="h-4 w-4" />
+            INVITE MEMBER
+          </button>
         </div>
       </div>
-      <div className="rounded-2xl border border-white/5 bg-white/5 p-8 text-center text-muted-foreground">
+
-        Ekip modülü yakında eklenecek.
+      {/* AI Team Analytics */}
+      <div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
+        <div className="rounded-sm border border-primary/20 bg-primary/5 p-6 lg:col-span-2 flex items-center gap-6">
+          <div className="p-4 bg-primary/10 rounded-full">
+            <Brain className="h-8 w-8 text-primary" />
+          </div>
+          <div>
+            <h3 className="text-sm font-semibold text-primary mb-2 flex items-center gap-2">
+              AI Team Optimizer
+            </h3>
+            <p className="text-xs text-foreground/80 leading-relaxed">
+              Overall team velocity is up 14% this month. However, design resources are critically low. 
+              <strong> Sarah Jenkins</strong> is at high risk of burnout. Would you like me to draft a capacity redistribution plan?
+            </p>
+            <button className="mt-3 bg-primary hover:bg-primary/90 text-primary-foreground px-4 py-1.5 rounded-sm text-xs font-semibold transition-colors">
+              Generate Reallocation Plan
+            </button>
+          </div>
+        </div>
+
+        <div className="rounded-sm border border-white/5 bg-[#0A0710] p-6 flex flex-col justify-center">
+          <h3 className="text-xs font-semibold uppercase tracking-wider text-muted-foreground mb-4">Team Health Score</h3>
+          <div className="flex items-end gap-3 mb-2">
+            <span className="text-5xl font-bold text-emerald-400">8.4</span>
+            <span className="text-xs text-emerald-500 flex items-center font-medium mb-1">
+              <ArrowUpRight className="h-3 w-3 mr-0.5" /> 0.3
+            </span>
+          </div>
+          <div className="text-[11px] text-muted-foreground">Calculated by AI based on velocity and load</div>
+        </div>
       </div>
+
+      {/* Team Roster */}
+      <div className="bg-[#0A0710] rounded-sm border border-white/5 overflow-hidden">
+        <div className="grid grid-cols-12 gap-4 p-4 border-b border-white/5 bg-[#0F0B15]/50 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground">
+          <div className="col-span-4">Member</div>
+          <div className="col-span-3">Capacity / Status</div>
+          <div className="col-span-4">AI Insight</div>
+          <div className="col-span-1 text-right">Actions</div>
+        </div>
+        
+        <div className="divide-y divide-white/5">
+          {teamMembers.map((member) => (
+            <div key={member.id} className="grid grid-cols-12 gap-4 p-4 items-center hover:bg-white/[0.02] transition-colors group">
+              {/* Member Info */}
+              <div className="col-span-4 flex items-center gap-3">
+                <div className="h-10 w-10 rounded-sm bg-[#1F172B] border border-white/10 flex items-center justify-center font-bold text-primary">
+                  {member.name.split(' ').map(n => n[0]).join('')}
+                </div>
+                <div>
+                  <div className="text-sm font-medium">{member.name}</div>
+                  <div className="text-xs text-muted-foreground">{member.role}</div>
+                </div>
+              </div>
+
+              {/* Capacity */}
+              <div className="col-span-3">
+                <div className="flex items-center gap-2 mb-1.5">
+                  <div className="flex-1 h-1.5 bg-white/5 rounded-full overflow-hidden">
+                    <div 
+                      className={`h-full rounded-full ${member.capacity > 85 ? 'bg-red-500' : member.capacity > 65 ? 'bg-orange-500' : 'bg-emerald-500'}`}
+                      style={{ width: `${member.capacity}%` }}
+                    ></div>
+                  </div>
+                  <span className="text-xs font-bold w-8 text-right">{member.capacity}%</span>
+                </div>
+                <span className={`text-[10px] uppercase font-bold px-1.5 py-0.5 rounded-sm border inline-block ${
+                    member.status === 'Overloaded' ? 'bg-red-500/10 text-red-400 border-red-500/20' :
+                    member.status === 'Busy' ? 'bg-orange-500/10 text-orange-400 border-orange-500/20' :
+                    'bg-emerald-500/10 text-emerald-400 border-emerald-500/20'
+                  }`}>
+                    {member.status}
+                </span>
+              </div>
+
+              {/* AI Insight */}
+              <div className="col-span-4 flex items-start gap-2">
+                <Brain className="h-4 w-4 text-primary shrink-0 mt-0.5" />
+                <p className="text-[11px] text-muted-foreground leading-tight">
+                  {member.aiInsight}
+                </p>
+              </div>
+
+              {/* Actions */}
+              <div className="col-span-1 flex justify-end gap-2 opacity-0 group-hover:opacity-100 transition-opacity">
+                <button className="p-1.5 hover:bg-white/10 rounded-sm text-muted-foreground hover:text-foreground transition-colors">
+                  <Mail className="h-4 w-4" />
+                </button>
+                <button className="p-1.5 hover:bg-white/10 rounded-sm text-muted-foreground hover:text-foreground transition-colors">
+                  <MoreVertical className="h-4 w-4" />
+                </button>
+              </div>
+            </div>
+          ))}
+        </div>
+      </div>
+
     </div>
   );
 }