Refactor layout and home page for improved localization and session handling

- Updated RootLayout to include locale support and integrated ThemeProvider and LocaleProvider for better internationalization. - Replaced static home page content with a redirect based on user session status, enhancing user experience by directing to the appropriate dashboard or login page. - Switched font from Geist to Inter for improved typography consistency.
2026-07-22 14:01:09 +02:00
parent 04e04eb11d
commit 84476e6277
30 changed files with 1073 additions and 128 deletions
--- a/apps/webui/src/components/settings/module-toggles-form.tsx
+++ b/apps/webui/src/components/settings/module-toggles-form.tsx
@@ -0,0 +1,102 @@
+'use client';
+
+import { DASHBOARD_MODULES, type DashboardModuleGroup, type DashboardModuleId, type ModuleStatus } from '@nexumi/shared';
+import { ArrowUpRight } from 'lucide-react';
+import Link from 'next/link';
+import { useTranslations } from '@/components/locale-provider';
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
+import { Switch } from '@/components/ui/switch';
+import type { SettingsSaveResult } from './settings-form';
+import { SettingsForm } from './settings-form';
+
+type ModuleToggleValue = Record<DashboardModuleId, boolean>;
+
+const MODULE_GROUP_ORDER: DashboardModuleGroup[] = [
+  'moderation',
+  'engagement',
+  'community',
+  'utility',
+  'integrations'
+];
+
+function toValue(statuses: ModuleStatus[]): ModuleToggleValue {
+  return statuses.reduce<ModuleToggleValue>((acc, status) => {
+    acc[status.id] = status.enabled;
+    return acc;
+  }, {} as ModuleToggleValue);
+}
+
+async function saveModules(guildId: string, value: ModuleToggleValue): Promise<SettingsSaveResult> {
+  try {
+    const response = await fetch(`/api/guilds/${guildId}/modules`, {
+      method: 'PATCH',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ modules: value })
+    });
+    if (!response.ok) {
+      const body = (await response.json().catch(() => null)) as { error?: string } | null;
+      return { ok: false, error: body?.error ?? `Request failed with status ${response.status}` };
+    }
+    return { ok: true };
+  } catch {
+    return { ok: false, error: 'Network error' };
+  }
+}
+
+interface ModuleTogglesFormProps {
+  guildId: string;
+  initialStatuses: ModuleStatus[];
+}
+
+export function ModuleTogglesForm({ guildId, initialStatuses }: ModuleTogglesFormProps) {
+  const t = useTranslations();
+
+  return (
+    <SettingsForm<ModuleToggleValue>
+      initialValue={toValue(initialStatuses)}
+      onSave={(value) => saveModules(guildId, value)}
+    >
+      {({ value, setValue }) => (
+        <div className="space-y-6">
+          {MODULE_GROUP_ORDER.map((group) => {
+            const modules = DASHBOARD_MODULES.filter((module) => module.group === group);
+            return (
+              <Card key={group}>
+                <CardHeader>
+                  <CardTitle>{t(`moduleGroups.${group}`)}</CardTitle>
+                </CardHeader>
+                <CardContent className="divide-y divide-border">
+                  {modules.map((module) => (
+                    <div key={module.id} className="flex items-center justify-between gap-4 py-3 first:pt-0 last:pb-0">
+                      <div className="min-w-0 space-y-0.5">
+                        <div className="flex items-center gap-2">
+                          <p className="font-medium">{t(`modules.${module.id}.label`)}</p>
+                          <Link
+                            href={`/dashboard/${guildId}/${module.href}`}
+                            className="inline-flex items-center gap-0.5 text-xs text-muted-foreground hover:text-foreground"
+                          >
+                            {t('modulesPage.configure')}
+                            <ArrowUpRight className="size-3" />
+                          </Link>
+                        </div>
+                        <p className="truncate text-sm text-muted-foreground">
+                          {t(`modules.${module.id}.description`)}
+                        </p>
+                      </div>
+                      <Switch
+                        checked={value[module.id] ?? false}
+                        onCheckedChange={(checked) =>
+                          setValue((prev) => ({ ...prev, [module.id]: checked }))
+                        }
+                      />
+                    </div>
+                  ))}
+                </CardContent>
+              </Card>
+            );
+          })}
+        </div>
+      )}
+    </SettingsForm>
+  );
+}