initial: standalone repo from monorepo split

2026-04-13 09:36:30 +08:00
commit e3fead36d5
19 changed files with 597 additions and 0 deletions
--- a/src/app/(portal)/layout.tsx
+++ b/src/app/(portal)/layout.tsx
@@ -0,0 +1,70 @@
+'use client';
+
+import { useState, useEffect } from 'react';
+import { useRouter, usePathname } from 'next/navigation';
+import Link from 'next/link';
+
+const NAV = [
+  { label: 'Dashboard', href: '/dashboard' },
+  { label: 'Invoices', href: '/invoices' },
+  { label: 'Payments', href: '/payments' },
+  { label: 'Tickets', href: '/tickets' },
+  { label: 'Profile', href: '/profile' },
+];
+
+export default function PortalLayout({ children }: { children: React.ReactNode }) {
+  const router = useRouter();
+  const pathname = usePathname();
+  const [client, setClient] = useState<any>(null);
+
+  useEffect(() => {
+    const token = localStorage.getItem('portalToken');
+    const clientData = localStorage.getItem('portalClient');
+    if (!token) { router.push('/login'); return; }
+    if (clientData) setClient(JSON.parse(clientData));
+  }, [router]);
+
+  function handleLogout() {
+    localStorage.removeItem('portalToken');
+    localStorage.removeItem('portalClient');
+    router.push('/login');
+  }
+
+  return (
+    <div className="min-h-screen bg-surface-50">
+      {/* Header */}
+      <header className="bg-white border-b border-surface-200">
+        <div className="max-w-5xl mx-auto px-4 sm:px-6">
+          <div className="flex items-center justify-between h-14">
+            <div className="flex items-center gap-2">
+              <svg width="24" height="24" viewBox="0 0 40 40" fill="none" className="text-brand-600">
+                <rect width="40" height="40" rx="10" fill="currentColor" fillOpacity="0.1" />
+                <path d="M12 20h16M20 12v16" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round" />
+              </svg>
+              <span className="text-base font-bold text-surface-900 tracking-tight">FiberOps</span>
+              <span className="text-xs bg-brand-50 text-brand-700 px-2 py-0.5 rounded-full font-medium ml-1">Portal</span>
+            </div>
+            <div className="flex items-center gap-4">
+              {client && <span className="text-sm text-surface-500 hidden sm:block">{client.firstName} {client.lastName}</span>}
+              <button onClick={handleLogout} className="text-sm text-surface-500 hover:text-surface-800 cursor-pointer transition-colors">Sign out</button>
+            </div>
+          </div>
+          {/* Nav tabs */}
+          <nav className="flex gap-1 -mb-px">
+            {NAV.map((item) => {
+              const isActive = pathname === item.href;
+              return (
+                <Link key={item.href} href={item.href}
+                  className={`px-4 py-2.5 text-sm font-medium border-b-2 transition-colors ${
+                    isActive ? 'border-brand-600 text-brand-700' : 'border-transparent text-surface-500 hover:text-surface-700 hover:border-surface-300'
+                  }`}>{item.label}</Link>
+              );
+            })}
+          </nav>
+        </div>
+      </header>
+
+      <main className="max-w-5xl mx-auto px-4 sm:px-6 py-6">{children}</main>
+    </div>
+  );
+}