@tulip-systems/create-app 0.11.1

package/dist/templates/code/src/app/admin/projects/_config/commands.tsx

@@ -0,0 +1,121 @@
+"use client";
+
+import { commandBuilder, ensureArray } from "@tulip-systems/commands";
+import {
+  ArchiveCommand,
+  CommandDropdown,
+  CommandDropdownContent,
+  CommandDropdownItem,
+  CommandDropdownTrigger,
+  CommandLabel,
+  type CommandMutationMeta,
+  DeleteCommand,
+  RestoreCommand,
+} from "@tulip-systems/commands/client";
+import { toast } from "@tulip-systems/ui/sonner";
+import { Icons } from "@/components/icons";
+import { orpc } from "@/server/router/client";
+import { CreateProjectCommand, CreateProjectCommandTrigger } from "../_components/create-command";
+import type { CreateProjectSchema } from "../_lib/validators";
+import { ProjectStatusField, projectStatusConfig } from "./status";
+
+type ProjectBulkCommandData = {
+  id: string;
+  deletedAt?: Date | null;
+};
+
+const bulkProjectCommandBuilder = commandBuilder
+  .$type<ProjectBulkCommandData | ProjectBulkCommandData[]>()
+  .transform(ensureArray);
+
+/**
+ *
+ *
+ * Project commands
+ */
+export const projectCreateCommand = commandBuilder
+  .$type<Partial<CreateProjectSchema>>()
+  .permission({ project: ["create"] })
+  .render(() => (
+    <CreateProjectCommand
+      variables={(values) => values}
+      mutation={orpc.projects.create.mutationOptions({
+        onSuccess: (data, _vars, _result, context) => {
+          toast.success("Project succesvol toegevoegd");
+          const meta = context.meta as CommandMutationMeta;
+          if (data.id) meta.router.push(`/admin/projects/${data.id}`);
+        },
+      })}
+    >
+      <CreateProjectCommandTrigger label="Toevoegen" hotkey="mod+i">
+        <Icons.add className="size-4" />
+        <CommandLabel />
+      </CreateProjectCommandTrigger>
+    </CreateProjectCommand>
+  ));
+
+export const projectUpdateStatusCommand = bulkProjectCommandBuilder
+  .permission({ project: ["update"] })
+  .render(({ data }) => (
+    <CommandDropdown>
+      <CommandDropdownTrigger label="Status">
+        <Icons.edit className="w-4" />
+        <CommandLabel />
+      </CommandDropdownTrigger>
+
+      <CommandDropdownContent>
+        {projectStatusConfig.flatMap((status) => (
+          <CommandDropdownItem
+            key={status.value}
+            variables={{ ids: data.map((item) => item.id), status: status.value }}
+            mutation={orpc.projects.setStatus.mutationOptions({
+              onSuccess: () =>
+                toast.success(`Status is gewijzigd naar ${status.label.toLowerCase()}`),
+            })}
+          >
+            <ProjectStatusField status={status.value} />
+          </CommandDropdownItem>
+        ))}
+      </CommandDropdownContent>
+    </CommandDropdown>
+  ));
+
+export const projectRestoreCommand = bulkProjectCommandBuilder
+  .permission({ project: ["archive"] })
+  .visibleWhen(({ data }) => data.every((item) => item.deletedAt !== null))
+  .render(({ data }) => (
+    <RestoreCommand
+      variables={{ ids: data.map((item) => item.id) }}
+      mutation={orpc.projects.restore.mutationOptions({
+        onSuccess: () => toast.success("Succesvol hersteld"),
+      })}
+    />
+  ));
+
+export const projectArchiveCommand = bulkProjectCommandBuilder
+  .permission({ project: ["archive"] })
+  .visibleWhen(({ data }) => data.every((item) => item.deletedAt === null))
+  .render(({ data }) => (
+    <ArchiveCommand
+      variables={{ ids: data.map((item) => item.id) }}
+      mutation={orpc.projects.archive.mutationOptions({
+        onSuccess: () => toast.success("Succesvol gearchiveerd"),
+      })}
+    />
+  ));
+
+export const projectDeleteCommand = bulkProjectCommandBuilder
+  .permission({ project: ["delete"] })
+  .visibleWhen(({ data }) => data.every((item) => item.deletedAt === null))
+  .render(({ data }) => (
+    <DeleteCommand
+      variables={{ ids: data.map((item) => item.id) }}
+      mutation={orpc.projects.delete.mutationOptions({
+        onSuccess: (_data, _vars, _result, context) => {
+          toast.success("Succesvol verwijderd");
+          const meta = context.meta as CommandMutationMeta;
+          meta.router.push("/admin/projects");
+        },
+      })}
+    />
+  ));

