built user portal behind auth

components/PortalTabs.tsx

@@ -0,0 +1,50 @@
+// components/PortalTabs.tsx
+"use client";
+
+import Link from "next/link";
+import { usePathname } from "next/navigation";
+import { cn } from "@/lib/utils"; // or roll your own `cn` if you don’t have one
+
+const tabs = [
+    { href: "/portal", label: "Home" },
+{ href: "/portal/rigs", label: "Rigs" },
+{ href: "/portal/laser-settings", label: "Laser Settings" },
+{ href: "/portal/laser-sources", label: "Laser Sources" },
+{ href: "/portal/materials", label: "Materials" },
+{ href: "/portal/projects", label: "Projects" },
+{ href: "/portal/utilities", label: "Utilities" },
+{ href: "/portal/account", label: "Account" },
+];
+
+export default function PortalTabs() {
+    const pathname = usePathname() || "/portal";
+
+    return (
+        <nav className="flex flex-wrap items-center gap-1 rounded-md border bg-background p-1">
+        {tabs.map((t) => {
+            const active =
+            pathname === t.href ||
+            (t.href !== "/portal" && pathname.startsWith(t.href));
+
+            return (
+                <Link
+                key={t.href}
+                href={t.href}
+                className={cn(
+                    "px-3 py-1.5 text-sm rounded-md transition",
+                    active
+                    ? "bg-primary text-primary-foreground"
+                    : "hover:bg-muted"
+                )}
+                >
+                {t.label}
+                </Link>
+            );
+        })}
+
+        <div className="ml-auto px-3 py-1.5 text-xs opacity-60">
+        MakerDash
+        </div>
+        </nav>
+    );
+}

components/SignOutButton.tsx

@@ -22,11 +22,15 @@ export default function SignOutButton({
         if (pending) return;
         setPending(true);
         try {
-            await fetch("/api/auth/logout", { method: "POST" });
+            await fetch("/api/auth/logout", {
+                method: "POST",
+                credentials: "include", // make sure cookies are cleared
+            });
+
             // include ?next= so they can land back here after re-auth if desired
-            const next = pathname ? `?next=${encodeURIComponent(pathname)}` : "";
+            const next = pathname ? `?next=${encodeURIComponent(pathname)}` : "?next=/portal";
             router.push(redirectTo + next);
-            router.refresh(); // ensure cookies are revalidated client-side
+            router.refresh();
         } catch {
             router.push(redirectTo);
         } finally {

components/portal/SettingsSwitcher.tsx

@@ -0,0 +1,76 @@
+// components/portal/SettingsSwitcher.tsx
+"use client";
+
+import { useRouter, useSearchParams } from "next/navigation";
+import dynamic from "next/dynamic";
+import { cn } from "@/lib/utils";
+
+/**
+ * IMPORTANT:
+ * We dynamically import the existing settings pages so you do NOT have to move their contents.
+ * These imports point directly at your canonical routes:
+ *   /app/settings/fiber/page.tsx
+ *   /app/settings/uv/page.tsx
+ *   /app/settings/co2-galvo/page.tsx
+ *   /app/settings/co2-gantry/page.tsx
+ *
+ * If any of those filenames differ, update the paths below accordingly.
+ */
+const FiberPanel = dynamic(() => import("@/app/settings/fiber/page"), { ssr: false });
+const UVPanel = dynamic(() => import("@/app/settings/uv/page"), { ssr: false });
+const CO2GalvoPanel = dynamic(() => import("@/app/settings/co2-galvo/page"), { ssr: false });
+const CO2GantryPanel = dynamic(() => import("@/app/settings/co2-gantry/page"), { ssr: false });
+
+const TABS = [
+    { key: "fiber", label: "Fiber" },
+{ key: "uv", label: "UV" },
+{ key: "co2-galvo", label: "CO₂ Galvo" },
+{ key: "co2-gantry", label: "CO₂ Gantry" },
+];
+
+function Panel({ tab }: { tab: string }) {
+    switch (tab) {
+        case "fiber": return <FiberPanel />;
+        case "uv": return <UVPanel />;
+        case "co2-galvo": return <CO2GalvoPanel />;
+        case "co2-gantry": return <CO2GantryPanel />;
+        default: return <FiberPanel />;
+    }
+}
+
+export default function SettingsSwitcher() {
+    const router = useRouter();
+    const sp = useSearchParams();
+    const active = sp.get("t") || "fiber";
+
+    function setTab(nextKey: string) {
+        const q = new URLSearchParams(sp.toString());
+        q.set("t", nextKey);
+        router.replace(`/portal/laser-settings?${q.toString()}`, { scroll: false });
+    }
+
+    return (
+        <div>
+        {/* sub-tabs */}
+        <div className="mb-4 flex flex-wrap items-center gap-2">
+        {TABS.map(({ key, label }) => (
+            <button
+            key={key}
+            onClick={() => setTab(key)}
+            className={cn(
+                "rounded-md border px-3 py-1.5 text-sm transition",
+                active === key ? "bg-primary text-primary-foreground" : "hover:bg-muted"
+            )}
+            >
+            {label}
+            </button>
+        ))}
+        </div>
+
+        {/* panel */}
+        <div className="rounded-md border p-4">
+        <Panel tab={active} />
+        </div>
+        </div>
+    );
+}