feat: monorepo

apps/web/src/utils/api.ts

@@ -0,0 +1,78 @@
+import type { CreateTRPCClientOptions, TRPCLink } from "@trpc/client";
+import { httpBatchLink, loggerLink } from "@trpc/client";
+import { createTRPCNext } from "@trpc/next";
+import { type inferRouterInputs, type inferRouterOutputs } from "@trpc/server";
+import { observable } from "@trpc/server/observable";
+import superjson from "superjson";
+
+import { type AppRouter } from "@kan/api/root";
+
+/**
+ * This is the client-side entrypoint for your tRPC API. It is used to create the `api` object which
+ * contains the Next.js App-wrapper, as well as your type-safe React Query hooks.
+ *
+ * We also create a few inference helpers for input and output types.
+ */
+
+const authLink: TRPCLink<AppRouter> = () => {
+  return ({ next, op }) => {
+    return observable((observer) => {
+      const unsubscribe = next(op).subscribe({
+        next(value) {
+          observer.next(value);
+        },
+        error(err) {
+          if (typeof window !== "undefined" && err.message === "UNAUTHORIZED") {
+            window.location.href = "/login";
+          }
+          observer.error(err);
+        },
+        complete() {
+          observer.complete();
+        },
+      });
+      return unsubscribe;
+    });
+  };
+};
+
+const getBaseUrl = () => {
+  if (typeof window !== "undefined") return ""; // browser should use relative url
+  if (process.env.VERCEL_URL) return `https://${process.env.VERCEL_URL}`; // SSR should use vercel url
+  return `http://localhost:${process.env.PORT ?? 3000}`; // dev SSR should use localhost
+};
+
+// @ts-expect-error
+export const api = createTRPCNext<AppRouter>({
+  config() {
+    return {
+      links: [
+        loggerLink({
+          enabled: (opts) =>
+            process.env.NODE_ENV === "development" ||
+            (opts.direction === "down" && opts.result instanceof Error),
+        }),
+        authLink,
+        httpBatchLink({
+          url: `${getBaseUrl()}/api/trpc`,
+          transformer: superjson,
+        }),
+      ],
+    };
+  },
+  ssr: false,
+});
+
+/**
+ * Inference helper for inputs.
+ *
+ * @example type HelloInput = RouterInputs['example']['hello']
+ */
+export type RouterInputs = inferRouterInputs<AppRouter>;
+
+/**
+ * Inference helper for outputs.
+ *
+ * @example type HelloOutput = RouterOutputs['example']['hello']
+ */
+export type RouterOutputs = inferRouterOutputs<AppRouter>;

apps/web/src/utils/helpers.ts

@@ -0,0 +1,30 @@
+export const formatToArray = (
+  value: string | string[] | undefined,
+): string[] => {
+  if (Array.isArray(value)) {
+    return value.filter((item) => item !== undefined);
+  }
+  return value ? [value] : [];
+};
+
+export const inferInitialsFromEmail = (email: string) => {
+  const localPart = email.split("@")[0];
+  if (!localPart) return "";
+  const separators = /[._-]/;
+  const parts = localPart.split(separators);
+
+  if (parts.length > 1) {
+    return (
+      (parts[0]?.[0] ?? "") + (parts[parts.length - 1]?.[0] ?? "")
+    ).toUpperCase();
+  } else {
+    return localPart.slice(0, 2).toUpperCase();
+  }
+};
+
+export const getInitialsFromName = (name: string) => {
+  return name
+    .split(" ")
+    .map((namePart) => namePart.charAt(0).toUpperCase())
+    .join("");
+};

apps/web/src/utils/supabase/client.ts

@@ -0,0 +1,12 @@
+import { createBrowserClient } from "@supabase/ssr";
+
+import { type Database } from "@kan/db/types/database.types";
+
+export default function createClient() {
+  const supabase = createBrowserClient<Database>(
+    process.env.NEXT_PUBLIC_SUPABASE_URL!,
+    process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
+  );
+
+  return supabase;
+}