✨ Add saving of status codes

src/components/Board/Items/App/Edit/NetworkTab.tsx

@@ -1,6 +1,6 @@
 import { MultiSelect, Stack, Switch, Tabs } from '@mantine/core';
 import { useTranslation } from 'next-i18next';
-import { StatusCodes } from '~/tools/acceptableStatusCodes';
+import { statusCodeData } from '~/tools/acceptableStatusCodes';
 
 import { AppForm } from '../EditAppModal';
 
@@ -10,7 +10,7 @@ interface NetworkTabProps {
 
 export const NetworkTab = ({ form }: NetworkTabProps) => {
   const { t } = useTranslation('layout/modals/add-app');
-  const acceptableStatusCodes = (form.values.statusCodes ?? [200]).map((x) => x.toString());
+  const statusCodes = (form.values.statusCodes ?? [200]).map((x) => x.toString());
   return (
     <Tabs.Panel value="network" pt="lg">
       <Stack spacing="xs">
@@ -26,10 +26,10 @@ export const NetworkTab = ({ form }: NetworkTabProps) => {
             required
             label={t('network.statusCodes.label')}
             description={t('network.statusCodes.description')}
-            data={StatusCodes}
+            data={statusCodeData}
             clearable
             searchable
-            defaultValue={acceptableStatusCodes}
+            defaultValue={statusCodes}
             variant="default"
             {...form.getInputProps('statusCodes')}
             value={form.getInputProps('statusCodes').value.map((x: number) => x.toString())}

src/server/api/routers/board.ts

@@ -14,6 +14,7 @@ import {
   layoutItems,
   layouts,
   sections,
+  statusCodes,
   widgetOptions,
   widgets,
 } from '~/server/db/schema';
@@ -322,6 +323,8 @@ export const boardRouter = createTRPCRouter({
         });
       }
 
+      const dbStatusCodes = await db.query.statusCodes.findMany();
+
       const changes = createBoardSaveDbChanges();
 
       const dbSections = layout.sections;
@@ -385,20 +388,27 @@ export const boardRouter = createTRPCRouter({
       );
 
       const updatedApps = inputApps.filter((s) => dbItemsApps.some((x) => x.id === s.id));
-      updatedApps.forEach(({ sectionId, ...app }) =>
+      updatedApps.forEach(({ sectionId, ...app }) => {
+        const dbApp = dbItemsApps.find((a) => a.id === app.id)!;
         applyUpdateAppChanges(
           changes,
           app,
-          dbItemsApps.find((a) => a.id === app.id)?.app?.statusCodes.map((x) => x.code) ?? [],
+          dbApp.app!.id,
+          dbApp.app?.statusCodes.map((x) => x.code) ?? [],
           sectionId
-        )
-      );
+        );
+      });
 
       const removedAppIds = dbItemsApps
         .filter((app) => inputApps.every((x) => x.id !== app.id))
         .map((a) => a.id);
       changes.items.delete.push(...removedAppIds);
 
+      const inputStatusCodes = new Set(inputApps.flatMap((x) => x.statusCodes));
+      const newStatusCodes = Array.from(inputStatusCodes).filter((sc) =>
+        dbStatusCodes.every((dsc) => dsc.code !== sc)
+      );
+
       const dbWidgets = await db.query.items.findMany({
         where: and(eq(items.boardId, boardWithSections.id), eq(items.kind, 'widget')),
         with: {
@@ -443,6 +453,9 @@ export const boardRouter = createTRPCRouter({
 
       await db.transaction(async (tx) => {
         // Insert
+        if (newStatusCodes.length > 0) {
+          await tx.insert(statusCodes).values(newStatusCodes.map((sc) => ({ code: sc })));
+        }
         if (changes.sections.create.length > 0) {
           await tx.insert(sections).values(changes.sections.create);
         }

src/server/api/routers/board/db/app.ts

@@ -1,8 +1,8 @@
 import { randomUUID } from 'crypto';
-import { eq, inArray } from 'drizzle-orm';
+import { inArray } from 'drizzle-orm';
 import { z } from 'zod';
-import { SchemaTransaction, db } from '~/server/db';
-import { appStatusCodes, apps, items, layoutItems } from '~/server/db/schema';
+import { db } from '~/server/db';
+import { layoutItems } from '~/server/db/schema';
 import { appSchema } from '~/validations/app';
 
 import { BoardSaveDbChanges } from '.';
@@ -57,12 +57,12 @@ export const applyCreateAppChanges = (
     openInNewTab: app.openInNewTab,
   });
 
-  /*changes.appStatusCodes.create.push(
+  changes.appStatusCodes.create.push(
     ...app.statusCodes.map((code) => ({
       appId,
       code,
     }))
-  );*/
+  );
 
   changes.layoutItems.create.push({
     id: randomUUID(),
@@ -78,6 +78,7 @@ export const applyCreateAppChanges = (
 export const applyUpdateAppChanges = async (
   changes: BoardSaveDbChanges,
   app: z.infer<typeof appSchema>,
+  dbAppId: string,
   dbStatusCodes: number[],
   sectionId: string
 ) => {
@@ -97,20 +98,20 @@ export const applyUpdateAppChanges = async (
   });
 
   // Update status codes
-  /*const newStatusCodes = app.statusCodes.filter((code) => !dbStatusCodes.includes(code));
+  const newStatusCodes = app.statusCodes.filter((code) => !dbStatusCodes.includes(code));
   changes.appStatusCodes.create.push(
     ...newStatusCodes.map((code) => ({
-      appId: app.id,
+      appId: dbAppId,
       code,
     }))
   );
   const deletedStatusCodes = dbStatusCodes.filter((code) => !app.statusCodes.includes(code));
   changes.appStatusCodes.delete.push(
     ...deletedStatusCodes.map((code) => ({
-      appId: app.id,
+      appId: dbAppId,
       code,
     }))
-  );*/
+  );
 
   changes.layoutItems.update.push({
     sectionId,

src/server/db/schema.ts

@@ -210,7 +210,6 @@ export const apps = sqliteTable('app', {
 
 export const statusCodes = sqliteTable('status_code', {
   code: int('code').notNull().primaryKey(),
-  group: text('group').$type<StatusCodeType>().notNull(),
 });
 
 export const appStatusCodes = sqliteTable(

src/tools/acceptableStatusCodes.ts

@@ -1,6 +1,6 @@
 import { SelectItem } from '@mantine/core';
 
-export const StatusCodes: SelectItem[] = [
+export const statusCodeData: SelectItem[] = [
   { value: '200', label: '200 - OK', group: 'Sucessful responses' },
   { value: '204', label: '204 - No Content', group: 'Sucessful responses' },
   { value: '301', label: '301 - Moved Permanently', group: 'Redirection responses' },