naman_panwar_gnpl/pragativeer-v2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: Secure routes with auth middleware, update text and fix minor bugs

Browse Source
This commit is contained in:
ectasy663
2026-08-03 17:55:20 +05:30
parent 62d15c85f6
commit c2fab50749
68 changed files with 2515 additions and 6808 deletions
Download Patch File Download Diff File Expand all files Collapse all files

141
src/app/dashboard/community/page.tsx
View File

@@ -2,7 +2,7 @@
import { useState } from "react"
import { Card, CardContent, CardHeader, CardTitle, CardFooter } from "@/components/ui/card"
import { MessageSquare, ThumbsUp, ChevronUp, Search, Image as ImageIcon, CheckCircle, Lock } from "lucide-react"
import { MessageSquare, ThumbsUp, ChevronUp, Search, Image as ImageIcon, CheckCircle, Lock, X, Send } from "lucide-react"
import { useActiveUser } from "@/hooks/useActiveUser"
interface Doubt {
@@ -21,9 +21,11 @@ interface Doubt {
}
export default function CommunityPage() {
const { hasAccessTo } = useActiveUser()
const { hasAccessTo, loading } = useActiveUser()
const [activeFilter, setActiveFilter] = useState<'all' | 'my-doubts' | 'solved' | 'unsolved'>('all')
const [searchQuery, setSearchQuery] = useState('')
const [isAskModalOpen, setIsAskModalOpen] = useState(false)
const [expandedDoubtId, setExpandedDoubtId] = useState<string | null>(null)
const mockDoubts: Doubt[] = [
{
@@ -78,6 +80,15 @@ export default function CommunityPage() {
return true
})
if (loading) {
return (
<div className="h-[70vh] flex flex-col items-center justify-center p-8">
<div className="h-8 w-8 border-4 border-[#00F0FF] border-t-transparent rounded-full animate-spin mb-4"></div>
<p className="text-muted-foreground font-medium animate-pulse">Loading Doubt Forum...</p>
</div>
)
}
if (!hasAccessTo("doubt-resolution-community")) {
return (
<div className="p-8 h-full flex flex-col items-center justify-center text-center animate-in fade-in zoom-in duration-500 max-w-2xl mx-auto">
@@ -99,16 +110,23 @@ export default function CommunityPage() {
}
return (
<div className="p-8 space-y-6 animate-in fade-in slide-in-from-bottom-4 duration-500 max-w-5xl mx-auto">
<div className="p-8 space-y-6 animate-in fade-in slide-in-from-bottom-4 duration-500 max-w-7xl mx-auto">
<div className="flex flex-col md:flex-row justify-between items-start md:items-end gap-4">
<div>
<h1 className="text-3xl font-bold tracking-tight text-foreground flex items-center gap-3">
<MessageSquare className="text-[#00F0FF]" size={32} />
<h1 className="text-3xl md:text-4xl font-black tracking-tight flex items-center gap-3 mb-1">
<span className="p-2.5 rounded-xl bg-[#00F0FF]/10 border border-[#00F0FF]/20">
<MessageSquare className="text-[#00F0FF]" size={28} />
</span>
Doubt Forum
</h1>
<p className="text-muted-foreground mt-2 font-medium">Ask questions, share knowledge, and learn together with the community.</p>
<p className="text-muted-foreground text-base font-medium max-w-2xl pl-1">
Ask questions, share knowledge, and learn together with the community.
</p>
</div>
<button className="px-5 py-2.5 bg-[#00F0FF] text-black font-bold rounded-xl shadow-[0_0_15px_-3px_rgba(0,240,255,0.4)] hover:bg-[#00d0dd] transition-colors">
<button
onClick={() => setIsAskModalOpen(true)}
className="px-5 py-2.5 bg-[#00F0FF] text-black font-bold rounded-xl shadow-[0_0_15px_-3px_rgba(0,240,255,0.4)] hover:bg-[#00d0dd] transition-colors"
>
Ask a Doubt
</button>
</div>
@@ -179,12 +197,46 @@ export default function CommunityPage() {
<CheckCircle size={14} /> Solved
</span>
)}
<div className="flex items-center gap-1.5 text-muted-foreground hover:text-foreground transition-colors text-sm font-medium">
<button
onClick={() => setExpandedDoubtId(expandedDoubtId === doubt.id ? null : doubt.id)}
className="flex items-center gap-1.5 text-muted-foreground hover:text-foreground transition-colors text-sm font-medium"
>
<MessageSquare size={16} />
{doubt.replies} Replies
</div>
</button>
</div>
</div>
{/* Expanded Replies Section */}
{expandedDoubtId === doubt.id && (
<div className="mt-6 pt-4 border-t border-border space-y-4 animate-in fade-in duration-300">
<div className="flex gap-3">
<div className="h-8 w-8 shrink-0 rounded-full bg-[#00F0FF]/10 text-[#00F0FF] flex items-center justify-center text-xs font-bold border border-[#00F0FF]/30">
AI
</div>
<div className="bg-secondary/40 rounded-2xl rounded-tl-none p-4 text-sm flex-1">
<div className="font-bold mb-1 flex items-center gap-2">
PragatiVeer AI
<span className="text-[10px] text-emerald-500 bg-emerald-500/10 px-1.5 py-0.5 rounded uppercase tracking-wider">Expert</span>
</div>
<p className="text-muted-foreground">
This is a great question! When the car accelerates, the engine applies a torque to the wheel, making it want to spin faster. If there were no friction, the bottom of the tire would slip backward relative to the road. Therefore, static friction acts in the forward direction on the tire to oppose this backward slipping motion.
</p>
</div>
</div>
<div className="flex gap-3 mt-4 items-center">
<input
type="text"
placeholder="Add a reply..."
className="flex-1 bg-background border border-border rounded-xl px-4 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-[#00F0FF]/50"
/>
<button className="p-2 bg-[#00F0FF] text-black rounded-xl hover:bg-[#00d0dd] transition-colors">
<Send size={16} />
</button>
</div>
</div>
)}
</div>
</CardContent>
</Card>
@@ -196,6 +248,77 @@ export default function CommunityPage() {
</div>
)}
</div>
{/* Ask Doubt Modal */}
{isAskModalOpen && (
<div className="fixed inset-0 z-50 flex items-center justify-center p-4 bg-background/80 backdrop-blur-sm animate-in fade-in duration-200">
<div className="bg-background border border-border w-full max-w-2xl rounded-2xl shadow-2xl overflow-hidden animate-in zoom-in-95 duration-200">
<div className="flex justify-between items-center p-6 border-b border-border bg-secondary/30">
<h2 className="text-2xl font-bold flex items-center gap-2">
<MessageSquare className="text-[#00F0FF]" /> Ask a Doubt
</h2>
<button
onClick={() => setIsAskModalOpen(false)}
className="text-muted-foreground hover:text-foreground hover:bg-secondary p-2 rounded-lg transition-colors"
>
<X size={20} />
</button>
</div>
<div className="p-6 space-y-4">
<div className="grid grid-cols-2 gap-4">
<div className="space-y-1.5">
<label className="text-sm font-medium text-muted-foreground">Subject</label>
<select className="w-full bg-background border border-border rounded-xl px-4 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-[#00F0FF]/50">
<option>Physics</option>
<option>Chemistry</option>
<option>Mathematics</option>
<option>Biology</option>
</select>
</div>
<div className="space-y-1.5">
<label className="text-sm font-medium text-muted-foreground">Topic</label>
<input
type="text"
placeholder="e.g. Rotational Mechanics"
className="w-full bg-background border border-border rounded-xl px-4 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-[#00F0FF]/50"
/>
</div>
</div>
<div className="space-y-1.5">
<label className="text-sm font-medium text-muted-foreground">Question Title</label>
<input
type="text"
placeholder="What exactly are you stuck on?"
className="w-full bg-background border border-border rounded-xl px-4 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-[#00F0FF]/50"
/>
</div>
<div className="space-y-1.5">
<label className="text-sm font-medium text-muted-foreground">Detailed Description</label>
<textarea
rows={4}
placeholder="Explain your approach, what you've tried, and where you're getting stuck..."
className="w-full bg-background border border-border rounded-xl px-4 py-3 text-sm focus:outline-none focus:ring-2 focus:ring-[#00F0FF]/50 resize-none"
/>
</div>
<div className="pt-2 border-t border-border flex justify-between items-center">
<button className="flex items-center gap-2 text-muted-foreground hover:text-[#00F0FF] transition-colors text-sm font-medium px-3 py-2 rounded-lg hover:bg-secondary">
<ImageIcon size={18} /> Attach Image
</button>
<button
onClick={() => setIsAskModalOpen(false)}
className="flex items-center gap-2 px-6 py-2.5 bg-[#00F0FF] text-black font-bold rounded-xl shadow-[0_0_15px_-3px_rgba(0,240,255,0.4)] hover:bg-[#00d0dd] transition-colors"
>
Post Doubt <Send size={16} />
</button>
</div>
</div>
</div>
</div>
)}
</div>
)
}