Nurfog/openccb
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: introduce CourseEditorLayout and AppHeader, add organization domain migration, and update Docker configurations and auth scripts

Browse Source
This commit is contained in:
Juan Enrique Allende Cifuentes
2025-12-29 18:00:34 -03:00
parent 3a02ecb757
commit ad56d8a81c
30 changed files with 558 additions and 405 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/studio/src/app/admin/organization/page.tsx
-77
View File
@@ -1,77 +0,0 @@
"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>
);
}
web/studio/src/app/admin/organizations/page.tsx
+8 -7
View File
@@ -3,6 +3,7 @@
import { useState, useEffect } from 'react';
import { cmsApi, Organization } from '@/lib/api';
import { useAuth } from '@/context/AuthContext';
import Image from 'next/image';
import { Plus, Building2, Globe, Calendar, ExternalLink, ShieldCheck, Palette, Upload, Save, X } from 'lucide-react';
export default function OrganizationsPage() {
@@ -141,9 +142,9 @@ export default function OrganizationsPage() {
</div>
<div className="flex items-start gap-4 mb-4">
<div className="p-3 rounded-lg bg-blue-500/10 text-blue-400 overflow-hidden w-12 h-12 flex items-center justify-center">
<div className="p-3 rounded-lg bg-blue-500/10 text-blue-400 overflow-hidden w-12 h-12 flex items-center justify-center relative">
{org.logo_url ? (
<img src={org.logo_url} alt={org.name} className="w-full h-full object-contain" />
<Image src={org.logo_url} alt={org.name} fill className="object-contain" />
) : (
<Building2 className="w-6 h-6" />
)}
@@ -256,9 +257,9 @@ export default function OrganizationsPage() {
<div>
<label className="block text-sm font-medium text-gray-400 mb-3 text-brand">Organization Logo</label>
<div className="flex items-center gap-4">
<div className="w-20 h-20 rounded-xl bg-black/40 border border-white/10 flex items-center justify-center overflow-hidden">
<div className="w-20 h-20 rounded-xl bg-black/40 border border-white/10 flex items-center justify-center overflow-hidden relative">
{selectedOrg.logo_url ? (
<img src={selectedOrg.logo_url} alt="Preview" className="w-full h-full object-contain" />
<Image src={selectedOrg.logo_url} alt="Preview" fill className="object-contain" />
) : (
<Building2 className="w-8 h-8 text-gray-600" />
)}
@@ -320,9 +321,9 @@ export default function OrganizationsPage() {
{/* Mock Experience Header */}
<div className="h-10 px-4 flex items-center justify-between border-b border-white/5" style={{ backgroundColor: primaryColor }}>
<div className="flex items-center gap-2">
<div className="w-5 h-5 bg-white/20 rounded flex items-center justify-center overflow-hidden">
<div className="w-5 h-5 bg-white/20 rounded flex items-center justify-center overflow-hidden relative">
{selectedOrg.logo_url ? (
<img src={selectedOrg.logo_url} alt="Logo" className="w-full h-full object-contain" />
<Image src={selectedOrg.logo_url} alt="Logo" fill className="object-contain" />
) : <div className="w-3 h-3 bg-white" />}
</div>
<div className="w-16 h-2 bg-white/30 rounded" />
@@ -366,7 +367,7 @@ export default function OrganizationsPage() {
<button
onClick={handleBrandingSave}
disabled={isSavingBranding}
className="flex-2 px-8 py-3 bg-blue-600 hover:bg-blue-500 text-white rounded-xl transition-all shadow-lg shadow-blue-500/20 font-bold flex items-center justify-center gap-2"
className="flex-[2] px-8 py-3 bg-blue-600 hover:bg-blue-500 text-white rounded-xl transition-all shadow-lg shadow-blue-500/20 font-bold flex items-center justify-center gap-2"
>
{isSavingBranding ? <div className="w-5 h-5 border-2 border-white/20 border-t-white rounded-full animate-spin" /> : <Save className="w-5 h-5" />}
Save Branding