fix(settings): use NextAuth session instead of undefined Firebase auth
The settings page imported `auth` from `@/lib/firebase/config` and called
`auth.currentUser` inside an unguarded `useEffect`. Since the app runs on
PostgreSQL + NextAuth (Firebase isn't configured), `auth` was `undefined`
and the uncaught TypeError crashed React's commit, leaving the page blank
behind the Next.js dev error overlay. The WorkspaceKeysPanel never got a
chance to mount even though `/api/workspaces` was returning fine.
Swap to `useSession()` from `next-auth/react` to read display name + email
from the existing NextAuth session. Drop the dead fetch to
`/api/workspace/{slug}/settings`, which was never implemented.
Made-with: Cursor
This commit is contained in:
@@ -5,7 +5,7 @@ import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/com
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Input } from '@/components/ui/input';
|
||||
import { Label } from '@/components/ui/label';
|
||||
import { auth } from '@/lib/firebase/config';
|
||||
import { useSession } from 'next-auth/react';
|
||||
import { toast } from 'sonner';
|
||||
import { Settings, User, Bell, Shield, Trash2 } from 'lucide-react';
|
||||
import { useParams, useRouter } from 'next/navigation';
|
||||
@@ -32,6 +32,7 @@ export default function SettingsPage() {
|
||||
const params = useParams();
|
||||
const router = useRouter();
|
||||
const workspace = params.workspace as string;
|
||||
const { data: session, status } = useSession();
|
||||
const [settings, setSettings] = useState<WorkspaceSettings | null>(null);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [saving, setSaving] = useState(false);
|
||||
@@ -39,51 +40,19 @@ export default function SettingsPage() {
|
||||
const [email, setEmail] = useState('');
|
||||
|
||||
useEffect(() => {
|
||||
loadSettings();
|
||||
loadUserProfile();
|
||||
}, []);
|
||||
|
||||
const loadSettings = async () => {
|
||||
try {
|
||||
const user = auth.currentUser;
|
||||
if (!user) return;
|
||||
|
||||
const token = await user.getIdToken();
|
||||
const response = await fetch(`/api/workspace/${workspace}/settings`, {
|
||||
headers: {
|
||||
'Authorization': `Bearer ${token}`,
|
||||
},
|
||||
});
|
||||
|
||||
if (response.ok) {
|
||||
const data = await response.json();
|
||||
setSettings(data);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error loading settings:', error);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
const loadUserProfile = () => {
|
||||
const user = auth.currentUser;
|
||||
if (user) {
|
||||
setDisplayName(user.displayName || '');
|
||||
setEmail(user.email || '');
|
||||
}
|
||||
};
|
||||
if (status === 'loading') return;
|
||||
setDisplayName(session?.user?.name ?? '');
|
||||
setEmail(session?.user?.email ?? '');
|
||||
setLoading(false);
|
||||
}, [session, status]);
|
||||
|
||||
const handleSaveProfile = async () => {
|
||||
setSaving(true);
|
||||
try {
|
||||
const user = auth.currentUser;
|
||||
if (!user) {
|
||||
if (!session?.user) {
|
||||
toast.error('Please sign in');
|
||||
return;
|
||||
}
|
||||
|
||||
// Update profile logic would go here
|
||||
toast.success('Profile updated successfully');
|
||||
} catch (error) {
|
||||
console.error('Error saving profile:', error);
|
||||
|
||||
Reference in New Issue
Block a user