package/dist/templates/code/src/app/admin/projects/_config/filters.ts

@@ -0,0 +1,64 @@
+import {
+  arrayFilter,
+  booleanFilter,
+  createFilteringParser,
+  defineFilters,
+  enumFilter,
+  resolveFiltersSchema,
+  stringFilter,
+} from "@tulip-systems/query";
+import { createDatabaseFiltersCompiler } from "@tulip-systems/query/drizzle";
+import { createLocalFiltersCompiler } from "@tulip-systems/query/tanstack-db";
+import type z from "zod";
+import { projectEnum } from "../_lib/schema";
+
+/**
+ * Filters
+ */
+export const projectsFilters = defineFilters({
+  search: stringFilter.build((value) => {
+    if (!value) return null;
+
+    return {
+      or: [
+        { field: "title", operator: "ilike", value: `%${value}%` },
+        { field: "customerName", operator: "ilike", value: `%${value}%` },
+      ],
+    };
+  }),
+  customerId: arrayFilter(stringFilter).build((value) => {
+    if (!value?.length) return null;
+
+    return {
+      field: "customerId",
+      operator: "in",
+      value,
+    };
+  }),
+  status: arrayFilter(enumFilter(projectEnum.enumValues)).build((value) => {
+    if (!value?.length) return null;
+
+    return {
+      field: "status",
+      operator: "in",
+      value,
+    };
+  }),
+  isDeleted: booleanFilter.build((value) => ({
+    field: "deletedAt",
+    operator: value ? "isNotNull" : "isNull",
+  })),
+});
+
+/**
+ * Schema
+ */
+export const projectFiltersSchema = resolveFiltersSchema(projectsFilters);
+export type ProjectFilters = z.input<typeof projectFiltersSchema>;
+
+/**
+ * Parsers
+ */
+export const projectFiltersParser = createFilteringParser(projectsFilters);
+export const projectDatabaseFiltersCompiler = createDatabaseFiltersCompiler(projectsFilters);
+export const projectLocalFiltersCompiler = createLocalFiltersCompiler(projectsFilters);

package/dist/templates/code/src/app/admin/projects/_config/sorting.ts

@@ -0,0 +1,31 @@
+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 projectTableSorts = defineSorting({
+  title: sortOption((direction) => ({ field: "title", direction })),
+  status: sortOption((direction) => ({ field: "status", direction })),
+});
+
+/**
+ * Validators
+ */
+export const projectTableSortsSchema = resolveSortingSchema(projectTableSorts);
+
+/**
+ * Parsers
+ */
+export const projectTableSortsParser = createSortingParser(projectTableSorts, {
+  fallback: [
+    { key: "status", direction: "asc" },
+    { key: "title", direction: "asc" },
+  ],
+});
+
+export const projectTableLocalSortsCompiler = createLocalSortingCompiler(projectTableSorts);
+export const projectTableDatabaseSortsCompiler = createDatabaseSortingCompiler(projectTableSorts);

package/dist/templates/code/src/app/admin/projects/_config/status.tsx

