feat: add update and delete functionality for courses, events, and species; enhance attendance tracking and category creation

apps/web/app/[locale]/home/[account]/modules/[moduleId]/page.tsx

@@ -7,6 +7,7 @@ import { getSupabaseServerClient } from '@kit/supabase/server-client';
 import { Button } from '@kit/ui/button';
 
 import { decodeFilters } from './_lib/filter-params';
+import { ModuleRecordsTable } from './module-records-table';
 import { ModuleSearchBar } from './module-search-bar';
 
 interface ModuleDetailPageProps {
@@ -33,34 +34,34 @@ export default async function ModuleDetailPage({
   const pageSize =
     Number(search.pageSize) || moduleWithFields.default_page_size || 25;
 
+  const sortField =
+    (search.sort as string) ?? moduleWithFields.default_sort_field ?? undefined;
+  const sortDirection =
+    (search.dir as 'asc' | 'desc') ??
+    (moduleWithFields.default_sort_direction as 'asc' | 'desc') ??
+    'asc';
+
   const filters = decodeFilters(search.f as string | undefined);
 
   const result = await api.query.query({
     moduleId,
     page,
     pageSize,
-    sortField:
-      (search.sort as string) ??
-      moduleWithFields.default_sort_field ??
-      undefined,
-    sortDirection:
-      (search.dir as 'asc' | 'desc') ??
-      (moduleWithFields.default_sort_direction as 'asc' | 'desc') ??
-      'asc',
+    sortField,
+    sortDirection,
     search: (search.q as string) ?? undefined,
     filters,
   });
 
-  const fields = (
-    moduleWithFields as unknown as {
-      fields: Array<{
-        name: string;
-        display_name: string;
-        show_in_filter: boolean;
-        show_in_search: boolean;
-      }>;
-    }
-  ).fields;
+  const allFields = moduleWithFields.fields;
+
+  const records = (result.data ?? []).map((row: Record<string, unknown>) => ({
+    id: String(row.id ?? ''),
+    data: (row.data ?? {}) as Record<string, unknown>,
+    status: String(row.status ?? 'active'),
+    created_at: String(row.created_at ?? ''),
+    updated_at: String(row.updated_at ?? ''),
+  }));
 
   return (
     <div className="flex flex-col gap-4">
@@ -83,18 +84,18 @@ export default async function ModuleDetailPage({
         </Button>
       </div>
 
-      <ModuleSearchBar fields={fields} />
+      <ModuleSearchBar fields={allFields} />
 
-      <div className="text-muted-foreground text-sm">
-        {result.pagination.total} Datensätze — Seite {result.pagination.page}{' '}
-        von {result.pagination.totalPages}
-      </div>
-
-      <div className="rounded-lg border">
-        <pre className="max-h-96 overflow-auto p-4 text-xs">
-          {JSON.stringify(result.data, null, 2)}
-        </pre>
-      </div>
+      <ModuleRecordsTable
+        fields={allFields}
+        records={records}
+        pagination={result.pagination}
+        account={account}
+        moduleId={moduleId}
+        currentSort={
+          sortField ? { field: sortField, direction: sortDirection } : undefined
+        }
+      />
     </div>
   );
 }