Index: chapterx-frontend/src/pages/admin/AdminContentPage.tsx =================================================================== --- chapterx-frontend/src/pages/admin/AdminContentPage.tsx (revision b62cefc14094ca5ac7154f7d48797a1e6c444935) +++ chapterx-frontend/src/pages/admin/AdminContentPage.tsx (revision b62cefc14094ca5ac7154f7d48797a1e6c444935) @@ -0,0 +1,32 @@ +import React from 'react' +import { useNavigate } from 'react-router-dom' +import { ArrowLeft, BookOpen } from 'lucide-react' +import { useStoryStore } from '../../store/storyStore' +import { ContentModerationTable } from '../../components/admin/ContentModerationTable' + +export const AdminContentPage: React.FC = () => { + const navigate = useNavigate() + const { stories } = useStoryStore() + + return ( +
+
+ +
+

Content Moderation

+

{stories.length} total stories

+
+
+ +
+
+ +

All Stories

+
+ +
+
+ ) +} Index: chapterx-frontend/src/pages/admin/AdminDashboard.tsx =================================================================== --- chapterx-frontend/src/pages/admin/AdminDashboard.tsx (revision b62cefc14094ca5ac7154f7d48797a1e6c444935) +++ chapterx-frontend/src/pages/admin/AdminDashboard.tsx (revision b62cefc14094ca5ac7154f7d48797a1e6c444935) @@ -0,0 +1,130 @@ +import React from 'react' +import { useNavigate } from 'react-router-dom' +import { Shield, Users, BookOpen, AlertTriangle, Settings, ChevronRight } from 'lucide-react' +import { useAuthStore } from '../../store/authStore' +import { useStoryStore } from '../../store/storyStore' +import { useNotificationStore } from '../../store/notificationStore' +import { PlatformStats } from '../../components/admin/PlatformStats' +import { Button } from '../../components/ui/Button' +import { RoleBadge } from '../../components/ui/Badge' +import { Avatar } from '../../components/ui/Avatar' + +function timeAgo(str: string): string { + const diff = Date.now() - new Date(str).getTime() + const m = Math.floor(diff / 60000) + if (m < 1) return 'just now' + if (m < 60) return `${m}m ago` + const h = Math.floor(m / 60) + if (h < 24) return `${h}h ago` + return `${Math.floor(h / 24)}d ago` +} + +export const AdminDashboard: React.FC = () => { + const navigate = useNavigate() + const { allUsers } = useAuthStore() + const { stories } = useStoryStore() + const { notifications } = useNotificationStore() + + const recentUsers = [...allUsers].sort((a, b) => new Date(b.created_at).getTime() - new Date(a.created_at).getTime()).slice(0, 5) + const recentStories = [...stories].sort((a, b) => new Date(b.created_at).getTime() - new Date(a.created_at).getTime()).slice(0, 5) + + const adminLinks = [ + { to: '/admin/users', icon: , label: 'Manage Users', desc: `${allUsers.length} registered users`, color: 'bg-blue-500/10 border-blue-500/20' }, + { to: '/admin/content', icon: , label: 'Content Moderation', desc: `${stories.length} total stories`, color: 'bg-violet-500/10 border-violet-500/20' }, + { to: '/admin/genres', icon: , label: 'Manage Genres', desc: 'Add or remove genres', color: 'bg-amber-500/10 border-amber-500/20' }, + ] + + return ( +
+ {/* Header */} +
+
+ +
+
+

Admin Dashboard

+

Platform management and moderation

+
+
+ + {/* Platform stats */} +
+

Platform Overview

+ +
+ + {/* Quick links */} +
+ {adminLinks.map(link => ( + + ))} +
+ +
+ {/* Recent users */} +
+
+

Recent Users

+ +
+
+ {recentUsers.map(user => ( +
+ +
+

{user.name} {user.surname}

+

@{user.username}

+
+ +
+ ))} +
+
+ + {/* Recent stories */} +
+
+

Recent Stories

+ +
+
+ {recentStories.map(story => ( +
+
+

{story.title}

+

by @{story.author_username}

+
+ + {story.status} + +
+ ))} +
+
+
+
+ ) +} Index: chapterx-frontend/src/pages/admin/AdminGenresPage.tsx =================================================================== --- chapterx-frontend/src/pages/admin/AdminGenresPage.tsx (revision b62cefc14094ca5ac7154f7d48797a1e6c444935) +++ chapterx-frontend/src/pages/admin/AdminGenresPage.tsx (revision b62cefc14094ca5ac7154f7d48797a1e6c444935) @@ -0,0 +1,126 @@ +import React, { useState } from 'react' +import { useNavigate } from 'react-router-dom' +import { ArrowLeft, Plus, Trash2, Tag } from 'lucide-react' +import { useStoryStore } from '../../store/storyStore' +import { useUIStore } from '../../store/uiStore' +import { Button } from '../../components/ui/Button' +import { Modal } from '../../components/ui/Modal' +import { Genre } from '../../types' + +export const AdminGenresPage: React.FC = () => { + const navigate = useNavigate() + const { genres, addGenre, deleteGenre } = useStoryStore() + const { addToast } = useUIStore() + const [addOpen, setAddOpen] = useState(false) + const [newName, setNewName] = useState('') + const [deleteTarget, setDeleteTarget] = useState(null) + + const handleAdd = () => { + if (!newName.trim()) return + if (genres.some(g => g.name.toLowerCase() === newName.trim().toLowerCase())) { + addToast('Genre already exists', 'error') + return + } + addGenre({ genre_id: Date.now(), name: newName.trim(), story_count: 0 }) + addToast(`Genre "${newName.trim()}" added!`) + setNewName('') + setAddOpen(false) + } + + const handleDelete = (genre: Genre) => { + if (genre.story_count > 0) { + addToast('Cannot delete genre with associated stories', 'error') + return + } + deleteGenre(genre.genre_id) + addToast(`Genre "${genre.name}" deleted`, 'info') + setDeleteTarget(null) + } + + return ( +
+
+
+ +
+

Manage Genres

+

{genres.length} genres

+
+
+ +
+ +
+
+ +

All Genres

+
+
+ {genres.map(genre => ( +
+
+
+ {genre.name} +
+
+ {genre.story_count} stories + +
+
+ ))} +
+
+ + {/* Add modal */} + setAddOpen(false)} title="Add Genre" size="sm"> +
+
+ + setNewName(e.target.value)} + onKeyDown={e => e.key === 'Enter' && handleAdd()} + placeholder="e.g., Dystopia..." + className="w-full px-4 py-3 bg-slate-800 border border-slate-700 rounded-xl text-white placeholder-slate-500 focus:outline-none focus:border-indigo-500" + /> +
+
+ + +
+
+ + + {/* Delete confirm */} + setDeleteTarget(null)} title="Delete Genre" size="sm"> + {deleteTarget && ( +
+

+ Delete the genre "{deleteTarget.name}"? This action cannot be undone. +

+
+ + +
+
+ )} + +
+ ) +} Index: chapterx-frontend/src/pages/admin/AdminUsersPage.tsx =================================================================== --- chapterx-frontend/src/pages/admin/AdminUsersPage.tsx (revision b62cefc14094ca5ac7154f7d48797a1e6c444935) +++ chapterx-frontend/src/pages/admin/AdminUsersPage.tsx (revision b62cefc14094ca5ac7154f7d48797a1e6c444935) @@ -0,0 +1,33 @@ +import React from 'react' +import { useNavigate } from 'react-router-dom' +import { ArrowLeft, Users } from 'lucide-react' +import { useAuthStore } from '../../store/authStore' +import { UserTable } from '../../components/admin/UserTable' +import { Button } from '../../components/ui/Button' + +export const AdminUsersPage: React.FC = () => { + const navigate = useNavigate() + const { allUsers } = useAuthStore() + + return ( +
+
+ +
+

User Management

+

{allUsers.length} registered users

+
+
+ +
+
+ +

All Users

+
+ +
+
+ ) +}