Implement active user tiers, class-based Tailwind theme switcher, 3-tiled static dashboard layout, Minio object storage integration, school & state settings database sync, and streak wishes onboarding modal

src/app/upgrade/page.tsx

@@ -5,10 +5,12 @@ import { Card, CardContent, CardHeader, CardTitle, CardDescription, CardFooter }
 import { Button } from "@/components/ui/button"
 import { Check, X, ShieldCheck, Loader2 } from "lucide-react"
 
-const USER_ID = "b0e17378-864d-439e-8806-708dc48a891b"
+import { useActiveUser } from "@/hooks/useActiveUser"
+
 const WEBHOOK_SECRET = "local_webhook_secret"
 
 export default function UpgradePage() {
+  const { userId, loading: userLoading, refreshUser } = useActiveUser()
   const [loadingTier, setLoadingTier] = useState<string | null>(null)
   const [showModal, setShowModal] = useState(false)
   const [orderData, setOrderData] = useState<any>(null)
@@ -16,9 +18,10 @@ export default function UpgradePage() {
   const [success, setSuccess] = useState(false)
 
   const handleUpgrade = async (tier: string) => {
+    if (userLoading || !userId) return
     setLoadingTier(tier)
     try {
-      const res = await fetch(`http://localhost:8000/api/billing/create-order?user_id=${USER_ID}&plan_tier=${tier}`, {
+      const res = await fetch(`/api/billing/create-order?user_id=${userId}&plan_tier=${tier}`, {
         method: "POST"
       })
       if (!res.ok) throw new Error("Order creation failed")
@@ -47,6 +50,7 @@ export default function UpgradePage() {
   }
 
   const simulatePayment = async () => {
+    if (!userId) return
     setProcessing(true)
     try {
       const payloadObj = {
@@ -57,7 +61,7 @@ export default function UpgradePage() {
               id: `pay_mock_${Date.now()}`,
               amount: orderData.amount,
               notes: {
-                user_id: USER_ID,
+                user_id: userId,
                 tier_requested: orderData.tier
               }
             }
@@ -68,7 +72,7 @@ export default function UpgradePage() {
       const payloadStr = JSON.stringify(payloadObj)
       const signature = await generateMockSignature(payloadStr)
 
-      const res = await fetch(`http://localhost:8000/api/billing/webhook/razorpay`, {
+      const res = await fetch(`/api/billing/webhook/razorpay`, {
         method: "POST",
         headers: {
           "Content-Type": "application/json",
@@ -80,6 +84,7 @@ export default function UpgradePage() {
       if (!res.ok) throw new Error("Webhook failed")
       
       setSuccess(true)
+      await refreshUser()
       setTimeout(() => {
         window.location.href = "/dashboard"
       }, 2000)