@tulip-systems/core 0.2.0

package/src/modules/commands/utils/send-mail-command.client.tsx

@@ -0,0 +1,187 @@
+"use client";
+
+import {
+  Accordion,
+  AccordionContent,
+  AccordionItem,
+  AccordionTrigger,
+} from "@/components/ui/accordion";
+import { ComboboxDropdown } from "@/components/ui/combobox-dropdown.client";
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from "@/components/ui/form.client";
+import { Input } from "@/components/ui/input";
+import { Textarea } from "@/components/ui/textarea";
+import { standardSchemaResolver } from "@hookform/resolvers/standard-schema";
+import { StandardSchemaV1 } from "better-auth";
+import { DefaultValues, FieldValues, useForm } from "react-hook-form";
+import { ZodSchema } from "zod";
+import {
+  CommandFormDialog,
+  CommandFormDialogCancel,
+  CommandFormDialogContent,
+  CommandFormDialogDescription,
+  CommandFormDialogFields,
+  CommandFormDialogFooter,
+  CommandFormDialogHeader,
+  CommandFormDialogSubmit,
+  CommandFormDialogTitle,
+  CommandFormDialogTrigger,
+} from "../components/form-dialog-command.client";
+import { CommandAction } from "../hooks/use-command-action.client";
+import { SingleCommandDefRenderParams } from "../lib/definitions";
+import { SendEmailSchema } from "../lib/schema";
+
+export type SendMailCommandMeta = {
+  contacts: { id: string; name: string; email: string }[];
+};
+
+export type SendMailCommandProps<
+  TSchema extends FieldValues,
+  TData extends { id: string },
+  TMeta extends SendMailCommandMeta,
+> = {
+  schema: ZodSchema<TSchema>;
+  action: CommandAction<TSchema>;
+  defaultValues?: DefaultValues<TSchema>;
+  children?: React.ReactNode;
+} & Pick<SingleCommandDefRenderParams<TData, TMeta>, "meta">;
+
+/**
+ * SendMail command
+ * @description command to delete a resource
+ */
+export function SendMailCommand<
+  TSchema extends SendEmailSchema,
+  TData extends { id: string },
+  TMeta extends SendMailCommandMeta,
+>({ schema, action, defaultValues, meta, children }: SendMailCommandProps<TSchema, TData, TMeta>) {
+  const form = useForm<SendEmailSchema>({
+    resolver: standardSchemaResolver(schema as StandardSchemaV1<SendEmailSchema>),
+    defaultValues,
+  });
+
+  const contactComboboxItems = meta.contacts.map((contact) => ({
+    id: contact.email,
+    value: contact.name,
+  }));
+
+  return (
+    <CommandFormDialog>
+      {children}
+
+      <Form {...form}>
+        <CommandFormDialogContent action={action} message="Succesvol verzonden">
+          <CommandFormDialogHeader>
+            <CommandFormDialogTitle>Verzend een e-mail</CommandFormDialogTitle>
+
+            <CommandFormDialogDescription>
+              Verzend een e-mail naar de geselecteerde contacten.
+            </CommandFormDialogDescription>
+          </CommandFormDialogHeader>
+
+          <CommandFormDialogFields>
+            <div className="flex flex-col">
+              <FormField
+                control={form.control}
+                name="to"
+                render={({ field }) => (
+                  <FormItem>
+                    <FormLabel>Ontvanger</FormLabel>
+                    <FormControl>
+                      <ComboboxDropdown
+                        placeholder="Kies een ontvanger..."
+                        selectedItem={
+                          contactComboboxItems?.find((contact) => contact.id === field.value) ??
+                          undefined
+                        }
+                        items={contactComboboxItems ?? []}
+                        onSelect={({ id }) => field.onChange(id)}
+                      />
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                )}
+              />
+
+              <Accordion type="single" collapsible>
+                <AccordionItem value="cc">
+                  <AccordionTrigger>{""}</AccordionTrigger>
+                  <AccordionContent>
+                    <div className="flex flex-col gap-4 p-1">
+                      <FormField
+                        control={form.control}
+                        name="cc"
+                        render={({ field }) => (
+                          <FormItem>
+                            <FormLabel>cc</FormLabel>
+                            <FormControl>
+                              <Input placeholder="Vul hier de cc in..." {...field} />
+                            </FormControl>
+                            <FormMessage />
+                          </FormItem>
+                        )}
+                      />
+
+                      <FormField
+                        control={form.control}
+                        name="bcc"
+                        render={({ field }) => (
+                          <FormItem>
+                            <FormLabel>bcc</FormLabel>
+                            <FormControl>
+                              <Input placeholder="Vul hier de bcc in..." {...field} />
+                            </FormControl>
+                            <FormMessage />
+                          </FormItem>
+                        )}
+                      />
+                    </div>
+                  </AccordionContent>
+                </AccordionItem>
+              </Accordion>
+            </div>
+
+            <FormField
+              control={form.control}
+              name="subject"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel>Onderwerp</FormLabel>
+                  <FormControl>
+                    <Input placeholder="Vul hier het onderwerp in..." {...field} />
+                  </FormControl>
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+
+            <FormField
+              control={form.control}
+              name="body"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel>Bericht</FormLabel>
+                  <Textarea {...field} rows={10} />
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+          </CommandFormDialogFields>
+
+          <CommandFormDialogFooter>
+            <CommandFormDialogCancel>Annuleren</CommandFormDialogCancel>
+            <CommandFormDialogSubmit>Versturen</CommandFormDialogSubmit>
+          </CommandFormDialogFooter>
+        </CommandFormDialogContent>
+      </Form>
+    </CommandFormDialog>
+  );
+}
+
+export const SendMailCommandTrigger = CommandFormDialogTrigger;

