Update README.md to provide a comprehensive overview of the ScriptShare platform, including features, tech stack, setup instructions, admin capabilities, and contribution guidelines.
This commit is contained in:
165
src/pages/AdminPanel.tsx
Normal file
165
src/pages/AdminPanel.tsx
Normal file
@ -0,0 +1,165 @@
|
||||
import { useState } from 'react';
|
||||
import { Header } from '@/components/Header';
|
||||
import { Footer } from '@/components/Footer';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Shield, Users, BarChart3, FileText, ArrowLeft } from 'lucide-react';
|
||||
import { AdminDashboard } from '@/components/admin/AdminDashboard';
|
||||
import { CreateAdminForm } from '@/components/admin/CreateAdminForm';
|
||||
import { AdminUsersList } from '@/components/admin/AdminUsersList';
|
||||
import { useAuth } from '@/contexts/AuthContext';
|
||||
|
||||
type AdminView = 'dashboard' | 'create-user' | 'users' | 'scripts' | 'analytics';
|
||||
|
||||
export default function AdminPanel() {
|
||||
const { user } = useAuth();
|
||||
const [currentView, setCurrentView] = useState<AdminView>('dashboard');
|
||||
|
||||
// Check if user has admin access
|
||||
if (!user?.isAdmin) {
|
||||
return (
|
||||
<div className="min-h-screen flex flex-col bg-gradient-to-br from-background via-background to-primary/5">
|
||||
<Header onSearch={() => {}} />
|
||||
|
||||
<main className="flex-1 container mx-auto px-4 py-16">
|
||||
<div className="max-w-2xl mx-auto text-center space-y-6">
|
||||
<Shield className="h-16 w-16 text-muted-foreground mx-auto" />
|
||||
<h1 className="text-4xl font-bold">Access Denied</h1>
|
||||
<p className="text-xl text-muted-foreground">
|
||||
You don't have permission to access the admin panel.
|
||||
</p>
|
||||
<Button onClick={() => window.history.back()}>
|
||||
Go Back
|
||||
</Button>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<Footer />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
const renderView = () => {
|
||||
switch (currentView) {
|
||||
case 'dashboard':
|
||||
return (
|
||||
<AdminDashboard
|
||||
onCreateUser={() => setCurrentView('create-user')}
|
||||
onViewScripts={() => setCurrentView('scripts')}
|
||||
onViewAnalytics={() => setCurrentView('analytics')}
|
||||
/>
|
||||
);
|
||||
case 'create-user':
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div className="flex items-center gap-4">
|
||||
<Button
|
||||
variant="outline"
|
||||
onClick={() => setCurrentView('dashboard')}
|
||||
className="flex items-center gap-2"
|
||||
>
|
||||
<ArrowLeft className="h-4 w-4" />
|
||||
Back to Dashboard
|
||||
</Button>
|
||||
</div>
|
||||
<CreateAdminForm onSuccess={() => setCurrentView('users')} />
|
||||
</div>
|
||||
);
|
||||
case 'users':
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<div className="flex items-center gap-4">
|
||||
<Button
|
||||
variant="outline"
|
||||
onClick={() => setCurrentView('dashboard')}
|
||||
className="flex items-center gap-2"
|
||||
>
|
||||
<ArrowLeft className="h-4 w-4" />
|
||||
Back to Dashboard
|
||||
</Button>
|
||||
</div>
|
||||
<Button onClick={() => setCurrentView('create-user')}>
|
||||
<Users className="h-4 w-4 mr-2" />
|
||||
Create Admin User
|
||||
</Button>
|
||||
</div>
|
||||
<AdminUsersList />
|
||||
</div>
|
||||
);
|
||||
case 'scripts':
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div className="flex items-center gap-4">
|
||||
<Button
|
||||
variant="outline"
|
||||
onClick={() => setCurrentView('dashboard')}
|
||||
className="flex items-center gap-2"
|
||||
>
|
||||
<ArrowLeft className="h-4 w-4" />
|
||||
Back to Dashboard
|
||||
</Button>
|
||||
</div>
|
||||
<div className="text-center py-12">
|
||||
<FileText className="h-16 w-16 text-muted-foreground mx-auto mb-4" />
|
||||
<h2 className="text-2xl font-bold mb-2">Script Review</h2>
|
||||
<p className="text-muted-foreground">
|
||||
Script review functionality coming soon!
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
case 'analytics':
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div className="flex items-center gap-4">
|
||||
<Button
|
||||
variant="outline"
|
||||
onClick={() => setCurrentView('dashboard')}
|
||||
className="flex items-center gap-2"
|
||||
>
|
||||
<ArrowLeft className="h-4 w-4" />
|
||||
Back to Dashboard
|
||||
</Button>
|
||||
</div>
|
||||
<div className="text-center py-12">
|
||||
<BarChart3 className="h-16 w-16 text-muted-foreground mx-auto mb-4" />
|
||||
<h2 className="text-2xl font-bold mb-2">Analytics Dashboard</h2>
|
||||
<p className="text-muted-foreground">
|
||||
Analytics functionality coming soon!
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
default:
|
||||
return null;
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="min-h-screen flex flex-col bg-gradient-to-br from-background via-background to-primary/5">
|
||||
<Header onSearch={() => {}} />
|
||||
|
||||
<main className="flex-1 container mx-auto px-4 py-16">
|
||||
<div className="max-w-6xl mx-auto space-y-8">
|
||||
<div className="text-center space-y-4">
|
||||
<Shield className="h-16 w-16 text-primary mx-auto" />
|
||||
<h1 className="text-4xl font-bold">Admin Panel</h1>
|
||||
<p className="text-xl text-muted-foreground">
|
||||
Manage the platform and moderate content.
|
||||
</p>
|
||||
{user.isSuperUser && (
|
||||
<div className="inline-flex items-center gap-2 px-3 py-1 bg-amber-100 dark:bg-amber-900/30 text-amber-800 dark:text-amber-200 rounded-full text-sm font-medium">
|
||||
<Shield className="h-4 w-4" />
|
||||
Super User Access
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{renderView()}
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<Footer />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user