@@ -0,0 +1,85 @@
+import {
+  type CreateStatusComponentProps,
+  createStatusConfig,
+  createStatusVariants,
+  StatusBadge,
+  StatusField,
+} from "@tulip-systems/ui/status";
+import { cva } from "class-variance-authority";
+import {
+  CheckCircle2Icon,
+  CircleDashedIcon,
+  CircleDotIcon,
+  CircleIcon,
+  CircleXIcon,
+} from "lucide-react";
+import type { ProjectStatus } from "../_lib/validators";
+
+/**
+ * Project statuses
+ */
+export const projectStatusConfig = createStatusConfig<ProjectStatus>([
+  {
+    value: "backlog",
+    label: "Backlog",
+    icon: CircleDashedIcon,
+    className: "stroke-foreground/50 text-foreground/50",
+  },
+  {
+    value: "planned",
+    label: "Planned",
+    icon: CircleIcon,
+    className: "stroke-foreground text-foreground",
+  },
+  {
+    value: "active",
+    label: "Active",
+    icon: CircleDotIcon,
+    className: "stroke-yellow-500 text-yellow-500",
+  },
+  {
+    value: "completed",
+    label: "Completed",
+    icon: CheckCircle2Icon,
+    className: "stroke-blue-500 text-blue-500",
+  },
+  {
+    value: "canceled",
+    label: "Canceled",
+    icon: CircleXIcon,
+    className: "stroke-foreground/50 text-foreground/50",
+  },
+]);
+
+/**
+ * Project status variants
+ */
+export const projectStatusVariants = cva("", {
+  variants: { status: createStatusVariants(projectStatusConfig) },
+});
+
+/**
+ * Project status column
+ */
+export function ProjectStatusField(props: CreateStatusComponentProps<ProjectStatus>) {
+  return (
+    <StatusField
+      config={projectStatusConfig}
+      variants={projectStatusVariants}
+      status={props.status}
+    />
+  );
+}
+
+/**
+ * Project status badge
+ */
+export function ProjectStatusBadge(props: CreateStatusComponentProps<ProjectStatus>) {
+  return (
+    <StatusBadge
+      config={projectStatusConfig}
+      variants={projectStatusVariants}
+      status={props.status}
+    />
+  );
+}

package/dist/templates/code/src/app/admin/projects/_lib/helpers.server.ts

@@ -0,0 +1,65 @@
+import "server-cli-only";
+
+import { ORPCError } from "@orpc/server";
+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 { projects } from "./schema";
+import type { Project } from "./validators";
+
+/**
+ * Create project drive folder
+ */
+export async function ensureProjectDriveFolder(
+  context: { db: NodePgDatabase<DatabaseSchema> },
+  projectId: Project["id"],
+) {
+  const project = await context.db.query.projects.findFirst({
+    where: eq(projects.id, projectId),
+  });
+  if (!project) {
+    throw new ORPCError("NOT_FOUND", {
+      message: "Project kon niet worden gevonden",
+    });
+  }
+  /**
+   * Set folder IDs
+   */
+  let folderId = project.nodeId;
+
+  /**
+   * Ensure project folder exists
+   */
+  if (!folderId) {
+    const { googleDrive } = await import("../../drive/_lib/service.server");
+    const folder = await googleDrive.createFolder({
+      namespace: DRIVE_NAMESPACES.projects.namespace,
+      name: project.title,
+      parentId: null,
+    });
+    if (!folder.id) {
+      throw new ORPCError("INTERNAL_SERVER_ERROR", {
+        message: "Project map kon niet worden aangemaakt",
+      });
+    }
+
+    /**
+     * Update project
+     */
+    await context.db.update(projects).set({ nodeId: folder.id }).where(eq(projects.id, project.id));
+
+    folderId = folder.id;
+  }
+
+  /**
+   * Return folder ID
+   */
+  if (!folderId) {
+    throw new ORPCError("INTERNAL_SERVER_ERROR", {
+      message: "Project map kon niet worden gevonden",
+    });
+  }
+
+  return folderId;
+}

