@tulip-systems/create-app 0.11.1

package/dist/templates/spark/src/app/admin/products/_config/commands.tsx

@@ -0,0 +1,119 @@
+"use client";
+
+import { commandBuilder, ensureArray } from "@tulip-systems/commands";
+import {
+  ArchiveCommand,
+  CommandClick,
+  CommandLabel,
+  type CommandMutationMeta,
+  DeleteCommand,
+  RestoreCommand,
+} from "@tulip-systems/commands/client";
+import { toast } from "@tulip-systems/ui/sonner";
+import { StarIcon } from "lucide-react";
+import { Icons } from "@/components/icons";
+import { orpc } from "@/server/router/client";
+import { CreateProductCommand, CreateProductCommandTrigger } from "../_components/create-command";
+
+type ProductCommandItem = {
+  id: string;
+  isFavorite: boolean | null;
+  isDeleted: boolean | null;
+};
+
+const bulkProductCommandBuilder = commandBuilder
+  .$type<ProductCommandItem | ProductCommandItem[]>()
+  .transform(ensureArray);
+
+export const productAddToFavoritesCommand = commandBuilder
+  .$type<ProductCommandItem | ProductCommandItem[]>()
+  .transform(ensureArray)
+
+  .permission({ product: ["update"] })
+  .visibleWhen(({ data }) => data.every((item) => !item.isFavorite))
+  .render(({ data }) => (
+    <CommandClick
+      variables={{ ids: data.map((item) => item.id) }}
+      mutation={orpc.products.addToFavorites.mutationOptions({
+        onSuccess: () => toast.success("Succesvol toegevoegd aan favorieten"),
+      })}
+      label="Favorieten"
+    >
+      <StarIcon className="w-4 stroke-primary" />
+      <CommandLabel />
+    </CommandClick>
+  ));
+export const productRemoveFromFavoritesCommand = commandBuilder
+  .$type<ProductCommandItem | ProductCommandItem[]>()
+  .transform(ensureArray)
+
+  .permission({ product: ["update"] })
+  .visibleWhen(({ data }) => data.every((item) => item.isFavorite))
+  .render(({ data }) => (
+    <CommandClick
+      variables={{ ids: data.map((item) => item.id) }}
+      mutation={orpc.products.removeFromFavorites.mutationOptions({
+        onSuccess: () => toast.success("Succesvol verwijderd van favorieten"),
+      })}
+      label="Favorieten"
+    >
+      <StarIcon className="w-4 fill-primary stroke-primary" />
+      <CommandLabel />
+    </CommandClick>
+  ));
+export const productCreateCommand = commandBuilder
+
+  .permission({ product: ["create"] })
+  .render(() => (
+    <CreateProductCommand
+      variables={(values) => values}
+      mutation={orpc.products.create.mutationOptions({
+        onSuccess: (data, _vars, _result, context) => {
+          toast.success("Product succesvol toegevoegd");
+          const meta = context.meta as CommandMutationMeta;
+          if (data.id) meta.router.push(`/admin/products/${data.id}`);
+        },
+      })}
+    >
+      <CreateProductCommandTrigger label="Toevoegen" hotkey="mod+i">
+        <Icons.add className="size-4" />
+        <CommandLabel />
+      </CreateProductCommandTrigger>
+    </CreateProductCommand>
+  ));
+export const productArchiveCommand = bulkProductCommandBuilder
+  .permission({ product: ["archive"] })
+  .visibleWhen(({ data }) => data.every((item) => !item.isDeleted))
+  .render(({ data }) => (
+    <ArchiveCommand
+      variables={{ ids: data.map((item) => item.id) }}
+      mutation={orpc.products.archive.mutationOptions({
+        onSuccess: () => toast.success("Succesvol gearchiveerd"),
+      })}
+    />
+  ));
+export const productRestoreCommand = bulkProductCommandBuilder
+  .permission({ product: ["archive"] })
+  .visibleWhen(({ data }) => data.every((item) => item.isDeleted))
+  .render(({ data }) => (
+    <RestoreCommand
+      variables={{ ids: data.map((item) => item.id) }}
+      mutation={orpc.products.restore.mutationOptions({
+        onSuccess: () => toast.success("Succesvol hersteld"),
+      })}
+    />
+  ));
+export const productDeleteCommand = bulkProductCommandBuilder
+  .permission({ product: ["delete"] })
+  .render(({ data }) => (
+    <DeleteCommand
+      variables={{ ids: data.map((item) => item.id) }}
+      mutation={orpc.products.delete.mutationOptions({
+        onSuccess: (_data, _vars, _result, context) => {
+          toast.success("Succesvol verwijderd");
+          const meta = context.meta as CommandMutationMeta;
+          meta.router.push("/admin/products");
+        },
+      })}
+    />
+  ));