package/src/modules/config/db/create-client.ts

@@ -0,0 +1,33 @@
+import "server-cli-only";
+
+import { drizzle, PostgresJsDatabase } from "drizzle-orm/postgres-js";
+import postgres from "postgres";
+import { TulipConfig } from "../lib/config.server";
+import { TDatabaseSchema } from "./types";
+
+declare global {
+  // eslint-disable-next-line no-var, @typescript-eslint/no-explicit-any
+  var db: PostgresJsDatabase<any> | undefined;
+}
+
+export function createDatabaseClient<TSchema extends TDatabaseSchema>(
+  database: TulipConfig<TSchema>["database"],
+) {
+  const { pool, schema } = database;
+
+  let db: PostgresJsDatabase<TSchema>;
+
+  if (process.env.NODE_ENV === "production") {
+    const client = postgres(pool.connectionString, { max: pool.max });
+
+    db = drizzle({ client, schema, casing: "snake_case" });
+  } else {
+    const client = postgres(pool.connectionString, { max: pool.max });
+
+    if (!global.db) global.db = drizzle({ client, schema, casing: "snake_case" });
+
+    db = global.db;
+  }
+
+  return db;
+}

package/src/modules/config/db/helpers.ts

@@ -0,0 +1,18 @@
+import { timestamp, uuid } from "drizzle-orm/pg-core";
+import { v7 as uuidv7 } from "uuid";
+
+/**
+ * Base columns4
+ */
+export const baseColumns = {
+  // Primary key
+  id: uuid()
+    .primaryKey()
+    .$defaultFn(() => uuidv7()),
+  // Timestamps
+  createdAt: timestamp().defaultNow().notNull(),
+  updatedAt: timestamp()
+    .defaultNow()
+    .notNull()
+    .$onUpdate(() => new Date()),
+};

package/src/modules/config/db/types.ts

@@ -0,0 +1 @@
+export type TDatabaseSchema = Record<string, unknown>;

package/src/modules/config/entry.server.ts

@@ -0,0 +1,14 @@
+/**
+ * Lib
+ */
+export * from "./lib/config.server";
+export * from "./lib/resolve.server";
+export * from "./paths/create.server";
+
+/**
+ * Router
+ */
+export * from "./router/context.server";
+export * from "./router/error.server";
+export * from "./router/init.server";
+export * from "./router/client.server";