package/dist/templates/code/src/app/admin/projects/_lib/router.ts

@@ -0,0 +1,279 @@
+import "server-cli-only";
+
+import { ORPCError } from "@orpc/server";
+import {
+  bulkActionSchema,
+  offsetPaginationResponse,
+  offsetPaginationSchema,
+} from "@tulip-systems/query";
+import { compareDesc } from "date-fns";
+import {
+  and,
+  count,
+  desc,
+  eq,
+  exists,
+  gte,
+  ilike,
+  inArray,
+  isNotNull,
+  isNull,
+  lt,
+  or,
+  sql,
+} from "drizzle-orm";
+import z from "zod";
+import { getTableData } from "@/app/lib/utils/table-data.server";
+import { customers, initiatives } from "@/server/db/schema";
+import { permissionMiddleware } from "@/server/router/middleware";
+import { protectedProcedure } from "@/server/router/procedures";
+import type { ProjectColumn } from "../_config/columns-data";
+import { projectDatabaseFiltersCompiler, projectFiltersParser } from "../_config/filters";
+import {
+  projectTableDatabaseSortsCompiler,
+  projectTableSortsParser,
+  projectTableSortsSchema,
+} from "../_config/sorting";
+import { ensureProjectDriveFolder } from "./helpers.server";
+import { projects } from "./schema";
+import {
+  createProjectSchema,
+  projectFiltersSchema,
+  projectStatusSchema,
+  updateProjectSchema,
+} from "./validators";
+
+export const projectsRouter = {
+  list: protectedProcedure
+    .input(
+      z.object({
+        pagination: offsetPaginationSchema,
+        filters: projectFiltersSchema,
+        sorts: projectTableSortsSchema,
+      }),
+    )
+    .handler(async ({ context, input }) => {
+      const parsedSorts = projectTableSortsParser.parse(input.sorts);
+      const orderBy = projectTableDatabaseSortsCompiler(projects).parse(parsedSorts);
+
+      const parsedFilters = projectFiltersParser.parse(input.filters);
+      const where = projectDatabaseFiltersCompiler({
+        title: projects.title,
+        customerName: ({ value }) =>
+          exists(
+            context.db
+              .select({ one: sql`1` })
+              .from(customers)
+              .where(
+                and(eq(customers.id, projects.customerId), ilike(customers.name, value as string)),
+              ),
+          ),
+        customerId: projects.customerId,
+        status: projects.status,
+        deletedAt: projects.deletedAt,
+      }).parse(parsedFilters);
+
+      const { data, total } = await getTableData(context, projects, {
+        pagination: input.pagination,
+        where,
+        orderBy,
+        with: { customer: true },
+      });
+
+      return offsetPaginationResponse({
+        data: data as ProjectColumn[],
+        pagination: input.pagination,
+        total,
+      });
+    }),
+  filterCustomers: protectedProcedure
+    .input(z.object({ filters: projectFiltersSchema }))
+    .handler(async ({ context, input: { filters } }) =>
+      context.db
+        .select({
+          value: customers.id,
+          label: customers.name,
+          total: count(projects.id),
+        })
+        .from(customers)
+        .leftJoin(
+          projects,
+          and(
+            eq(customers.id, projects.customerId),
+            and(
+              filters.isDeleted ? isNotNull(projects.deletedAt) : isNull(projects.deletedAt),
+              filters.status ? inArray(projects.status, filters.status) : undefined,
+            ),
+          ),
+        )
+        .where(eq(customers.isDeleted, false))
+        .groupBy(customers.id)
+        .having(gte(sql<number>`count(${projects.id})`, 1))
+        .orderBy(customers.name),
+    ),
+  getAll: protectedProcedure.handler(async ({ context }) => context.db.select().from(projects)),
+  getCollection: protectedProcedure.handler(async ({ context }) =>
+    context.db.select().from(projects),
+  ),
+  getTimelineData: protectedProcedure.handler(async ({ context }) => {
+    const data = await context.db.query.projects.findMany({
+      where: isNull(projects.deletedAt),
+      with: {
+        initiatives: {
+          where: and(
+            isNotNull(initiatives.startDate),
+            or(isNull(initiatives.endDate), isNotNull(initiatives.deadline)),
+          ),
+          orderBy: [desc(initiatives.startDate), desc(initiatives.endDate)],
+        },
+      },
+    });
+
+    return data
+      .filter((project) => project.initiatives.length > 0 && project.initiatives[0]?.startDate)
+      .toSorted((a, b) =>
+        compareDesc(a.initiatives[0]?.startDate as string, b.initiatives[0]?.startDate as string),
+      );
+  }),
+  getTimelineById: protectedProcedure
+    .input(z.object({ id: z.string() }))
+    .handler(async ({ context, input }) => {
+      const data = await context.db.query.projects.findFirst({
+        where: and(isNull(projects.deletedAt), eq(projects.id, input.id)),
+        with: {
+          initiatives: {
+            where: and(
+              isNotNull(initiatives.startDate),
+              or(isNull(initiatives.endDate), isNotNull(initiatives.deadline)),
+            ),
+            orderBy: [desc(initiatives.startDate), desc(initiatives.endDate)],
+          },
+        },
+      });
+
+      return data ?? null;
+    }),
+  getById: protectedProcedure
+    .input(z.object({ id: z.string() }))
+    .handler(async ({ context, input }) => {
+      const [data] = await context.db.select().from(projects).where(eq(projects.id, input.id));
+
+      if (!data) {
+        throw new ORPCError("NOT_FOUND", {
+          message: "Project niet gevonden",
+        });
+      }
+
+      return data;
+    }),
+  getDrive: protectedProcedure
+    .use(permissionMiddleware({ project: ["view.drive"] }))
+    .input(z.object({ id: z.string() }))
+    .handler(async ({ context, input }) => {
+      const nodeId = await ensureProjectDriveFolder(context, input.id);
+      const { googleDrive } = await import("../../drive/_lib/service.server");
+      const folder = await googleDrive.getNodeById(nodeId);
+
+      if (!folder) {
+        throw new ORPCError("INTERNAL_SERVER_ERROR", {
+          message: "Folder kon niet worden gevonden",
+        });
+      }
+
+      return folder;
+    }),
+  getBudgetByMonth: protectedProcedure
+    .use(permissionMiddleware({ project: ["view.budget"] }))
+    .input(z.object({ year: z.number().optional() }).optional())
+    .handler(async ({ context, input }) => {
+      const year = input?.year ?? new Date().getFullYear();
+
+      const startOfYear = `${year}-01-01`;
+      const startOfNextYear = `${year + 1}-01-01`;
+
+      const budgetPerMonth = await context.db
+        .select({
+          month: sql<string>`to_char(date_trunc('month', ${initiatives.startDate} AT TIME ZONE 'UTC'), 'Month')`,
+          budget: sql<number>`sum(${initiatives.budget})`,
+        })
+        .from(initiatives)
+        .innerJoin(projects, eq(initiatives.projectId, projects.id))
+        .where(
+          and(
+            gte(initiatives.startDate, startOfYear),
+            lt(initiatives.startDate, startOfNextYear),
+            isNull(projects.deletedAt),
+            isNotNull(initiatives.budget),
+            isNotNull(initiatives.startDate),
+          ),
+        )
+        .groupBy(sql`date_trunc('month', ${initiatives.startDate} AT TIME ZONE 'UTC')`)
+        .orderBy(sql`date_trunc('month', ${initiatives.startDate} AT TIME ZONE 'UTC')`);
+      return budgetPerMonth;
+    }),
+  create: protectedProcedure
+    .use(permissionMiddleware({ project: ["create"] }))
+    .input(createProjectSchema)
+    .handler(async ({ context, input }) => {
+      const [result] = await context.db.insert(projects).values(input).returning();
+
+      if (!result) {
+        throw new ORPCError("NOT_FOUND", {
+          message: "Project kon niet worden aangemaakt",
+        });
+      }
+
+      return result;
+    }),
+  update: protectedProcedure
+    .use(permissionMiddleware({ project: ["update"] }))
+    .input(z.object({ id: z.string(), data: updateProjectSchema.partial() }))
+    .output(z.void())
+    .handler(async ({ context, input }) => {
+      const [result] = await context.db
+        .update(projects)
+        .set(input.data)
+        .where(eq(projects.id, input.id))
+        .returning();
+
+      if (!result) {
+        throw new ORPCError("NOT_FOUND", {
+          message: "Project kon niet worden gewijzigd",
+        });
+      }
+    }),
+  archive: protectedProcedure
+    .use(permissionMiddleware({ project: ["archive"] }))
+    .input(bulkActionSchema)
+    .handler(async ({ context, input }) => {
+      await context.db
+        .update(projects)
+        .set({ deletedAt: new Date() })
+        .where(inArray(projects.id, input.ids));
+    }),
+  restore: protectedProcedure
+    .use(permissionMiddleware({ project: ["archive"] }))
+    .input(bulkActionSchema)
+    .handler(async ({ context, input }) => {
+      await context.db
+        .update(projects)
+        .set({ deletedAt: null })
+        .where(inArray(projects.id, input.ids));
+    }),
+  delete: protectedProcedure
+    .use(permissionMiddleware({ project: ["delete"] }))
+    .input(bulkActionSchema)
+    .handler(async ({ context, input }) => {
+      await context.db.delete(projects).where(inArray(projects.id, input.ids));
+    }),
+  setStatus: protectedProcedure
+    .use(permissionMiddleware({ project: ["update"] }))
+    .input(bulkActionSchema.extend({ status: projectStatusSchema }))
+    .handler(async ({ context, input }) => {
+      await context.db
+        .update(projects)
+        .set({ status: input.status })
+        .where(inArray(projects.id, input.ids))
+        .returning();
+    }),
+};

