Upload admin-dashboard/page.tsx

admin-dashboard/page.tsx

@@ -0,0 +1,132 @@
+'use client'
+import { useState } from 'react'
+
+const systemMetrics = [
+  { label:'Active Users', value:'2,847', change:'+12%', good:true },
+  { label:'Vendors Listed', value:'486', change:'+8', good:true },
+  { label:'Active Contracts', value:'1,203', change:'23 disputed', good:false },
+  { label:'Platform Revenue', value:'₨ 4.2M', change:'+15%', good:true },
+]
+
+const moderationQueue = [
+  { id:'1', vendor:'Golden Moments Cinema', type:'New Vendor', issue:'Pending KYC verification', date:'2 hours ago', priority:'high' },
+  { id:'2', vendor:'Bliss Decorators', type:'Content Flag', issue:'3 images flagged for IP review', date:'5 hours ago', priority:'medium' },
+  { id:'3', vendor:'Mountain View Resort', type:'Review Flag', issue:'8 reviews reported as suspicious', date:'1 day ago', priority:'low' },
+  { id:'4', vendor:'Starlit DJ Events', type:'Template Review', issue:'Contract template submitted for approval', date:'2 days ago', priority:'medium' },
+]
+
+export default function AdminDashboard() {
+  const [tab, setTab] = useState('overview')
+
+  return (
+    <div className="min-h-screen bg-ivory-50">
+      <div className="wedding-section py-8">
+        <div className="flex items-center justify-between mb-8">
+          <div>
+            <h1 className="font-heading text-3xl font-semibold text-charcoal-700">Admin Portal</h1>
+            <p className="text-charcoal-400 mt-1">Platform oversight & governance</p>
+          </div>
+          <div className="flex items-center gap-3">
+            <span className="wedding-badge bg-sage-50 text-sage-600">System Healthy</span>
+            <button className="wedding-btn-outline text-sm">Export Report</button>
+          </div>
+        </div>
+
+        <div className="flex gap-1 bg-ivory-100 rounded-xl p-1 mb-6">
+          {['overview','moderation','contracts','users','schema'].map(t=>(
+            <button key={t} onClick={()=>setTab(t)}
+              className={"px-4 py-2 rounded-lg text-sm font-medium capitalize transition-colors "+(tab===t?'bg-white text-charcoal-700 shadow-soft':'text-charcoal-400 hover:text-charcoal-600')}>{t}</button>
+          ))}
+        </div>
+
+        {/* Metrics */}
+        <div className="grid grid-cols-2 md:grid-cols-4 gap-4 mb-8">
+          {systemMetrics.map(m=>(
+            <div key={m.label} className="wedding-card p-5">
+              <p className="text-xs text-charcoal-400 mb-1">{m.label}</p>
+              <p className="font-heading text-2xl font-semibold text-charcoal-700">{m.value}</p>
+              <p className={"text-xs mt-1 "+(m.good?'text-sage-500':'text-rose-500')}>{m.change}</p>
+            </div>
+          ))}
+        </div>
+
+        {/* Moderation Queue */}
+        <div className="wedding-card mb-8">
+          <div className="p-5 border-b border-ivory-200 flex items-center justify-between">
+            <h2 className="font-heading text-lg font-semibold text-charcoal-700">Moderation Queue</h2>
+            <span className="wedding-badge bg-rose-50 text-rose-500">{moderationQueue.length} pending</span>
+          </div>
+          <div className="divide-y divide-ivory-100">
+            {moderationQueue.map(item=>(
+              <div key={item.id} className="p-5 flex items-center justify-between hover:bg-ivory-50 transition-colors">
+                <div>
+                  <div className="flex items-center gap-2 mb-1">
+                    <p className="text-sm font-medium text-charcoal-700">{item.vendor}</p>
+                    <span className="text-xs text-charcoal-400">{item.type}</span>
+                    <span className={"wedding-badge text-xs "+(item.priority==='high'?'bg-rose-50 text-rose-500':item.priority==='medium'?'bg-gold-50 text-gold-600':'bg-ivory-100 text-charcoal-400')}>
+                      {item.priority.toUpperCase()}
+                    </span>
+                  </div>
+                  <p className="text-xs text-charcoal-400">{item.issue} · {item.date}</p>
+                </div>
+                <div className="flex gap-2">
+                  <button className="wedding-btn-gold text-xs px-3 py-1.5">Review</button>
+                  <button className="text-xs px-3 py-1.5 border border-charcoal-200 rounded-lg text-charcoal-400 hover:text-charcoal-600 transition-colors">Dismiss</button>
+                </div>
+              </div>
+            ))}
+          </div>
+        </div>
+
+        {/* Contract Governance */}
+        <div className="wedding-card">
+          <div className="p-5 border-b border-ivory-200 flex items-center justify-between">
+            <h2 className="font-heading text-lg font-semibold text-charcoal-700">Contract Governance</h2>
+            <div className="flex gap-2">
+              <button className="wedding-btn-outline text-xs">Export Audit (CSV)</button>
+              <button className="wedding-btn-outline text-xs">Export Audit (PDF)</button>
+            </div>
+          </div>
+          <div className="overflow-x-auto">
+            <table className="w-full">
+              <thead>
+                <tr className="bg-ivory-50">
+                  <th className="text-left p-4 font-heading text-xs font-semibold text-charcoal-500 uppercase tracking-wider">Contract</th>
+                  <th className="text-left p-4 font-heading text-xs font-semibold text-charcoal-500 uppercase tracking-wider">Vendor</th>
+                  <th className="text-left p-4 font-heading text-xs font-semibold text-charcoal-500 uppercase tracking-wider">Client</th>
+                  <th className="text-left p-4 font-heading text-xs font-semibold text-charcoal-500 uppercase tracking-wider">Status</th>
+                  <th className="text-left p-4 font-heading text-xs font-semibold text-charcoal-500 uppercase tracking-wider">Actions</th>
+                </tr>
+              </thead>
+              <tbody className="divide-y divide-ivory-100">
+                {[
+                  { id:'CTR-001', vendor:'Lens & Light Studio', client:'Amaya & Ruwan', status:'signed' },
+                  { id:'CTR-005', vendor:'The Grand Atrium', client:'Nisha & Kaveen', status:'disputed' },
+                  { id:'CTR-012', vendor:'Bloom & Petal', client:'Thilini & Ashan', status:'amended' },
+                ].map(row=>(
+                  <tr key={row.id} className="hover:bg-ivory-50 transition-colors">
+                    <td className="p-4 text-sm font-medium text-charcoal-700">{row.id}</td>
+                    <td className="p-4 text-sm text-charcoal-600">{row.vendor}</td>
+                    <td className="p-4 text-sm text-charcoal-600">{row.client}</td>
+                    <td className="p-4">
+                      <span className={"wedding-badge text-xs "+(row.status==='signed'?'bg-sage-50 text-sage-600':row.status==='disputed'?'bg-rose-50 text-rose-500':'bg-gold-50 text-gold-600')}>
+                        {row.status.charAt(0).toUpperCase()+row.status.slice(1)}
+                      </span>
+                    </td>
+                    <td className="p-4">
+                      <div className="flex gap-2">
+                        <button className="text-xs text-gold-500 hover:text-gold-600">View Audit</button>
+                        {row.status==='disputed'&&<button className="text-xs text-rose-500 hover:text-rose-600">Mediate</button>}
+                        <button className="text-xs text-charcoal-400 hover:text-charcoal-600">Export</button>
+                      </div>
+                    </td>
+                  </tr>
+                ))}
+              </tbody>
+            </table>
+          </div>
+        </div>
+      </div>
+    </div>
+  )
+}