feat: Implement AI-driven lesson summaries, automate quiz generation, add gamification base, and introduce Studio organization management.

2025-12-26 14:58:58 -03:00
parent 2378f616aa
commit e98a16d860
26 changed files with 791 additions and 82 deletions
@@ -0,0 +1,77 @@
+"use client";
+
+import { useEffect, useState } from "react";
+import { cmsApi, Organization } from "@/lib/api";
+import { Building2, Calendar, Hash } from "lucide-react";
+
+export default function OrganizationPage() {
+    const [org, setOrg] = useState<Organization | null>(null);
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState<string | null>(null);
+
+    useEffect(() => {
+        const fetchOrg = async () => {
+            try {
+                const data = await cmsApi.getOrganization();
+                setOrg(data);
+            } catch (err) {
+                setError(err instanceof Error ? err.message : "Failed to load organization");
+            } finally {
+                setLoading(false);
+            }
+        };
+
+        fetchOrg();
+    }, []);
+
+    if (loading) return <div className="p-8 text-center text-gray-500">Loading organization details...</div>;
+    if (error) return <div className="p-8 text-center text-red-500 font-bold">Error: {error}</div>;
+
+    return (
+        <div className="p-8 max-w-5xl mx-auto space-y-8">
+            <header>
+                <h1 className="text-3xl font-black tracking-tighter text-white mb-2">Organization Settings</h1>
+                <p className="text-gray-400">Manage your organization&apos;s profile and settings.</p>
+            </header>
+
+            {org && (
+                <div className="grid gap-6 md:grid-cols-2">
+                    <div className="glass-card p-6 space-y-4">
+                        <div className="flex items-center gap-3 text-blue-400 mb-2">
+                            <Building2 size={24} />
+                            <h2 className="text-xl font-bold text-white">Profile</h2>
+                        </div>
+
+                        <div className="space-y-1">
+                            <label className="text-[10px] uppercase font-black tracking-widest text-gray-500">Organization Name</label>
+                            <div className="text-lg font-medium text-white">{org.name}</div>
+                        </div>
+
+                        <div className="space-y-1">
+                            <label className="text-[10px] uppercase font-black tracking-widest text-gray-500">Organization ID</label>
+                            <div className="flex items-center gap-2 text-sm text-gray-400 font-mono bg-black/20 p-2 rounded border border-white/5">
+                                <Hash size={14} />
+                                {org.id}
+                            </div>
+                        </div>
+
+                        <div className="space-y-1">
+                            <label className="text-[10px] uppercase font-black tracking-widest text-gray-500">Created At</label>
+                            <div className="flex items-center gap-2 text-sm text-gray-400">
+                                <Calendar size={14} />
+                                {new Date(org.created_at).toLocaleDateString()}
+                            </div>
+                        </div>
+                    </div>
+
+                    <div className="glass-card p-6 flex items-center justify-center text-center text-gray-500">
+                        <div>
+                            <p className="mb-2 font-bold">More settings coming soon</p>
+                            <p className="text-xs">User management and billing features are under development.</p>
+                        </div>
+                    </div>
+                </div>
+            )}
+        </div>
+    );
+}