package/src/modules/config/entry.ts

@@ -0,0 +1,5 @@
+export * from "./db/helpers";
+export * from "./db/types";
+export * from "./paths/types";
+export * from "./router/client";
+export * from "./router/validators";

package/src/modules/config/lib/config.server.ts

@@ -0,0 +1,40 @@
+import "server-cli-only";
+
+import { createAccessControl, Role } from "@/modules/auth/lib/permissions";
+import { TDatabaseSchema } from "@/modules/config/db/types";
+import { S3ClientConfig } from "@aws-sdk/client-s3";
+import { PathConfig } from "../paths/types";
+
+export type TulipConfig<TSchema extends TDatabaseSchema> = {
+  general: {
+    name: string;
+    shortName: string;
+  };
+  paths: PathConfig<TSchema>;
+  database: {
+    schema: TSchema;
+    pool: {
+      connectionString: string;
+      max?: number;
+    };
+  };
+  auth: {
+    ac: ReturnType<typeof createAccessControl>;
+    roles: {
+      [key in string]?: Role;
+    };
+  };
+  email: {
+    key: string;
+    from: string;
+  };
+  uploads: S3ClientConfig;
+};
+
+/**
+ * Build the Tulip config
+ */
+
+export const defineConfig = <TSchema extends TDatabaseSchema>(
+  config: TulipConfig<TSchema>,
+): TulipConfig<TSchema> => config;

package/src/modules/config/lib/resolve.server.ts

@@ -0,0 +1,75 @@
+import "server-cli-only";
+
+import { createServerAuth } from "@/modules/auth/handler/server.server";
+import { createDatabaseClient } from "@/modules/config/db/create-client";
+import { TDatabaseSchema } from "@/modules/config/db/types";
+import { S3Client } from "@aws-sdk/client-s3";
+import { cache } from "react";
+import { Resend } from "resend";
+import { TulipConfig } from "./config.server";
+
+/**
+ * Get the Tulip provider
+ */
+export type GetTulipParams<TSchema extends TDatabaseSchema> = {
+  config: TulipConfig<TSchema>;
+};
+
+export type GetTulipReturn<TSchema extends TDatabaseSchema> = Awaited<
+  ReturnType<typeof getTulip<TSchema>>
+>;
+
+/**
+ * Get the Tulip provider
+ */
+export const getTulip = cache(
+  async <TSchema extends TDatabaseSchema>(params: GetTulipParams<TSchema>) => {
+    const { general, paths, database, email, uploads } = params.config;
+
+    const { schema } = database;
+
+    /**
+     * Create a database client
+     */
+    const db = createDatabaseClient<TSchema>(database);
+
+    /**
+     * Email provider
+     */
+    const resend = new Resend(email.key);
+
+    /**
+     * Auth provider
+     */
+    const auth = createServerAuth({
+      auth: params.config.auth,
+      db,
+      schema,
+      email,
+      resend,
+    });
+
+    /**
+     * S3 client
+     */
+    const blob = new S3Client(uploads);
+
+    /**
+     * Session
+     */
+    // const headers = new Headers(await headersList());
+    // const session = await auth.api.getSession({ headers });
+
+    return {
+      general,
+      paths,
+      // headers,
+      // session,
+      schema,
+      db,
+      auth,
+      resend,
+      blob,
+    };
+  },
+);

package/src/modules/config/paths/create.server.ts

@@ -0,0 +1,10 @@
+import "server-cli-only";
+
+import { TDatabaseSchema } from "../db/types";
+import { PathConfig } from "./types";
+
+/**
+ * Create the paths object
+ * @param {(() => Promise<PathOutput>)[]} config
+ */
+export const createPaths = <TSchema extends TDatabaseSchema>(paths: PathConfig<TSchema>) => paths;

package/src/modules/config/paths/get.server.ts