package/dist/templates/spark/src/app/admin/products/_config/filters.ts

@@ -0,0 +1,75 @@
+import {
+  arrayFilter,
+  booleanFilter,
+  createFilteringParser,
+  customFilter,
+  defineFilters,
+  resolveFiltersSchema,
+  stringFilter,
+} from "@tulip-systems/query";
+import { createDatabaseFiltersCompiler } from "@tulip-systems/query/drizzle";
+import { createParser } from "nuqs/server";
+import z from "zod";
+
+export const productsFilters = defineFilters({
+  search: stringFilter.build((value) =>
+    value
+      ? {
+          or: [
+            { field: "name", operator: "ilike", value: `%${value}%` },
+            { field: "articleNumber", operator: "ilike", value: `%${value}%` },
+            { field: "brand", operator: "ilike", value: `%${value}%` },
+          ],
+        }
+      : null,
+  ),
+  categoryId: arrayFilter(stringFilter).build((value) =>
+    value?.length ? { field: "categoryId", operator: "in", value } : null,
+  ),
+  brand: arrayFilter(stringFilter).build((value) =>
+    value?.length ? { field: "brand", operator: "in", value } : null,
+  ),
+  sellPrice: customFilter(
+    (value) =>
+      value
+        ? {
+            and: [
+              { field: "sellPrice", operator: "gte", value: value[0] },
+              { field: "sellPrice", operator: "lte", value: value[1] },
+            ],
+          }
+        : null,
+    {
+      param: createParser({
+        parse: (encoded) => {
+          const [min, max] = encoded.split("_").map(Number);
+          return Number.isFinite(min) && Number.isFinite(max)
+            ? ([min, max] as [number, number])
+            : null;
+        },
+        serialize: ([min, max]) => `${min}_${max}`,
+      }),
+      schema: z.tuple([z.number(), z.number()]),
+    },
+  ),
+  isFavorite: booleanFilter.build((value) =>
+    value == null ? null : { field: "isFavorite", operator: "eq", value },
+  ),
+  isDeleted: booleanFilter.build((value) => ({
+    field: "isDeleted",
+    operator: "eq",
+    value: value ?? false,
+  })),
+});
+
+/**
+ * Validators
+ */
+export const productFilterSchema = resolveFiltersSchema(productsFilters);
+export type ProductFilterSchema = z.input<typeof productFilterSchema>;
+
+/**
+ * Parser and compilers
+ */
+export const productFiltersParser = createFilteringParser(productsFilters);
+export const productDatabaseFiltersCompiler = createDatabaseFiltersCompiler(productsFilters);

package/dist/templates/spark/src/app/admin/products/_config/sorting.ts

@@ -0,0 +1,32 @@
+import {
+  createSortingParser,
+  defineSorting,
+  resolveSortingSchema,
+  sortOption,
+} from "@tulip-systems/query";
+import { createDatabaseSortingCompiler } from "@tulip-systems/query/drizzle";
+import { createLocalSortingCompiler } from "@tulip-systems/query/tanstack-db";
+
+export const productTableSorts = defineSorting({
+  articleNumber: sortOption((direction) => ({ field: "articleNumber", direction })),
+  name: sortOption((direction) => ({ field: "name", direction })),
+  buyPrice: sortOption((direction) => ({ field: "buyPrice", direction })),
+  sellPrice: sortOption((direction) => ({ field: "sellPrice", direction })),
+  brand: sortOption((direction) => ({ field: "brand", direction })),
+  createdAt: sortOption((direction) => ({ field: "createdAt", direction })),
+});
+
+/**
+ * Validators
+ */
+export const productTableSortsSchema = resolveSortingSchema(productTableSorts);
+
+/**
+ * Parsers
+ */
+export const productTableSortsParser = createSortingParser(productTableSorts, {
+  fallback: [{ key: "createdAt", direction: "desc" }],
+});
+
+export const productTableLocalSortsCompiler = createLocalSortingCompiler(productTableSorts);
+export const productTableDatabaseSortsCompiler = createDatabaseSortingCompiler(productTableSorts);

