Changeset 99c1e45 for chapterx-frontend/src/pages/writer
- Timestamp:
- 06/24/26 16:28:50 (12 days ago)
- Branches:
- main
- Children:
- a8f4a2d
- Parents:
- 0b502c2
- Location:
- chapterx-frontend/src/pages/writer
- Files:
-
- 2 edited
-
CreateStoryPage.tsx (modified) (3 diffs)
-
WriterDashboard.tsx (modified) (6 diffs)
Legend:
- Unmodified
- Added
- Removed
-
chapterx-frontend/src/pages/writer/CreateStoryPage.tsx
r0b502c2 r99c1e45 21 21 short_description: '', 22 22 content: '', 23 cover_image: '', 23 24 genres: [] as string[], 24 25 mature_content: false, … … 45 46 story_id: Date.now(), 46 47 ...form, 48 cover_image: form.cover_image || undefined, 47 49 user_id: currentUser.user_id, 48 50 author_username: currentUser.username, … … 124 126 <span className="text-slate-600 text-xs">{form.short_description.length}/280</span> 125 127 </div> 128 </div> 129 130 {/* Cover image */} 131 <div> 132 <label className="block text-sm font-medium text-slate-300 mb-1.5">Cover Image URL <span className="text-slate-500 font-normal">(optional)</span></label> 133 <input 134 value={form.cover_image} 135 onChange={e => { 136 const val = e.target.value 137 if (!val || val.startsWith('http')) setField('cover_image', val) 138 }} 139 placeholder="https://example.com/image.jpg" 140 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" 141 /> 142 {form.cover_image?.startsWith('http') && ( 143 <img src={form.cover_image} alt="Cover preview" className="mt-2 h-32 w-full object-cover rounded-xl opacity-80" onError={e => (e.currentTarget.style.display = 'none')} /> 144 )} 126 145 </div> 127 146 -
chapterx-frontend/src/pages/writer/WriterDashboard.tsx
r0b502c2 r99c1e45 1 import React from 'react'1 import React, { useEffect } from 'react' 2 2 import { useNavigate } from 'react-router-dom' 3 import { Plus, BookOpen, Eye,Heart, MessageCircle, TrendingUp, Bell } from 'lucide-react'3 import { Plus, BookOpen, Heart, MessageCircle, TrendingUp, Bell } from 'lucide-react' 4 4 import { useAuthStore } from '../../store/authStore' 5 5 import { useStoryStore } from '../../store/storyStore' … … 22 22 const navigate = useNavigate() 23 23 const { currentUser } = useAuthStore() 24 const { stories, collaborations } = useStoryStore()24 const { stories, collaborations, fetchStories } = useStoryStore() 25 25 const { notifications } = useNotificationStore() 26 27 useEffect(() => { fetchStories() }, []) 26 28 27 29 if (!currentUser) return null … … 34 36 const published = myStories.filter(s => s.status === 'published') 35 37 const drafts = myStories.filter(s => s.status === 'draft') 36 const totalViews = myStories.reduce((acc, s) => acc + s.total_views, 0)37 38 const totalLikes = myStories.reduce((acc, s) => acc + s.total_likes, 0) 38 39 … … 56 57 57 58 {/* Stats */} 58 <div className="grid grid-cols-2 lg:grid-cols- 4gap-4 mb-8">59 <div className="grid grid-cols-2 lg:grid-cols-3 gap-4 mb-8"> 59 60 {[ 60 61 { icon: <BookOpen size={20} className="text-indigo-300" />, label: 'Total Stories', value: myStories.length, sub: `${published.length} published`, color: 'bg-indigo-500/20' }, 61 { icon: <Eye size={20} className="text-blue-300" />, label: 'Total Views', value: totalViews.toLocaleString(), sub: 'All time', color: 'bg-blue-500/20' },62 62 { icon: <Heart size={20} className="text-rose-300" />, label: 'Total Likes', value: totalLikes.toLocaleString(), sub: 'Across all stories', color: 'bg-rose-500/20' }, 63 63 { icon: <TrendingUp size={20} className="text-emerald-300" />, label: 'Drafts', value: drafts.length, sub: 'In progress', color: 'bg-emerald-500/20' }, … … 108 108 <div className="flex items-center gap-3 text-slate-500 text-xs"> 109 109 {isCollab && <span className="text-slate-500">by {story.author_username}</span>} 110 <span className="flex items-center gap-1"><Eye size={11} /> {story.total_views.toLocaleString()}</span>111 110 <span className="flex items-center gap-1"><Heart size={11} /> {story.total_likes}</span> 112 111 <span className="flex items-center gap-1"><MessageCircle size={11} /> {story.total_comments}</span> … … 155 154 <TrendingUp size={18} className="text-indigo-400" /> 156 155 <h2 className="font-serif text-xl font-bold text-white">Analytics</h2> 157 <span className="text-slate-500 text-sm">(Story: The Chronicles of Eldoria)</span>158 156 </div> 159 <StoryAnalytics />157 <StoryAnalytics stories={myStories} /> 160 158 </div> 161 159 )}
Note:
See TracChangeset
for help on using the changeset viewer.