@@ -0,0 +1,69 @@
+import "server-cli-only";
+
+import { getSession } from "@/modules/auth/lib/helpers.server";
+import { cache, createElement } from "react";
+import { TDatabaseSchema } from "../db/types";
+import { GetTulipReturn } from "../lib/resolve.server";
+import { PathResult } from "./types";
+
+/**
+ * Get the paths that the user has access to
+ * @param {(() => Promise<PathOutput>)[][]} paths
+ * @param {User} user
+ * @returns {Promise<PathInput[][]>}
+ */
+export const getPaths = cache(
+  async <TSchema extends TDatabaseSchema>(config: GetTulipReturn<TSchema>): Promise<PathResult> => {
+    const session = await getSession(config);
+
+    /**
+     * Initialise the paths by executing the path functions
+     */
+    const resolvedPaths = await Promise.all(
+      config.paths.map(async (group) => {
+        /**
+         * Initialise the path by executing the path function
+         */
+        const initialisedPaths = await Promise.all(group.items.map((path) => path(config)));
+
+        /**
+         * Filter out paths that the user doesn't have permission for
+         */
+        const validatedPaths = await Promise.all(
+          initialisedPaths.map(async (path) => {
+            if (!path.permission) return path;
+
+            const hasPermission = await config.auth.api.userHasPermission({
+              body: {
+                permission: path.permission,
+                userId: session.user?.id,
+              },
+            });
+            if (!hasPermission.success) return null;
+
+            return path;
+          }),
+        );
+
+        /**
+         * Resolve the icon component
+         */
+        const resolvedPaths = validatedPaths
+          .filter((path) => !!path)
+          .map((path) => {
+            return {
+              ...path,
+              icon: path.icon ? createElement(path.icon) : undefined,
+            };
+          });
+
+        return { ...group, items: resolvedPaths };
+      }),
+    );
+
+    /**
+     * Filter out empty groups
+     */
+    return resolvedPaths.filter((group) => group.items.length > 0);
+  },
+);

package/src/modules/config/paths/types.ts

@@ -0,0 +1,64 @@
+import { type Permission } from "@/modules/auth/lib/permissions";
+import { type LucideIcon } from "lucide-react";
+import { type Route } from "next";
+import { type TDatabaseSchema } from "../db/types";
+
+/**
+ * Path input type
+ */
+export type PathGroupInput<TSchema extends TDatabaseSchema> = {
+  name?: string;
+  items: ((config: {}) => Promise<PathInput>)[];
+};
+
+export type PathInput = {
+  name: string;
+  href: Route;
+  icon?: LucideIcon;
+  segment?: string;
+  permission?: Permission;
+  isActive?: boolean;
+  items?: PathSubItemInput[];
+};
+
+export type PathSubItemInput = {
+  name: string;
+  href: Route;
+  segment?: string;
+  permission?: Permission;
+  isActive?: boolean;
+};
+
+/**
+ * Path output type
+ */
+export type PathGroupOutput = {
+  name?: string;
+  items: PathOutput[];
+};
+
+export type PathOutput = {
+  name: string;
+  href: Route;
+  icon?: React.JSX.Element;
+  segment?: string;
+  isActive?: boolean;
+  items?: PathSubItemOutput[];
+};
+
+export type PathSubItemOutput = {
+  name: string;
+  href: Route;
+  segment?: string;
+  isActive?: boolean;
+};
+
+/**
+ * Path config type
+ */
+export type PathConfig<TSchema extends TDatabaseSchema> = PathGroupInput<TSchema>[];
+
+/**
+ * Path result type
+ */
+export type PathResult = PathGroupOutput[];

package/src/modules/config/router/client.server.tsx