package/dist/templates/spark/src/app/admin/products/_lib/helpers.server.ts

@@ -0,0 +1,42 @@
+import "server-cli-only";
+
+import { eq } from "drizzle-orm";
+import type { NodePgDatabase } from "drizzle-orm/node-postgres";
+import { DRIVE_NAMESPACES } from "@/app/admin/drive/_config/namespaces";
+import type { DatabaseSchema } from "@/server/db/types";
+import { drive } from "../../drive/_lib/service.server";
+import { products } from "./schema";
+import type { Product } from "./validators";
+
+/**
+ * Create product folder if not exists
+ */
+export async function ensureProductDriveFolder(
+  context: { db: NodePgDatabase<DatabaseSchema> },
+  product: Pick<Product, "id" | "name" | "nodeId">,
+) {
+  /**
+   * Product already has a folder
+   */
+  if (product.nodeId) return product.nodeId;
+
+  /**
+   * Ensure product folder exists
+   */
+  const folder = await drive.createFolder({
+    namespace: DRIVE_NAMESPACES.products.namespace,
+    name: product.name,
+    parentId: null,
+    readonly: true,
+  });
+
+  /**
+   * Update product
+   */
+  await context.db.update(products).set({ nodeId: folder.id }).where(eq(products.id, product.id));
+
+  /**
+   * Return folder ID
+   */
+  return folder.id;
+}

package/dist/templates/spark/src/app/admin/products/_lib/helpers.ts

@@ -0,0 +1,8 @@
+/**
+ * Calculate the sell price of a product
+ * @param buyPrice number
+ * @returns {number}
+ */
+export function calculateSellPrice(buyPrice: number): number {
+  return buyPrice * 1.35;
+}

package/dist/templates/spark/src/app/admin/products/_lib/queries.ts

@@ -0,0 +1,38 @@
+// import { protectedProcedure } from "@/lib/router/init";
+// import { asc, eq } from "drizzle-orm";
+// import "server-cli-only";
+// import { z } from "zod";
+// import { categories, productImages, products } from "./schema";
+
+// /**
+//  * Get categories
+//  */
+// export const getCategories = protectedProcedure.query(async ({ ctx }) =>
+//   ctx.db.query.categories.findMany({ orderBy: [asc(categories.name)] }),
+// );
+
+// export type GetCategoriesReturn = Awaited<ReturnType<typeof getCategories>>;
+
+// /**
+//  * Get product by id
+//  */
+// export const getProductById = protectedProcedure
+//   .input(z.object({ id: z.string() }))
+//   .query(async ({ ctx, input: { id } }) =>
+//     ctx.db.query.products.findFirst({ where: eq(products.id, id), with: { category: true } }),
+//   );
+
+// /**
+//  * Get product images
+//  */
+// export const getProductImages = protectedProcedure
+//   .input(z.object({ productId: z.string() }))
+//   .query(async ({ ctx, input }) =>
+//     ctx.db.query.productImages.findMany({
+//       where: eq(productImages.productId, input.productId),
+//       with: { asset: true },
+//       orderBy: [asc(productImages.index)],
+//     }),
+//   );
+
+// export type GetProductImagesReturn = Awaited<ReturnType<typeof getProductImages>>;

package/dist/templates/spark/src/app/admin/products/_lib/router.ts