package/dist/templates/code/src/app/admin/projects/_lib/schema.ts

@@ -0,0 +1,46 @@
+import type { EditorJSONContent } from "@tulip-systems/editor";
+import { relations } from "drizzle-orm";
+import { pgEnum, pgTable } from "drizzle-orm/pg-core";
+import { customers } from "@/app/admin/customers/_lib/schema";
+import { initiatives } from "@/app/admin/initiatives/_lib/schema";
+import { tasks } from "@/app/admin/tasks/_lib/schema";
+import { baseColumns } from "@/server/db/helpers";
+import { domains } from "@/server/db/schema";
+
+export const projectEnum = pgEnum("project_status_enum", [
+  "active",
+  "planned",
+  "backlog",
+  "completed",
+  "canceled",
+]);
+
+/**
+ * Project table
+ */
+export const projects = pgTable("projects", (t) => ({
+  ...baseColumns,
+  key: t.varchar({ length: 16 }).unique().notNull(),
+  title: t.varchar().notNull(),
+  status: projectEnum().default("backlog").notNull(),
+  notes: t.jsonb().$type<EditorJSONContent>(),
+  deletedAt: t.timestamp(),
+  customerId: t
+    .uuid()
+    .notNull()
+    .references(() => customers.id, { onDelete: "restrict" }),
+  nodeId: t.varchar(),
+}));
+
+/**
+ * Relations
+ */
+export const projectsRelations = relations(projects, ({ many, one }) => ({
+  tasks: many(tasks),
+  initiatives: many(initiatives),
+  domains: many(domains),
+  customer: one(customers, {
+    fields: [projects.customerId],
+    references: [customers.id],
+  }),
+}));