fixed all admin email pages. added admin user info and button on builder page to route to admin page.

components/AdminLeftNavigation.tsx

@@ -5,6 +5,7 @@ import Link from "next/link";
 import { usePathname } from "next/navigation";
 import { Disclosure, DisclosureButton, DisclosurePanel } from "@headlessui/react";
 import { ChevronRight, PanelLeftClose, PanelLeftOpen } from "lucide-react";
+import { useAuth } from "@/context/AuthContext";
 
 export type AdminNavItem = {
   label: string;
@@ -42,14 +43,21 @@ export default function AdminLeftNavigation({
   groups: AdminNavGroup[];
 }) {
   const pathname = usePathname() || "/admin";
+  const { user } = useAuth();
+  const identity =
+    user?.displayName?.trim() ||
+    user?.username?.trim() ||
+    user?.email?.trim() ||
+    user?.uuid ||
+    "Admin";
+  const secondary = user?.email && user.email !== identity ? user.email : null;
 
   return (
     <aside
       className={cx(
-        "fixed left-0 flex shrink-0 flex-col border-r border-zinc-900 bg-zinc-950/60 backdrop-blur z-40",
+        "fixed inset-y-0 left-0 flex shrink-0 flex-col border-r border-zinc-900 bg-zinc-950/60 backdrop-blur z-40",
         collapsed ? "w-[68px]" : "w-[280px]"
       )}
-      style={{ top: '52px', height: 'calc(100vh - 52px)' }}
     >
       {/* Header / Brand */}
       <div className={cx("flex items-center justify-between px-3 py-3", collapsed && "justify-center")}>
@@ -177,24 +185,34 @@ export default function AdminLeftNavigation({
 
       {/* Footer */}
       <div className={cx("border-t border-zinc-900 p-3", collapsed && "px-2")}>
+        <Link
+          href="/builder"
+          className={cx(
+            "mb-3 inline-flex w-full items-center justify-center rounded-md border border-zinc-800 bg-zinc-900/40 px-3 py-2 text-xs font-medium text-zinc-200 hover:bg-zinc-900/70",
+            collapsed && "px-2"
+          )}
+          title="Back to Builder"
+        >
+          {collapsed ? "↩" : "Back to Builder"}
+        </Link>
         <div
           className={cx(
             "flex items-center gap-3 rounded-md bg-zinc-900/30 px-3 py-2 ring-1 ring-zinc-800",
             collapsed && "justify-center px-2"
           )}
-          title="Admin user"
+          title={secondary ?? identity}
         >
           <div className="h-8 w-8 rounded-full bg-zinc-900 ring-1 ring-zinc-800" />
           {!collapsed && (
             <div className="min-w-0">
-              <div className="text-xs uppercase tracking-[0.18em] text-zinc-500">
-                Internal
+              <div className="truncate text-sm text-zinc-200">{identity}</div>
+              <div className="truncate text-xs text-zinc-500">
+                {secondary ?? "Authenticated user"}
               </div>
-              <div className="truncate text-sm text-zinc-200">ADMIN</div>
             </div>
           )}
         </div>
       </div>
     </aside>
   );
-}
+}

components/Banner.tsx

@@ -1,8 +1,14 @@
+"use client";
+
 import React from "react";
+import { usePathname } from "next/navigation";
 
 export function Banner() {
+  const pathname = usePathname();
+  if (pathname?.startsWith("/admin")) return null;
+
   return (
-    <div className="fixed top-0 left-0 right-0 z-50">
+    <div className="w-full">
       {/* Early access bar */}
       <div className="border-b border-amber-500/20 bg-amber-500/5 backdrop-blur-sm">
         <div className="mx-auto flex max-w-6xl flex-col gap-1 px-4 py-2 text-[0.75rem] text-amber-100 md:flex-row md:items-center md:justify-between">

components/ui/RichTextEditor.tsx

@@ -1,17 +1,11 @@
-"use client";
-import dynamic from "next/dynamic";
-import type React from "react";
-
-import "react-quill/dist/quill.snow.css";
-
-// Import Quill modules after React Quill is loaded
-if (typeof window !== 'undefined') {
-  const Quill = require('quill');
-  const QuillImageResize = require('quill-image-resize-module').default;
-  Quill.register("modules/imageResize", QuillImageResize);
-}
-
-const ReactQuill = dynamic(() => import("react-quill"), { ssr: false });
+"use client";
+import { useMemo } from "react";
+import dynamic from "next/dynamic";
+import type React from "react";
+
+import "react-quill/dist/quill.snow.css";
+
+const ReactQuill = dynamic(() => import("react-quill"), { ssr: false });
 
 type RichTextEditorProps = {
     value: string;
@@ -20,33 +14,38 @@ type RichTextEditorProps = {
     className?: string;
 };
 
-export default function RichTextEditor({
-                                           value,
-                                           onChange,
-                                           placeholder,
-                                           className,
-                                       }: RichTextEditorProps) {
-    return (
-        <div className={className}>
-            <div className="bb-quill">
-                <ReactQuill
-                    theme="snow"
-                    value={value}
-                    onChange={onChange}
-                    placeholder={placeholder}
-                    modules={{
-                        toolbar: [
-                            [{ header: [1, 2, 3, false] }],
-                            ["bold", "italic", "underline", "strike"],
-                            [{ color: [] }, { background: [] }],
-                            [{ list: "ordered" }, { list: "bullet" }],
-                            ["blockquote", "code-block"],
-                            ["link"],
-                            ["clean"],
-                        ],
-                    }}
-                />
-            </div>
-        </div>
-    );
-}
+export default function RichTextEditor({
+                                           value,
+                                           onChange,
+                                           placeholder,
+                                           className,
+                                       }: RichTextEditorProps) {
+    const modules = useMemo(
+        () => ({
+            toolbar: [
+                [{ header: [1, 2, 3, false] }],
+                ["bold", "italic", "underline", "strike"],
+                [{ color: [] }, { background: [] }],
+                [{ list: "ordered" }, { list: "bullet" }],
+                ["blockquote", "code-block"],
+                ["link"],
+                ["clean"],
+            ],
+        }),
+        []
+    );
+
+    return (
+        <div className={className}>
+            <div className="bb-quill">
+                <ReactQuill
+                    theme="snow"
+                    value={value}
+                    onChange={onChange}
+                    placeholder={placeholder}
+                    modules={modules}
+                />
+            </div>
+        </div>
+    );
+}