forum: require auth for posting + add login/register/edit pages

- API: require auth on thread+reply POST (401 if !user); lazy-create
  forum_user_profile via service-role; author_name = display_name
- UI: surface API errors (kill silent catch); auto-redirect to login
  on 401; gate new-thread + reply forms with "Sign in to post" CTA
- /forum/login + /forum/register: forum-themed Supabase Auth pages
  with ?next= redirect support
- /forum/profile/edit + /api/forum/profile/me: edit own forum profile
  (username, display_name, bio, role, company, location, avatar)
- Header: logout button + sign-in/join links when not authed
- forum/user/[username]: show Edit Profile button when viewing own

Fixes posting bug: RLS rejected anon inserts with cryptic message
that the UI silently swallowed; now blocked with friendly 401 + redirect.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

src/app/api/forum/profile/me/route.ts

@@ -0,0 +1,74 @@
+import { NextRequest, NextResponse } from 'next/server';
+import { createClient } from '@/lib/supabase/server';
+import { createAdminClient } from '@/lib/supabase/admin';
+import { ensureForumProfile } from '@/lib/forum/profile';
+
+const EDITABLE_FIELDS = [
+  'username',
+  'display_name',
+  'bio',
+  'role_title',
+  'company',
+  'location_city',
+  'location_country',
+  'avatar_url',
+] as const;
+
+type EditableField = (typeof EDITABLE_FIELDS)[number];
+
+export async function GET() {
+  const supabase = await createClient();
+  const { data: { user } } = await supabase.auth.getUser();
+  if (!user) {
+    return NextResponse.json({ error: 'Not authenticated', auth_required: true }, { status: 401 });
+  }
+  const profile = await ensureForumProfile(user);
+  return NextResponse.json({ profile });
+}
+
+export async function PATCH(req: NextRequest) {
+  const supabase = await createClient();
+  const { data: { user } } = await supabase.auth.getUser();
+  if (!user) {
+    return NextResponse.json({ error: 'Not authenticated', auth_required: true }, { status: 401 });
+  }
+
+  const body = await req.json();
+  const updates: Partial<Record<EditableField, string | null>> = {};
+  for (const field of EDITABLE_FIELDS) {
+    if (field in body) {
+      const v = body[field];
+      updates[field] = typeof v === 'string' ? v.trim() || null : null;
+    }
+  }
+
+  if (updates.username) {
+    const u = updates.username;
+    if (!/^[a-z0-9_]{3,24}$/i.test(u)) {
+      return NextResponse.json(
+        { error: 'Username must be 3-24 characters, letters/numbers/underscore only.' },
+        { status: 400 }
+      );
+    }
+    updates.username = u.toLowerCase();
+  }
+
+  await ensureForumProfile(user);
+
+  const admin = createAdminClient();
+  const { data: updated, error } = await admin
+    .from('forum_user_profiles')
+    .update(updates)
+    .eq('user_id', user.id)
+    .select()
+    .single();
+
+  if (error) {
+    if (error.code === '23505') {
+      return NextResponse.json({ error: 'That username is already taken.' }, { status: 409 });
+    }
+    return NextResponse.json({ error: error.message }, { status: 500 });
+  }
+
+  return NextResponse.json({ profile: updated });
+}

src/app/api/forum/replies/route.ts

@@ -1,54 +1,62 @@
 import { NextRequest, NextResponse } from 'next/server';
 import { createClient } from '@/lib/supabase/server';