@@ -0,0 +1,57 @@
+import "server-cli-only";
+
+import { AnyRouter, createRouterClient } from "@orpc/server";
+import { dehydrate, HydrationBoundary } from "@tanstack/react-query";
+import { cache } from "react";
+import { createQueryClient } from "./query-client";
+
+/**
+ *  Create a stable getter for the query client that will return the same client during the same request.
+ */
+export const getQueryClient = cache(createQueryClient);
+
+/**
+ * Hydrate the client with the data from the server
+ */
+export function HydrateClient(props: { children: React.ReactNode }) {
+  const queryClient = getQueryClient();
+
+  return <HydrationBoundary state={dehydrate(queryClient)}>{props.children}</HydrationBoundary>;
+}
+
+/**
+ * Initialize the server client
+ */
+export function createRPCServerClient<TRouter extends AnyRouter>(appRouter: TRouter) {
+  return createRouterClient(appRouter, { context: {} as any });
+}
+
+// /**
+//  * Prefetch a single query
+//  */
+// export function prefetchQuery<T extends QueryOptionsBase<unknown, unknown>>(queryOptions: T) {
+//   const queryClient = getQueryClient();
+//   void queryClient.prefetchQuery(queryOptions);
+// }
+
+// export function prefetchInfiniteQuery<
+//   T extends FetchInfiniteQueryOptions<unknown, unknown, unknown>,
+// >(queryOptions: T) {
+//   const queryClient = getQueryClient();
+//   void queryClient.prefetchInfiniteQuery(queryOptions);
+// }
+
+// /**
+//  * Prefetch multiple queries
+//  */
+// export function batchPrefetch<T extends ReturnType<TRPCQueryOptions<any>>>(queryOptionsArray: T[]) {
+//   const queryClient = getQueryClient();
+
+//   for (const queryOptions of queryOptionsArray) {
+//     if (queryOptions.queryKey[1]?.type === "infinite") {
+//       void queryClient.prefetchInfiniteQuery(queryOptions as any);
+//     } else {
+//       void queryClient.prefetchQuery(queryOptions);
+//     }
+//   }
+// }

package/src/modules/config/router/client.tsx

@@ -0,0 +1,31 @@
+"use client";
+
+import { createORPCClient } from "@orpc/client";
+import { RPCLink } from "@orpc/client/fetch";
+import { AnyRouter, RouterClient } from "@orpc/server";
+import { createTanstackQueryUtils } from "@orpc/tanstack-query";
+
+/**
+ * Create a new RPC link
+ */
+const link = new RPCLink({
+  url: () => {
+    if (typeof window === "undefined") {
+      throw new Error("RPCLink is not allowed on the server side.");
+    }
+
+    return `${window.location.origin}/api/rpc`;
+  },
+});
+
+/**
+ * Create a new RPC client
+ */
+const client: RouterClient<AnyRouter> = createORPCClient(link);
+
+/**
+ * Create a new RPC client
+ */
+export function createRPCClient<TRouter extends AnyRouter>() {
+  return createTanstackQueryUtils(client as RouterClient<TRouter>);
+}

package/src/modules/config/router/context.server.ts

@@ -0,0 +1,29 @@
+import "server-cli-only";
+
+/* eslint-disable @typescript-eslint/no-explicit-any */
+
+import { type TDatabaseSchema } from "@/modules/config/db/types";
+import { getTulip, GetTulipParams } from "@/modules/config/lib/resolve.server";
+import { headers as headersList } from "next/headers";
+import { cache } from "react";
+
+/**
+ * Create the router context
+ */
+export const createRPCContext = cache(
+  async <TSchema extends TDatabaseSchema>(params: GetTulipParams<TSchema>) => {
+    const tulip = await getTulip(params);
+    const headers = await headersList();
+    const session = await tulip.auth.api.getSession({ headers });
+
+    return { ...tulip, session, headers };
+  },
+);
+
+export type RPCContext<TSchema extends TDatabaseSchema = any> = Awaited<
+  ReturnType<typeof createRPCContext<TSchema>>
+>;
+
+export type ProtectedRPCContext<TSchema extends TDatabaseSchema = any> = RPCContext<TSchema> & {
+  session: NonNullable<RPCContext<TSchema>["session"]>;
+};

package/src/modules/config/router/error.server.ts

@@ -0,0 +1 @@
+export { ORPCError as ServerError } from "@orpc/server";

package/src/modules/config/router/helpers.ts

@@ -0,0 +1,3 @@
+import { StandardRPCJsonSerializer } from "@orpc/client/standard";
+
+export const serializer = new StandardRPCJsonSerializer();