Spaces:
Sleeping
Sleeping
File size: 2,408 Bytes
83c125e | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 | import { useState } from 'react'
import { useAuth } from '@/hooks/useAuth'
import { AdminUserManagement } from './AdminUserManagement'
import { AdminChannelManagement } from './AdminChannelManagement'
import { AdminAuditLog } from './AdminAuditLog'
import { AdminWorkspaceSettings } from './AdminWorkspaceSettings'
type AdminTab = 'users' | 'channels' | 'audit' | 'workspace'
const TABS: { id: AdminTab; label: string }[] = [
{ id: 'users', label: 'Users' },
{ id: 'channels', label: 'Channels' },
{ id: 'audit', label: 'Audit Log' },
{ id: 'workspace', label: 'Workspace' },
]
export function AdminWorkspace() {
const { user } = useAuth()
const [tab, setTab] = useState<AdminTab>('users')
// Only admins and org_admins can access this
if (!user || (user.role !== 'admin' && user.role !== 'manager')) {
return (
<div className="rounded-lg border border-red-200 bg-red-50 p-6 text-center dark:border-red-900 dark:bg-red-950">
<p className="text-sm font-semibold text-red-900 dark:text-red-200">
You don't have permission to access the admin panel
</p>
</div>
)
}
return (
<div className="space-y-4">
<div className="flex items-center justify-between">
<div>
<h2 className="text-lg font-semibold">Admin Workspace</h2>
<p className="text-xs text-stone-500">Manage users, channels, and audit logs</p>
</div>
</div>
{/* Tab Navigation */}
<div className="flex gap-1 overflow-x-auto border-b border-stone-200 dark:border-stone-700">
{TABS.map((t) => (
<button
key={t.id}
onClick={() => setTab(t.id)}
className={`whitespace-nowrap px-3 py-2 text-sm font-medium transition-colors ${
tab === t.id
? 'border-b-2 border-brand text-brand'
: 'text-stone-500 hover:text-stone-700 dark:hover:text-stone-300'
}`}
>
{t.label}
</button>
))}
</div>
{/* Tab Content */}
<div className="rounded-lg border border-stone-200 bg-white dark:border-stone-700 dark:bg-stone-900">
{tab === 'users' && <AdminUserManagement />}
{tab === 'channels' && <AdminChannelManagement />}
{tab === 'audit' && <AdminAuditLog />}
{tab === 'workspace' && <AdminWorkspaceSettings />}
</div>
</div>
)
}
|