@@ -0,0 +1,367 @@
+import "server-cli-only";
+
+import { ORPCError } from "@orpc/server";
+import { arrayMove } from "@tulip-systems/core";
+import type { LocalDriveNode } from "@tulip-systems/drive-local";
+import {
+  bulkActionSchema,
+  offsetPaginationResponse,
+  offsetPaginationSchema,
+} from "@tulip-systems/query";
+import { and, asc, count, desc, eq, gte, inArray, isNotNull, sql } from "drizzle-orm";
+import { after } from "next/server";
+import z from "zod";
+import { DRIVE_NAMESPACES } from "@/app/admin/drive/_config/namespaces";
+import { getTableData } from "@/lib/helpers/table-data.server";
+import { nodes } from "@/server/drive-local/schema";
+import { protectedProcedure } from "@/server/router/procedures";
+import { storage } from "@/server/storage/init";
+import { drive } from "../../drive/_lib/service.server";
+import type { ProductTableData } from "../_components/tables";
+import {
+  productDatabaseFiltersCompiler,
+  productFilterSchema,
+  productFiltersParser,
+} from "../_config/filters";
+import {
+  productTableDatabaseSortsCompiler,
+  productTableSortsParser,
+  productTableSortsSchema,
+} from "../_config/sorting";
+import { ensureProductDriveFolder } from "./helpers.server";
+import { categories, productImages, products } from "./schema";
+import { createProductSchema, updateProductSchema } from "./validators";
+
+type ProductDocumentFolder = Pick<LocalDriveNode, "id" | "name"> & {
+  children: LocalDriveNode[];
+};
+
+/**
+ * Products router
+ */
+export const productsRouter = {
+  list: protectedProcedure
+    .input(
+      z.object({
+        pagination: offsetPaginationSchema,
+        filters: productFilterSchema,
+        sorts: productTableSortsSchema,
+      }),
+    )
+    .handler(async ({ context, input }) => {
+      const parsedSorts = productTableSortsParser.parse(input.sorts);
+      const orderBy = productTableDatabaseSortsCompiler(products).parse(parsedSorts);
+
+      const parsedFilters = productFiltersParser.parse(input.filters);
+      const where = productDatabaseFiltersCompiler(products).parse(parsedFilters);
+
+      const { data, total } = await getTableData(context, products, {
+        pagination: input.pagination,
+        where,
+        with: { category: true, images: true },
+        orderBy,
+      });
+
+      return offsetPaginationResponse<ProductTableData>({
+        data: data as ProductTableData[],
+        pagination: input.pagination,
+        total,
+      });
+    }),
+  filterCategories: protectedProcedure
+    .input(z.object({ filters: productFilterSchema }))
+    .handler(async ({ context, input: { filters } }) => {
+      const parser = productFiltersParser.omit({ categoryId: true, sellPrice: true });
+      const parsedFilters = parser.parse(filters);
+      const where = productDatabaseFiltersCompiler(products).parse(parsedFilters);
+
+      return context.db
+        .select({
+          value: categories.id,
+          label: categories.name,
+          total: count(products.id),
+        })
+        .from(categories)
+        .leftJoin(products, and(eq(categories.id, products.categoryId), where))
+        .groupBy(categories.id)
+        .having(gte(sql<number>`count(${products.id})`, 1))
+        .orderBy(categories.name);
+    }),
+  filterBrands: protectedProcedure
+    .input(z.object({ filters: productFilterSchema }))
+    .handler(async ({ context, input: { filters } }) => {
+      const parser = productFiltersParser.omit({ brand: true, sellPrice: true });
+      const parsedFilters = parser.parse(filters);
+      const where = productDatabaseFiltersCompiler(products).parse(parsedFilters);
+
+      return context.db
+        .select({
+          value: products.brand,
+          label: products.brand,
+          total: count(products.id),
+        })
+        .from(products)
+        .where(and(isNotNull(products.brand), where))
+        .groupBy(products.brand)
+        .having(gte(sql<number>`count(${products.id})`, 1))
+        .orderBy(products.brand);
+    }),
+  filterSellPrices: protectedProcedure
+    .input(z.object({ filters: productFilterSchema }))
+    .handler(async ({ context, input: { filters } }) => {
+      const parser = productFiltersParser.omit({ sellPrice: true });
+      const parsedFilters = parser.parse(filters);
+      const where = productDatabaseFiltersCompiler(products).parse(parsedFilters);
+
+      const [result] = await context.db
+        .select({
+          min: sql<number>`min(${products.sellPrice})`,
+          max: sql<number>`max(${products.sellPrice})`,
+        })
+        .from(products)
+        .where(and(isNotNull(products.sellPrice), where));
+
+      return result;
+    }),
+  getCategories: protectedProcedure.handler(async ({ context }) =>
+    context.db.query.categories.findMany({ orderBy: [asc(categories.name)] }),
+  ),
+  getAll: protectedProcedure.handler(async ({ context }) =>
+    context.db.query.products.findMany({
+      where: eq(products.isDeleted, false),
+      orderBy: [asc(products.name)],
+      with: { category: true },
+    }),
+  ),
+  getById: protectedProcedure
+    .input(z.object({ id: z.string() }))
+    .handler(async ({ context, input: { id } }) => {
+      const result = await context.db.query.products.findFirst({
+        where: eq(products.id, id),
+        with: { category: true },
+      });
+
+      return result ?? null;
+    }),
+  getDrive: protectedProcedure
+    .input(z.object({ id: z.string() }))
+    .handler(async ({ context, input }) => {
+      const [product] = await context.db.select().from(products).where(eq(products.id, input.id));
+      if (!product) {
+        throw new ORPCError("BAD_REQUEST", {
+          message: "Product kon niet worden aangemaakt",
+        });
+      }
+
+      const folderId = await ensureProductDriveFolder(context, product);
+      const [folder] = await context.db.select().from(nodes).where(eq(nodes.id, folderId));
+
+      if (!folder) {
+        throw new ORPCError("INTERNAL_SERVER_ERROR", {
+          message: "Folder kon niet worden gevonden",
+        });
+      }
+
+      return folder;
+    }),
+  getDocuments: protectedProcedure
+    .input(z.object({ productId: z.string() }))
+    .handler(async ({ context, input }) => {
+      const [product] = await context.db
+        .select()
+        .from(products)
+        .where(eq(products.id, input.productId));
+      if (!product) {
+        throw new ORPCError("BAD_REQUEST", {
+          message: "Product kon niet worden gevonden",
+        });
+      }
+
+      if (!product.nodeId) return [];
+
+      const folders = await drive.getNodesByParentId({
+        filters: {
+          namespace: DRIVE_NAMESPACES.products.namespace,
+          parentId: product.nodeId,
+          types: ["folder"],
+          isArchived: false,
+          hidden: false,
+        },
+      });
+
+      const documentFolders: Array<Pick<LocalDriveNode, "id" | "name">> = [
+        ...folders,
+        {
+          id: product.nodeId,
+          name: "Algemeen",
+        },
+      ];
+
+      const documentNodes: ProductDocumentFolder[] = await Promise.all(
+        documentFolders.map(async (folder): Promise<ProductDocumentFolder> => {
+          const children = await drive.getNodesByParentId({
+            filters: {
+              namespace: DRIVE_NAMESPACES.products.namespace,
+              parentId: folder.id,
+              types: ["file"],
+              isArchived: false,
+              hidden: false,
+            },
+          });
+
+          return {
+            id: folder.id,
+            name: folder.name,
+            children,
+          };
+        }),
+      );
+
+      return documentNodes.filter((node) => node.children.length > 0);
+    }),
+  create: protectedProcedure.input(createProductSchema).handler(async ({ context, input }) => {
+    const [result] = await context.db.insert(products).values(input).returning();
+
+    if (!result) {
+      throw new ORPCError("INTERNAL_SERVER_ERROR", {
+        message: "Product kon niet worden aangemaakt",
+      });
+    }
+
+    after(async () => {
+      const folderId = await ensureProductDriveFolder(context, result);
+
+      /**
+       * Create default folders
+       */
+      await drive.createFolder({
+        name: "Technische datasheets",
+        namespace: DRIVE_NAMESPACES.products.namespace,
+        parentId: folderId,
+      });
+
+      await drive.createFolder({
+        name: "Technische handleiding",
+        namespace: DRIVE_NAMESPACES.products.namespace,
+        parentId: folderId,
+      });
+
+      await drive.createFolder({
+        name: "EU-conformiteitsverklaring",
+        namespace: DRIVE_NAMESPACES.products.namespace,
+        parentId: folderId,
+      });
+    });
+
+    return result;
+  }),
+  update: protectedProcedure
+    .input(z.object({ id: z.string(), data: updateProductSchema.partial() }))
+    .output(z.void())
+    .handler(async ({ context, input }) => {
+      await context.db
+        .update(products)
+        .set(input.data)
+        .where(eq(products.id, input.id))
+        .returning();
+    }),
+  addToFavorites: protectedProcedure
+    .input(bulkActionSchema)
+    .handler(async ({ context, input: { ids } }) => {
+      await context.db.update(products).set({ isFavorite: true }).where(inArray(products.id, ids));
+    }),
+  removeFromFavorites: protectedProcedure
+    .input(bulkActionSchema)
+    .handler(async ({ context, input: { ids } }) => {
+      await context.db.update(products).set({ isFavorite: false }).where(inArray(products.id, ids));
+    }),
+  archive: protectedProcedure
+    .input(bulkActionSchema)
+    .handler(async ({ context, input: { ids } }) => {
+      await context.db.update(products).set({ isDeleted: true }).where(inArray(products.id, ids));
+    }),
+  restore: protectedProcedure
+    .input(bulkActionSchema)
+    .handler(async ({ context, input: { ids } }) => {
+      await context.db.update(products).set({ isDeleted: false }).where(inArray(products.id, ids));
+    }),
+  delete: protectedProcedure
+    .input(bulkActionSchema)
+    .handler(async ({ context, input: { ids } }) => {
+      await context.db.delete(products).where(inArray(products.id, ids));
+    }),
+};
+
+/**
+ * Product images router
+ */
+export const productImagesRouter = {
+  getAll: protectedProcedure
+    .input(z.object({ productId: z.string() }))
+    .handler(async ({ context, input }) => {
+      const images = await context.db.query.productImages.findMany({
+        where: eq(productImages.productId, input.productId),
+        orderBy: [asc(productImages.index)],
+        with: { asset: true },
+      });
+
+      return images.map(({ asset }) => asset);
+    }),
+  create: protectedProcedure
+    .input(z.object({ productId: z.string(), assetId: z.string() }))
+    .handler(async ({ context, input }) => {
+      const [lastImage] = await context.db
+        .select({ index: productImages.index })
+        .from(productImages)
+        .limit(1)
+        .where(eq(productImages.productId, input.productId))
+        .orderBy(desc(productImages.index));
+
+      const newIndex = (lastImage?.index ?? -1) + 1;
+
+      const [result] = await context.db
+        .insert(productImages)
+        .values({
+          productId: input.productId,
+          assetId: input.assetId,
+          index: newIndex,
+        })
+        .returning();
+
+      if (!result) {
+        throw new ORPCError("INTERNAL_SERVER_ERROR", {
+          message: "Product kon niet worden aangemaakt",
+        });
+      }
+
+      return result;
+    }),
+  move: protectedProcedure
+    .input(z.object({ productId: z.string(), fromIndex: z.number(), toIndex: z.number() }))
+    .handler(async ({ context, input }) => {
+      /**
+       * Get all items
+       */
+      const items = await context.db
+        .select({ id: productImages.id })
+        .from(productImages)
+        .where(eq(productImages.productId, input.productId))
+        .orderBy(asc(productImages.index));
+
+      const newItems = arrayMove(items, input);
+
+      /**
+       * Update the index of the items by splicing the item to the new index.
+       */
+      await context.db.transaction(async (tx) =>
+        Promise.allSettled(
+          newItems.map((item, index) =>
+            tx.update(productImages).set({ index }).where(eq(productImages.id, item.id)),
+          ),
+        ),
+      );
+    }),
+  delete: protectedProcedure.input(bulkActionSchema).handler(async ({ input: { ids } }) => {
+    await storage.deleteAssets(ids);
+  }),
+};