feat: add board (#15)

* wip: Add gridstack board
* wip: Centralize board pages, Add board settings page
* fix: remove cyclic dependency and rename widget-sort to kind
* improve: Add header actions as parallel route
* feat: add item select modal, add category edit modal,
* feat: add edit item modal
* feat: add remove item modal
* wip: add category actions
* feat: add saving of board, wip: add app widget
* Merge branch 'main' into add-board
* chore: update turbo dependencies
* chore: update mantine dependencies
* chore: fix typescript errors, lint and format
* feat: add confirm modal to category removal, move items of removed category to above wrapper
* feat: remove app widget to continue in another branch
* feat: add loading spinner until board is initialized
* fix: issue with cellheight of gridstack items
* feat: add translations for board
* fix: issue with translation for settings page
* chore: address pull request feedback

packages/validation/src/board.ts

@@ -0,0 +1,43 @@
+import { z } from "zod";
+
+import { commonItemSchema, createSectionSchema } from "./shared";
+
+const boardNameSchema = z
+  .string()
+  .min(1)
+  .max(255)
+  .regex(/^[A-Za-z0-9-\\._]+$/);
+
+const byNameSchema = z.object({
+  name: boardNameSchema,
+});
+
+const saveGeneralSettingsSchema = z.object({
+  pageTitle: z
+    .string()
+    .nullable()
+    .transform((value) => (value?.trim().length === 0 ? null : value)),
+  metaTitle: z
+    .string()
+    .nullable()
+    .transform((value) => (value?.trim().length === 0 ? null : value)),
+  logoImageUrl: z
+    .string()
+    .nullable()
+    .transform((value) => (value?.trim().length === 0 ? null : value)),
+  faviconImageUrl: z
+    .string()
+    .nullable()
+    .transform((value) => (value?.trim().length === 0 ? null : value)),
+});
+
+const saveSchema = z.object({
+  name: boardNameSchema,
+  sections: z.array(createSectionSchema(commonItemSchema)),
+});
+
+export const boardSchemas = {
+  byName: byNameSchema,
+  saveGeneralSettings: saveGeneralSettingsSchema,
+  save: saveSchema,
+};

packages/validation/src/enums.ts

@@ -1,4 +1,11 @@
 import { z } from "zod";
 
-export const zodEnumFromArray = <T extends string>(arr: T[]) =>
-  z.enum([arr[0]!, ...arr.slice(1)]);
+type CouldBeReadonlyArray<T> = T[] | readonly T[];
+
+export const zodEnumFromArray = <T extends string>(
+  array: CouldBeReadonlyArray<T>,
+) => z.enum([array[0]!, ...array.slice(1)]);
+
+export const zodUnionFromArray = <T extends z.ZodTypeAny>(
+  array: CouldBeReadonlyArray<T>,
+) => z.union([array[0]!, array[1]!, ...array.slice(2)]);

packages/validation/src/index.ts

@@ -1,7 +1,11 @@
+import { boardSchemas } from "./board";
 import { integrationSchemas } from "./integration";
 import { userSchemas } from "./user";
 
 export const validation = {
   user: userSchemas,
   integration: integrationSchemas,
+  board: boardSchemas,
 };
+
+export { createSectionSchema, sharedItemSchema } from "./shared";

packages/validation/src/shared.ts

@@ -0,0 +1,68 @@
+import { z } from "zod";
+
+import { integrationKinds, widgetKinds } from "@homarr/definitions";
+
+import { zodEnumFromArray } from "./enums";
+
+export const integrationSchema = z.object({
+  id: z.string(),
+  kind: zodEnumFromArray(integrationKinds),
+  name: z.string(),
+  url: z.string(),
+});
+
+export const sharedItemSchema = z.object({
+  id: z.string(),
+  xOffset: z.number(),
+  yOffset: z.number(),
+  height: z.number(),
+  width: z.number(),
+  integrations: z.array(integrationSchema),
+});
+
+export const commonItemSchema = z
+  .object({
+    kind: zodEnumFromArray(widgetKinds),
+    options: z.record(z.unknown()),
+  })
+  .and(sharedItemSchema);
+
+const createCategorySchema = <TItemSchema extends z.ZodTypeAny>(
+  itemSchema: TItemSchema,
+) =>
+  z.object({
+    id: z.string(),
+    name: z.string(),
+    kind: z.literal("category"),
+    position: z.number(),
+    items: z.array(itemSchema),
+  });
+
+const createEmptySchema = <TItemSchema extends z.ZodTypeAny>(
+  itemSchema: TItemSchema,
+) =>
+  z.object({
+    id: z.string(),
+    kind: z.literal("empty"),
+    position: z.number(),
+    items: z.array(itemSchema),
+  });
+
+const createSidebarSchema = <TItemSchema extends z.ZodTypeAny>(
+  itemSchema: TItemSchema,
+) =>
+  z.object({
+    id: z.string(),
+    kind: z.literal("sidebar"),
+    position: z.union([z.literal(0), z.literal(1)]),
+    items: z.array(itemSchema),
+  });
+
+export const createSectionSchema = <TItemSchema extends z.ZodTypeAny>(
+  itemSchema: TItemSchema,
+) =>
+  z.union([
+    createCategorySchema(itemSchema),
+    createEmptySchema(itemSchema),
+    createSidebarSchema(itemSchema),
+  ]);