+import { ensureForumProfile } from '@/lib/forum/profile';
 
 export async function POST(req: NextRequest) {
   try {
     const supabase = await createClient();
     const { data: { user } } = await supabase.auth.getUser();
+
+    if (!user) {
+      return NextResponse.json(
+        { error: 'You must be signed in to post a reply.', auth_required: true },
+        { status: 401 }
+      );
+    }
+
     const body = await req.json();
-    const { thread_id, body: replyBody, author_name } = body;
+    const { thread_id, body: replyBody } = body;
 
     if (!thread_id || !replyBody) {
       return NextResponse.json({ error: 'thread_id and body are required' }, { status: 400 });
     }
 
-    // Check if authenticated user is suspended or banned
+    const { data: suspension } = await supabase
-    if (user) {
+      .from('user_suspensions')
-      const { data: suspension } = await supabase
+      .select('suspension_type, reason, expires_at')
-        .from('user_suspensions')
+      .eq('user_id', user.id)
-        .select('suspension_type, reason, expires_at')
+      .eq('is_active', true)
-        .eq('user_id', user.id)
+      .or('expires_at.is.null,expires_at.gt.' + new Date().toISOString())
-        .eq('is_active', true)
+      .order('created_at', { ascending: false })
-        .or('expires_at.is.null,expires_at.gt.' + new Date().toISOString())
+      .limit(1)
-        .order('created_at', { ascending: false })
+      .maybeSingle();
-        .limit(1)
-        .maybeSingle();
 
-      if (suspension) {
+    if (suspension) {
-        const isBanned = suspension.suspension_type === 'banned';
+      const isBanned = suspension.suspension_type === 'banned';
-        const expiryText = suspension.expires_at
+      const expiryText = suspension.expires_at
-          ? ` until ${new Date(suspension.expires_at).toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' })}`
+        ? ` until ${new Date(suspension.expires_at).toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' })}`
-          : '';
+        : '';
-        return NextResponse.json(
+      return NextResponse.json(
-          {
+        {
-            error: isBanned
+          error: isBanned
-              ? `Your account has been permanently banned. Reason: ${suspension.reason}`
+            ? `Your account has been permanently banned. Reason: ${suspension.reason}`
-              : `Your account is suspended${expiryText}. Reason: ${suspension.reason}`,
+            : `Your account is suspended${expiryText}. Reason: ${suspension.reason}`,
-            suspended: true,
+          suspended: true,
-            suspension_type: suspension.suspension_type,
+          suspension_type: suspension.suspension_type,
-          },
+        },
-          { status: 403 }
+        { status: 403 }
-        );
+      );
-      }
     }
 
+    const forumProfile = await ensureForumProfile(user);
+
     const { data, error } = await supabase
       .from('forum_replies')
       .insert({
         thread_id,
         body: replyBody.trim(),
-        author_id: user?.id || null,
+        author_id: user.id,
-        author_name: author_name?.trim() || (user ? 'Community Member' : 'Anonymous'),
+        author_name: forumProfile.display_name || forumProfile.username,
         is_ai_response: false,
       })
       .select()

src/app/api/forum/threads/route.ts

@@ -1,5 +1,6 @@
 import { NextRequest, NextResponse } from 'next/server';
 import { createClient } from '@/lib/supabase/server';
+import { ensureForumProfile } from '@/lib/forum/profile';
 
 export async function GET(req: NextRequest) {
   try {
@@ -59,43 +60,50 @@ export async function POST(req: NextRequest) {
   try {
     const supabase = await createClient();
     const { data: { user } } = await supabase.auth.getUser();
+
+    if (!user) {
+      return NextResponse.json(
+        { error: 'You must be signed in to start a thread.', auth_required: true },
+        { status: 401 }
+      );
+    }
+
     const body = await req.json();
-    const { category_id, title, body: threadBody, author_name } = body;
+    const { category_id, title, body: threadBody } = body;
 
     if (!category_id || !title || !threadBody) {
       return NextResponse.json({ error: 'category_id, title, and body are required' }, { status: 400 });
     }
 
-    // Check if authenticated user is suspended or banned
+    const { data: suspension } = await supabase
-    if (user) {
+      .from('user_suspensions')
-      const { data: suspension } = await supabase
+      .select('suspension_type, reason, expires_at')
-        .from('user_suspensions')
+      .eq('user_id', user.id)
-        .select('suspension_type, reason, expires_at')
+      .eq('is_active', true)
-        .eq('user_id', user.id)
+      .or('expires_at.is.null,expires_at.gt.' + new Date().toISOString())
-        .eq('is_active', true)
+      .order('created_at', { ascending: false })
-        .or('expires_at.is.null,expires_at.gt.' + new Date().toISOString())
+      .limit(1)
-        .order('created_at', { ascending: false })
+      .maybeSingle();
-        .limit(1)
-        .maybeSingle();
 
-      if (suspension) {
+    if (suspension) {
-        const isBanned = suspension.suspension_type === 'banned';
+      const isBanned = suspension.suspension_type === 'banned';
-        const expiryText = suspension.expires_at
+      const expiryText = suspension.expires_at
-          ? ` until ${new Date(suspension.expires_at).toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' })}`
+        ? ` until ${new Date(suspension.expires_at).toLocaleDateString('en-US', { month: 'short', day: 'numeric', year: 'numeric' })}`
-          : '';
+        : '';
-        return NextResponse.json(
+      return NextResponse.json(
-          {
+        {
-            error: isBanned
+          error: isBanned
-              ? `Your account has been permanently banned. Reason: ${suspension.reason}`
+            ? `Your account has been permanently banned. Reason: ${suspension.reason}`
-              : `Your account is suspended${expiryText}. Reason: ${suspension.reason}`,
+            : `Your account is suspended${expiryText}. Reason: ${suspension.reason}`,
-            suspended: true,
+          suspended: true,
-            suspension_type: suspension.suspension_type,
+          suspension_type: suspension.suspension_type,
-          },
+        },
-          { status: 403 }
+        { status: 403 }
-        );
+      );
-      }
     }
 
+    const forumProfile = await ensureForumProfile(user);
+
     // Fetch category name for better moderation context
     const { data: categoryData } = await supabase
       .from('forum_categories')
@@ -109,8 +117,8 @@ export async function POST(req: NextRequest) {
         category_id,
         title: title.trim(),
         body: threadBody.trim(),
-        author_id: user?.id || null,
+        author_id: user.id,
-        author_name: author_name?.trim() || (user ? 'Community Member' : 'Anonymous'),
+        author_name: forumProfile.display_name || forumProfile.username,
         is_ai_seeded: false,
       })
       .select()

src/app/forum/[slug]/page.tsx

@@ -4,6 +4,7 @@ import Link from 'next/link';
 import { useParams } from 'next/navigation';
 import Header from '@/components/Header';
 import Footer from '@/components/Footer';
+import { createClient } from '@/lib/supabase/client';
 
 interface ForumCategory {
   id: string;
@@ -173,8 +174,14 @@ export default function ForumCategoryPage() {
   const [showNewThread, setShowNewThread] = useState(false);
   const [newTitle, setNewTitle] = useState('');
   const [newBody, setNewBody] = useState('');
-  const [newAuthor, setNewAuthor] = useState('');
   const [submitting, setSubmitting] = useState(false);
+  const [newError, setNewError] = useState<string | null>(null);
+  const [isAuthenticated, setIsAuthenticated] = useState(false);
+
+  useEffect(() => {
+    const supabase = createClient();
+    supabase.auth.getUser().then(({ data: { user } }) => setIsAuthenticated(!!user));
+  }, []);
 
   const [search, setSearch] = useState('');
   const [debouncedSearch, setDebouncedSearch] = useState('');
@@ -228,6 +235,7 @@ export default function ForumCategoryPage() {
     e.preventDefault();
     if (!newTitle.trim() || !newBody.trim() || !category) return;
     setSubmitting(true);
+    setNewError(null);
     try {
       const res = await fetch('/api/forum/threads', {
         method: 'POST',
@@ -236,19 +244,24 @@ export default function ForumCategoryPage() {
           category_id: category.id,
           title: newTitle,
           body: newBody,
-          author_name: newAuthor || 'Anonymous',
         }),
       });
       const data = await res.json();
+      if (!res.ok) {
+        if (res.status === 401) {
+          window.location.href = `/forum/login?next=${encodeURIComponent(window.location.pathname)}`;
+          return;
+        }
+        throw new Error(data.error || `Failed (${res.status})`);
+      }
       if (data.thread) {
         setThreads(prev => [data.thread, ...prev]);
         setNewTitle('');
         setNewBody('');
-        setNewAuthor('');
         setShowNewThread(false);
       }
-    } catch {
+    } catch (err: any) {
-      // silent
+      setNewError(err.message || 'Failed to create thread. Please try again.');
     } finally {
       setSubmitting(false);
     }
@@ -282,29 +295,31 @@ export default function ForumCategoryPage() {
                   )}
                 </div>
               </div>
-              <button
+              {isAuthenticated ? (
-                onClick={() => setShowNewThread(!showNewThread)}
+                <button
-                className="flex-shrink-0 bg-[#3b82f6] hover:bg-[#2563eb] text-white font-body font-semibold text-sm px-4 py-2 rounded-lg transition-colors"
+                  onClick={() => setShowNewThread(!showNewThread)}
-              >
+                  className="flex-shrink-0 bg-[#3b82f6] hover:bg-[#2563eb] text-white font-body font-semibold text-sm px-4 py-2 rounded-lg transition-colors"
-                + New Thread
+                >
-              </button>
+                  + New Thread
+                </button>
+              ) : (
+                <Link
+                  href={`/forum/login?next=${typeof window === 'undefined' ? '/forum' : encodeURIComponent(window.location.pathname)}`}
+                  className="flex-shrink-0 bg-[#3b82f6] hover:bg-[#2563eb] text-white font-body font-semibold text-sm px-4 py-2 rounded-lg transition-colors"
+                >
+                  Sign in to post
+                </Link>
+              )}
             </div>
           </div>
         </div>
 
         <div className="max-w-container mx-auto px-4 py-6">
-          {/* New Thread Form */}
+          {/* New Thread Form — auth-gated */}
-          {showNewThread && (
+          {showNewThread && isAuthenticated && (
             <form onSubmit={handleNewThread} className="bg-[#1a2535] border border-[#2a3a50] rounded-lg p-5 mb-6">
               <h3 className="text-white font-heading font-semibold mb-4">Start a New Thread</h3>
               <div className="space-y-3">
-                <input
-                  type="text"
-                  placeholder="Your name (optional)"
-                  value={newAuthor}
-                  onChange={e => setNewAuthor(e.target.value)}
-                  className="w-full bg-[#111] border border-[#333] rounded-lg px-3 py-2 text-white font-body text-sm placeholder-[#555] focus:outline-none focus:border-[#3b82f6]"
-                />
                 <input
                   type="text"
                   placeholder="Thread title *"
@@ -321,6 +336,11 @@ export default function ForumCategoryPage() {
                   rows={5}
                   className="w-full bg-[#111] border border-[#333] rounded-lg px-3 py-2 text-white font-body text-sm placeholder-[#555] focus:outline-none focus:border-[#3b82f6] resize-none"
                 />
+                {newError && (
+                  <div className="bg-[#2a0a0a] border border-[#cc0000] text-[#ff8a8a] font-body text-sm px-3 py-2 rounded">
+                    {newError}
+                  </div>
+                )}
                 <div className="flex gap-3">
                   <button
                     type="submit"

src/app/forum/login/page.tsx

@@ -0,0 +1,126 @@
+'use client';
+
+import { Suspense, useState, useEffect } from 'react';
+import Link from 'next/link';
+import { useRouter, useSearchParams } from 'next/navigation';
+import Header from '@/components/Header';
+import Footer from '@/components/Footer';
+import { createClient } from '@/lib/supabase/client';
+
+function safeNext(next: string | null): string {
+  if (!next) return '/forum';
+  if (!next.startsWith('/') || next.startsWith('//')) return '/forum';
+  return next;
+}
+
+function ForumLoginInner() {
+  const router = useRouter();
+  const params = useSearchParams();
+  const next = safeNext(params.get('next'));
+  const supabase = createClient();
+
+  const [email, setEmail] = useState('');
+  const [password, setPassword] = useState('');
+  const [error, setError] = useState<string | null>(null);
+  const [loading, setLoading] = useState(false);
+
+  useEffect(() => {
+    supabase.auth.getUser().then(({ data: { user } }) => {
+      if (user) router.replace(next);
+    });
+  }, [next, router, supabase]);
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setError(null);
+    if (!email || !password) {
+      setError('Email and password are required.');
+      return;
+    }
+    setLoading(true);
+    const { error: signInError } = await supabase.auth.signInWithPassword({ email, password });
+    setLoading(false);
+    if (signInError) {
+      setError(signInError.message);
+      return;
+    }
+    window.location.href = next;
+  };
+
+  return (
+    <>
+      <Header />
+      <main className="min-h-screen bg-[#111111]">
+        <div className="max-w-md mx-auto px-4 py-12">
+          <div className="text-center mb-6">
+            <h1 className="text-2xl font-heading font-bold text-white">Sign in to the Forum</h1>
+            <p className="text-[#888] font-body text-sm mt-1">
+              Use your Broadcast Beat account to post, reply, and vote.
+            </p>
+          </div>
+          <form
+            onSubmit={handleSubmit}
+            className="bg-[#1a1a1a] border border-[#252525] rounded-lg p-6 space-y-4"
+          >
+            {error && (
+              <div className="bg-[#2a0a0a] border border-[#cc0000] text-[#ff8a8a] font-body text-sm px-3 py-2 rounded">
+                {error}
+              </div>
+            )}
+            <div>
+              <label className="block text-xs font-body uppercase tracking-wider text-[#888] mb-1.5">
+                Email
+              </label>
+              <input
+                type="email"
+                value={email}
+                onChange={(e) => setEmail(e.target.value)}
+                autoComplete="email"
+                required
+                className="w-full bg-[#0d0d0d] border border-[#2a2a2a] rounded-lg px-3 py-2 text-white font-body text-sm focus:outline-none focus:border-[#3b82f6]"
+              />
+            </div>
+            <div>
+              <label className="block text-xs font-body uppercase tracking-wider text-[#888] mb-1.5">
+                Password
+              </label>
+              <input
+                type="password"
+                value={password}
+                onChange={(e) => setPassword(e.target.value)}
+                autoComplete="current-password"
+                required
+                className="w-full bg-[#0d0d0d] border border-[#2a2a2a] rounded-lg px-3 py-2 text-white font-body text-sm focus:outline-none focus:border-[#3b82f6]"
+              />
+            </div>
+            <button
+              type="submit"
+              disabled={loading}
+              className="w-full bg-[#3b82f6] hover:bg-[#2563eb] disabled:opacity-50 text-white font-body font-semibold text-sm px-5 py-2.5 rounded-lg transition-colors"
+            >
+              {loading ? 'Signing in…' : 'Sign In'}
+            </button>
+            <div className="text-center text-xs font-body text-[#888] pt-2">
+              No account yet?{' '}
+              <Link
+                href={`/forum/register?next=${encodeURIComponent(next)}`}
+                className="text-[#3b82f6] hover:underline"
+              >
+                Create one
+              </Link>
+            </div>
+          </form>
+        </div>
+      </main>
+      <Footer />
+    </>
+  );
+}
+
+export default function ForumLoginPage() {
+  return (
+    <Suspense fallback={null}>
+      <ForumLoginInner />
+    </Suspense>
+  );
+}

src/app/forum/profile/edit/page.tsx

@@ -0,0 +1,233 @@
+'use client';
+
+import { useEffect, useState } from 'react';
+import { useRouter } from 'next/navigation';
+import Link from 'next/link';
+import Header from '@/components/Header';
+import Footer from '@/components/Footer';
+
+interface ForumProfile {
+  username: string;
+  display_name: string;
+  bio: string | null;
+  role_title: string | null;
+  company: string | null;
+  location_city: string | null;
+  location_country: string | null;
+  avatar_url: string | null;
+}
+
+export default function EditForumProfilePage() {
+  const router = useRouter();
+  const [profile, setProfile] = useState<ForumProfile | null>(null);
+  const [loading, setLoading] = useState(true);
+  const [saving, setSaving] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  const [info, setInfo] = useState<string | null>(null);
+
+  useEffect(() => {
+    fetch('/api/forum/profile/me')
+      .then(async (r) => {
+        if (r.status === 401) {
+          window.location.href = `/forum/login?next=${encodeURIComponent('/forum/profile/edit')}`;
+          return null;
+        }
+        return r.json();
+      })
+      .then((d) => {
+        if (d?.profile) setProfile(d.profile);
+        setLoading(false);
+      })
+      .catch(() => setLoading(false));
+  }, []);
+
+  const update = (field: keyof ForumProfile, value: string) => {
+    setProfile((p) => (p ? { ...p, [field]: value } : p));
+  };
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    if (!profile) return;
+    setSaving(true);
+    setError(null);
+    setInfo(null);
+    try {
+      const res = await fetch('/api/forum/profile/me', {
+        method: 'PATCH',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify(profile),
+      });
+      const data = await res.json();
+      if (!res.ok) throw new Error(data.error || `Update failed (${res.status})`);
+      setProfile(data.profile);
+      setInfo('Profile saved.');
+      setTimeout(() => router.push(`/forum/user/${data.profile.username}`), 800);
+    } catch (err: any) {
+      setError(err.message || 'Failed to save profile.');
+    } finally {
+      setSaving(false);
+    }
+  };
+
+  if (loading) {
+    return (
+      <>
+        <Header />
+        <main className="min-h-screen bg-[#111111]">
+          <div className="max-w-2xl mx-auto px-4 py-12 text-[#666] font-body text-sm">Loading…</div>
+        </main>
+        <Footer />
+      </>
+    );
+  }
+
+  if (!profile) {
+    return (
+      <>
+        <Header />
+        <main className="min-h-screen bg-[#111111]">
+          <div className="max-w-2xl mx-auto px-4 py-12 text-[#888] font-body text-sm">
+            Profile unavailable.
+          </div>
+        </main>
+        <Footer />
+      </>
+    );
+  }
+
+  return (
+    <>
+      <Header />
+      <main className="min-h-screen bg-[#111111]">
+        <div className="max-w-2xl mx-auto px-4 py-8">
+          <div className="flex items-center justify-between mb-4">
+            <h1 className="text-2xl font-heading font-bold text-white">Edit Profile</h1>
+            <Link
+              href={`/forum/user/${profile.username}`}
+              className="text-xs font-body text-[#3b82f6] hover:underline"
+            >
+              View public profile →
+            </Link>
+          </div>
+
+          <form
+            onSubmit={handleSubmit}
+            className="bg-[#1a1a1a] border border-[#252525] rounded-lg p-6 space-y-4"
+          >
+            {error && (
+              <div className="bg-[#2a0a0a] border border-[#cc0000] text-[#ff8a8a] font-body text-sm px-3 py-2 rounded">
+                {error}
+              </div>
+            )}
+            {info && (
+              <div className="bg-[#0a2a14] border border-[#1e8c3f] text-[#7fffaa] font-body text-sm px-3 py-2 rounded">
+                {info}
+              </div>
+            )}
+
+            <Field label="Username (URL handle)">
+              <input
+                type="text"
+                value={profile.username}
+                onChange={(e) => update('username', e.target.value)}
+                pattern="[A-Za-z0-9_]{3,24}"
+                required
+                className="w-full bg-[#0d0d0d] border border-[#2a2a2a] rounded-lg px-3 py-2 text-white font-body text-sm focus:outline-none focus:border-[#3b82f6]"
+              />
+              <p className="text-[11px] font-body text-[#666] mt-1">
+                3-24 characters. Letters, numbers, underscore.
+              </p>
+            </Field>
+
+            <Field label="Display name">
+              <input
+                type="text"
+                value={profile.display_name}
+                onChange={(e) => update('display_name', e.target.value)}
+                required
+                className="w-full bg-[#0d0d0d] border border-[#2a2a2a] rounded-lg px-3 py-2 text-white font-body text-sm focus:outline-none focus:border-[#3b82f6]"
+              />
+            </Field>
+
+            <Field label="Bio">
+              <textarea
+                value={profile.bio || ''}
+                onChange={(e) => update('bio', e.target.value)}
+                rows={4}
+                className="w-full bg-[#0d0d0d] border border-[#2a2a2a] rounded-lg px-3 py-2 text-white font-body text-sm focus:outline-none focus:border-[#3b82f6] resize-none"
+              />
+            </Field>
+
+            <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
+              <Field label="Role / Title">
+                <input
+                  type="text"
+                  value={profile.role_title || ''}
+                  onChange={(e) => update('role_title', e.target.value)}
+                  className="w-full bg-[#0d0d0d] border border-[#2a2a2a] rounded-lg px-3 py-2 text-white font-body text-sm focus:outline-none focus:border-[#3b82f6]"
+                />
+              </Field>
+              <Field label="Company">
+                <input
+                  type="text"
+                  value={profile.company || ''}
+                  onChange={(e) => update('company', e.target.value)}
+                  className="w-full bg-[#0d0d0d] border border-[#2a2a2a] rounded-lg px-3 py-2 text-white font-body text-sm focus:outline-none focus:border-[#3b82f6]"
+                />
+              </Field>
+            </div>
+
+            <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
+              <Field label="City">
+                <input
+                  type="text"
+                  value={profile.location_city || ''}
+                  onChange={(e) => update('location_city', e.target.value)}
+                  className="w-full bg-[#0d0d0d] border border-[#2a2a2a] rounded-lg px-3 py-2 text-white font-body text-sm focus:outline-none focus:border-[#3b82f6]"
+                />
+              </Field>
+              <Field label="Country">
+                <input
+                  type="text"
+                  value={profile.location_country || ''}
+                  onChange={(e) => update('location_country', e.target.value)}
+                  className="w-full bg-[#0d0d0d] border border-[#2a2a2a] rounded-lg px-3 py-2 text-white font-body text-sm focus:outline-none focus:border-[#3b82f6]"
+                />
+              </Field>
+            </div>
+
+            <Field label="Avatar URL">
+              <input
+                type="url"
+                value={profile.avatar_url || ''}
+                onChange={(e) => update('avatar_url', e.target.value)}
+                placeholder="https://…"
+                className="w-full bg-[#0d0d0d] border border-[#2a2a2a] rounded-lg px-3 py-2 text-white font-body text-sm focus:outline-none focus:border-[#3b82f6]"
+              />
+            </Field>
+
+            <button
+              type="submit"
+              disabled={saving}
+              className="bg-[#3b82f6] hover:bg-[#2563eb] disabled:opacity-50 text-white font-body font-semibold text-sm px-5 py-2.5 rounded-lg transition-colors"
+            >
+              {saving ? 'Saving…' : 'Save Profile'}
+            </button>
+          </form>
+        </div>
+      </main>
+      <Footer />
+    </>
+  );
+}
+
+function Field({ label, children }: { label: string; children: React.ReactNode }) {
+  return (
+    <div>
+      <label className="block text-xs font-body uppercase tracking-wider text-[#888] mb-1.5">
+        {label}
+      </label>
+      {children}
+    </div>
+  );
+}

src/app/forum/register/page.tsx

@@ -0,0 +1,180 @@
+'use client';
+
+import { Suspense, useState, useEffect } from 'react';
+import Link from 'next/link';
+import { useRouter, useSearchParams } from 'next/navigation';
+import Header from '@/components/Header';
+import Footer from '@/components/Footer';
+import { createClient } from '@/lib/supabase/client';
+
+function safeNext(next: string | null): string {
+  if (!next) return '/forum';
+  if (!next.startsWith('/') || next.startsWith('//')) return '/forum';
+  return next;
+}
+
+function ForumRegisterInner() {
+  const router = useRouter();
+  const params = useSearchParams();
+  const next = safeNext(params.get('next'));
+  const supabase = createClient();
+
+  const [fullName, setFullName] = useState('');
+  const [email, setEmail] = useState('');
+  const [password, setPassword] = useState('');
+  const [confirm, setConfirm] = useState('');
+  const [error, setError] = useState<string | null>(null);
+  const [info, setInfo] = useState<string | null>(null);
+  const [loading, setLoading] = useState(false);
+
+  useEffect(() => {
+    supabase.auth.getUser().then(({ data: { user } }) => {
+      if (user) router.replace(next);
+    });
+  }, [next, router, supabase]);
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setError(null);
+    setInfo(null);
+
+    if (!fullName.trim()) return setError('Please enter your name.');
+    if (!email) return setError('Email is required.');
+    if (password.length < 6) return setError('Password must be at least 6 characters.');
+    if (password !== confirm) return setError('Passwords do not match.');
+
+    setLoading(true);
+    const { data, error: signUpError } = await supabase.auth.signUp({
+      email,
+      password,
+      options: {
+        data: { full_name: fullName.trim(), avatar_url: '' },
+        emailRedirectTo: `${window.location.origin}/auth/callback?next=${encodeURIComponent(next)}`,
+      },
+    });
+    setLoading(false);
+
+    if (signUpError) {
+      setError(signUpError.message);
+      return;
+    }
+
+    // If email confirmation is off (auto-confirm), session is already live.
+    if (data?.session) {
+      window.location.href = next;
+      return;
+    }
+
+    // Confirmation required path.
+    setInfo('Check your email for a confirmation link to finish signing up.');
+  };
+
+  return (
+    <>
+      <Header />
+      <main className="min-h-screen bg-[#111111]">
+        <div className="max-w-md mx-auto px-4 py-12">
+          <div className="text-center mb-6">
+            <h1 className="text-2xl font-heading font-bold text-white">Create a Forum Account</h1>
+            <p className="text-[#888] font-body text-sm mt-1">
+              Post threads, reply, vote, and follow the conversation.
+            </p>
+          </div>
+          <form
+            onSubmit={handleSubmit}
+            className="bg-[#1a1a1a] border border-[#252525] rounded-lg p-6 space-y-4"
+          >
+            {error && (
+              <div className="bg-[#2a0a0a] border border-[#cc0000] text-[#ff8a8a] font-body text-sm px-3 py-2 rounded">
+                {error}
+              </div>
+            )}
+            {info && (
+              <div className="bg-[#0a1f2a] border border-[#1e6c8c] text-[#7adbff] font-body text-sm px-3 py-2 rounded">
+                {info}
+              </div>
+            )}
+            <div>
+              <label className="block text-xs font-body uppercase tracking-wider text-[#888] mb-1.5">
+                Full Name
+              </label>
+              <input
+                type="text"
+                value={fullName}
+                onChange={(e) => setFullName(e.target.value)}
+                autoComplete="name"
+                required
+                className="w-full bg-[#0d0d0d] border border-[#2a2a2a] rounded-lg px-3 py-2 text-white font-body text-sm focus:outline-none focus:border-[#3b82f6]"
+              />
+            </div>
+            <div>
+              <label className="block text-xs font-body uppercase tracking-wider text-[#888] mb-1.5">
+                Email
+              </label>
+              <input
+                type="email"
+                value={email}
+                onChange={(e) => setEmail(e.target.value)}
+                autoComplete="email"
+                required
+                className="w-full bg-[#0d0d0d] border border-[#2a2a2a] rounded-lg px-3 py-2 text-white font-body text-sm focus:outline-none focus:border-[#3b82f6]"
+              />
+            </div>
+            <div>
+              <label className="block text-xs font-body uppercase tracking-wider text-[#888] mb-1.5">
+                Password
+              </label>
+              <input
+                type="password"
+                value={password}
+                onChange={(e) => setPassword(e.target.value)}
+                autoComplete="new-password"
+                required
+                minLength={6}
+                className="w-full bg-[#0d0d0d] border border-[#2a2a2a] rounded-lg px-3 py-2 text-white font-body text-sm focus:outline-none focus:border-[#3b82f6]"
+              />
+            </div>
+            <div>
+              <label className="block text-xs font-body uppercase tracking-wider text-[#888] mb-1.5">
+                Confirm Password
+              </label>
+              <input
+                type="password"
+                value={confirm}
+                onChange={(e) => setConfirm(e.target.value)}
+                autoComplete="new-password"
+                required
+                className="w-full bg-[#0d0d0d] border border-[#2a2a2a] rounded-lg px-3 py-2 text-white font-body text-sm focus:outline-none focus:border-[#3b82f6]"
+              />
+            </div>
+            <button
+              type="submit"
+              disabled={loading}
+              className="w-full bg-[#3b82f6] hover:bg-[#2563eb] disabled:opacity-50 text-white font-body font-semibold text-sm px-5 py-2.5 rounded-lg transition-colors"
+            >
+              {loading ? 'Creating account…' : 'Create Account'}
+            </button>
+            <div className="text-center text-xs font-body text-[#888] pt-2">
+              Already have an account?{' '}
+              <Link
+                href={`/forum/login?next=${encodeURIComponent(next)}`}
+                className="text-[#3b82f6] hover:underline"
+              >
+                Sign in
+              </Link>
+            </div>
+          </form>
+        </div>
+      </main>
+      <Footer />
+    </>
+  );
+}
+
+export default function ForumRegisterPage() {
+  return (
+    <Suspense fallback={null}>
+      <ForumRegisterInner />
+    </Suspense>
+  );
+}

src/app/forum/thread/[id]/page.tsx

@@ -194,8 +194,8 @@ export default function ForumThreadPage() {
 
   // Reply form
   const [replyBody, setReplyBody] = useState('');
-  const [replyAuthor, setReplyAuthor] = useState('');
   const [submitting, setSubmitting] = useState(false);
+  const [replyError, setReplyError] = useState<string | null>(null);
 
   // AI assistant
   const [aiQuestion, setAiQuestion] = useState('');
@@ -230,6 +230,7 @@ export default function ForumThreadPage() {
     e.preventDefault();
     if (!replyBody.trim() || !threadId) return;
     setSubmitting(true);
+    setReplyError(null);
     try {
       const res = await fetch('/api/forum/replies', {
         method: 'POST',
@@ -237,18 +238,23 @@ export default function ForumThreadPage() {
         body: JSON.stringify({
           thread_id: threadId,
           body: replyBody,
-          author_name: replyAuthor || 'Anonymous',
         }),
       });
       const data = await res.json();
+      if (!res.ok) {
+        if (res.status === 401) {
+          window.location.href = `/forum/login?next=${encodeURIComponent(window.location.pathname)}`;
+          return;
+        }
+        throw new Error(data.error || `Reply failed (${res.status})`);
+      }
       if (data.reply) {
         setReplies(prev => [...prev, data.reply]);
         setReplyBody('');
-        setReplyAuthor('');
         setTimeout(() => repliesEndRef.current?.scrollIntoView({ behavior: 'smooth' }), 100);
       }
-    } catch {
+    } catch (err: any) {
-      // silent
+      setReplyError(err.message || 'Failed to post reply. Please try again.');
     } finally {
       setSubmitting(false);
     }
@@ -468,18 +474,11 @@ export default function ForumThreadPage() {
               )}
             </div>
 
-            {/* Reply Form */}
+            {/* Reply Form — auth-gated */}
-            {thread.status !== 'closed' && (
+            {thread.status !== 'closed' && isAuthenticated && (
               <div className="bg-[#1a1a1a] border border-[#252525] rounded-lg p-5">
                 <h3 className="text-white font-heading font-semibold mb-4">Post a Reply</h3>
                 <form onSubmit={handleReply} className="space-y-3">
-                  <input
-                    type="text"
-                    placeholder="Your name (optional)"
-                    value={replyAuthor}
-                    onChange={e => setReplyAuthor(e.target.value)}
-                    className="w-full bg-[#111] border border-[#333] rounded-lg px-3 py-2 text-white font-body text-sm placeholder-[#555] focus:outline-none focus:border-[#3b82f6]"
-                  />
                   <textarea
                     placeholder="Share your thoughts, experience, or answer..."
                     value={replyBody}
@@ -488,6 +487,11 @@ export default function ForumThreadPage() {
                     rows={5}
                     className="w-full bg-[#111] border border-[#333] rounded-lg px-3 py-2 text-white font-body text-sm placeholder-[#555] focus:outline-none focus:border-[#3b82f6] resize-none"
                   />
+                  {replyError && (
+                    <div className="bg-[#2a0a0a] border border-[#cc0000] text-[#ff8a8a] font-body text-sm px-3 py-2 rounded">
+                      {replyError}
+                    </div>
+                  )}
                   <button
                     type="submit"
                     disabled={submitting || !replyBody.trim()}
@@ -499,6 +503,29 @@ export default function ForumThreadPage() {
               </div>
             )}
 
+            {thread.status !== 'closed' && !isAuthenticated && (
+              <div className="bg-[#0d1f35] border border-[#1e3a5f] rounded-lg p-5 text-center">
+                <h3 className="text-white font-heading font-semibold mb-1">Join the discussion</h3>
+                <p className="text-[#7a9ab8] font-body text-sm mb-4">
+                  Sign in or create a free account to post replies.
+                </p>
+                <div className="flex items-center justify-center gap-3">
+                  <Link
+                    href={`/forum/login?next=${encodeURIComponent(`/forum/thread/${threadId}`)}`}
+                    className="bg-[#3b82f6] hover:bg-[#2563eb] text-white font-body font-semibold text-sm px-5 py-2 rounded-lg transition-colors"
+                  >
+                    Sign In
+                  </Link>
+                  <Link
+                    href={`/forum/register?next=${encodeURIComponent(`/forum/thread/${threadId}`)}`}
+                    className="border border-[#3b82f6] text-[#3b82f6] hover:bg-[#3b82f6]/10 font-body font-semibold text-sm px-5 py-2 rounded-lg transition-colors"
+                  >
+                    Register
+                  </Link>
+                </div>
+              </div>
+            )}
+
             {thread.status === 'closed' && (
               <div className="bg-[#1a1a1a] border border-[#333] rounded-lg p-4 text-center text-[#666] font-body text-sm">
                 This thread is closed to new replies.

src/app/forum/user/[username]/page.tsx

@@ -76,6 +76,7 @@ export default function ForumUserPage() {
   const [data, setData] = useState<{ profile: ForumUserProfile; threads: UserThread[]; replies: UserReply[] } | null>(null);
   const [loading, setLoading] = useState(true);
   const [notFound, setNotFound] = useState(false);
+  const [isOwnProfile, setIsOwnProfile] = useState(false);
 
   useEffect(() => {
     if (!username) return;
@@ -90,6 +91,18 @@ export default function ForumUserPage() {
       .finally(() => setLoading(false));
   }, [username]);
 
+  useEffect(() => {
+    if (!data?.profile) return;
+    fetch('/api/forum/profile/me')
+      .then(async (r) => (r.ok ? r.json() : null))
+      .then((d) => {
+        if (d?.profile?.username && d.profile.username === data.profile.username) {
+          setIsOwnProfile(true);
+        }
+      })
+      .catch(() => {});
+  }, [data]);
+
   if (loading) {
     return (
       <>
@@ -142,9 +155,19 @@ export default function ForumUserPage() {
               </div>
 
               <div className="flex-1 min-w-0">
-                <h1 className="font-heading text-2xl md:text-3xl font-bold text-[#e8e8e8] leading-tight">
+                <div className="flex items-center justify-between gap-3 flex-wrap">
-                  {profile.display_name}
+                  <h1 className="font-heading text-2xl md:text-3xl font-bold text-[#e8e8e8] leading-tight">
-                </h1>
+                    {profile.display_name}
+                  </h1>
+                  {isOwnProfile && (
+                    <Link
+                      href="/forum/profile/edit"
+                      className="text-xs font-body font-bold uppercase tracking-wider bg-[#3b82f6] hover:bg-[#2563eb] text-white px-3 py-1.5 rounded-sm transition-colors"
+                    >
+                      Edit Profile
+                    </Link>
+                  )}
+                </div>
                 <p className="font-body text-sm text-[#3b82f6] mt-0.5">@{profile.username}</p>
 
                 <div className="flex flex-wrap items-center gap-2 mt-3">

src/components/Header.tsx

@@ -269,10 +269,32 @@ export default function Header() {
             {/* Sign In / Register removed — PR firms now authenticate at
                 distribution.relevantmediaproperties.com; /wp-login,
                 /wp-admin, /login redirect there from middleware. */}
-            {currentUserId && (
+            {currentUserId ? (
-              <Link href="/account" className="text-[#999] hover:text-[#3b82f6] focus:text-[#3b82f6] focus:outline-none focus-visible:ring-1 focus-visible:ring-[#3b82f6] transition-colors text-xs font-body font-bold uppercase tracking-wider">
+              <>
-                My Profile
+                <Link href="/account" className="text-[#999] hover:text-[#3b82f6] focus:text-[#3b82f6] focus:outline-none focus-visible:ring-1 focus-visible:ring-[#3b82f6] transition-colors text-xs font-body font-bold uppercase tracking-wider">
-              </Link>
+                  My Profile
+                </Link>
+                <button
+                  type="button"
+                  onClick={async () => {
+                    const supabase = createClient();
+                    await supabase.auth.signOut();
+                    window.location.href = '/forum';
+                  }}
+                  className="text-[#999] hover:text-[#3b82f6] focus:text-[#3b82f6] focus:outline-none focus-visible:ring-1 focus-visible:ring-[#3b82f6] transition-colors text-xs font-body font-bold uppercase tracking-wider"
+                >
+                  Log Out
+                </button>
+              </>
+            ) : (
+              <>
+                <Link href="/forum/login" className="text-[#999] hover:text-[#3b82f6] focus:text-[#3b82f6] focus:outline-none focus-visible:ring-1 focus-visible:ring-[#3b82f6] transition-colors text-xs font-body font-bold uppercase tracking-wider">
+                  Sign In
+                </Link>
+                <Link href="/forum/register" className="text-[#3b82f6] hover:text-blue-300 focus:text-blue-300 focus:outline-none focus-visible:ring-1 focus-visible:ring-[#3b82f6] transition-colors text-xs font-body font-bold uppercase tracking-wider">
+                  Join
+                </Link>
+              </>
             )}
             {isAdmin && (
               <>

src/lib/forum/profile.ts

@@ -0,0 +1,73 @@
+import { createAdminClient } from "@/lib/supabase/admin";
+
+interface AuthedUser {
+  id: string;
+  email?: string | null;
+  user_metadata?: { full_name?: string; avatar_url?: string } | null;
+}
+
+interface ForumProfile {
+  id: string;
+  user_id: string;
+  username: string;
+  display_name: string;
+  avatar_url: string | null;
+  bio: string | null;
+  role_title: string | null;
+  company: string | null;
+}
+
+function slugifyUsername(seed: string): string {
+  const base = seed
+    .toLowerCase()
+    .replace(/@.*$/, "")
+    .replace(/[^a-z0-9]+/g, "_")
+    .replace(/^_+|_+$/g, "")
+    .slice(0, 24);
+  return base || "user";
+}
+
+/**
+ * Get the forum profile for an auth user. If one doesn't exist yet (new
+ * signup), create it lazily with a username derived from email. Uses the
+ * service-role client to bypass the INSERT RLS gap on forum_user_profiles.
+ */
+export async function ensureForumProfile(user: AuthedUser): Promise<ForumProfile> {
+  const admin = createAdminClient();
+
+  const { data: existing } = await admin
+    .from("forum_user_profiles")
+    .select("id, user_id, username, display_name, avatar_url, bio, role_title, company")
+    .eq("user_id", user.id)
+    .maybeSingle();
+
+  if (existing) return existing as ForumProfile;
+
+  const base = slugifyUsername(user.email || user.user_metadata?.full_name || "user");
+  let username = base;
+  for (let i = 0; i < 5; i++) {
+    const { data: clash } = await admin
+      .from("forum_user_profiles")
+      .select("id")
+      .eq("username", username)
+      .maybeSingle();
+    if (!clash) break;
+    username = `${base}_${Math.floor(1000 + Math.random() * 9000)}`;
+  }
+
+  const displayName = user.user_metadata?.full_name?.trim() || base;
+
+  const { data: created, error } = await admin
+    .from("forum_user_profiles")
+    .insert({
+      user_id: user.id,
+      username,
+      display_name: displayName,
+      avatar_url: user.user_metadata?.avatar_url || null,
+    })
+    .select("id, user_id, username, display_name, avatar_url, bio, role_title, company")
+    .single();
+
+  if (error) throw new Error(`forum profile create failed: ${error.message}`);
+  return created as ForumProfile;
+}