Merge pull request #4 from Design-System-Project/feature/tfr2-106-add…

…-shared-server-api-code-with-types

add database, eslint, prettier, github as shared resources

.github/workflows/checks.yml

@@ -0,0 +1,53 @@
+name: 🔎 Checks
+
+on:
+  pull_request:
+    branches: ['*']
+  push:
+    branches: ['main']
+  merge_group:
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.ref }}
+  cancel-in-progress: ${{ github.ref != 'refs/heads/main' }}
+
+# You can leverage Vercel Remote Caching with Turbo to speed up your builds
+# @link https://turborepo.org/docs/core-concepts/remote-caching#remote-caching-on-vercel-builds
+env:
+  FORCE_COLOR: 3
+  TURBO_TEAM: ${{ vars.TURBO_TEAM }}
+  TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
+
+jobs:
+  lint:
+    runs-on: ubuntu-22.04
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Setup
+        uses: ./tools/github/setup
+
+      - name: Lint
+        run: pnpm lint && pnpm lint:ws
+
+  format:
+    runs-on: ubuntu-22.04
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Setup
+        uses: ./tools/github/setup
+
+      - name: Format
+        run: pnpm format
+
+  typecheck:
+    runs-on: ubuntu-22.04
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Setup
+        uses: ./tools/github/setup
+
+      - name: Typecheck
+        run: pnpm type-check

.github/workflows/migrate-db.yml

@@ -15,17 +15,8 @@ jobs:
       - name: Checkout Repo
         uses: actions/checkout@v4
 
-      - name: Enable Corepack
-        run: corepack enable
-
-      - name: Setup Node
-        uses: actions/setup-node@v4
-        with:
-          node-version-file: 'package.json'
-          cache: 'pnpm'
-
-      - name: Install Dependencies
-        run: pnpm install
+      - name: Setup
+        uses: ./tools/github/setup
 
       - name: Run Drizzle Migration
         working-directory: apps/dashboard

.prettierignore

@@ -1,4 +1,4 @@
-**/*.generated.*
+**/__generated__/
 storybook-static
 /dist
 

apps/dashboard/.gitignore

@@ -35,4 +35,7 @@ yarn-error.log*
 *.tsbuildinfo
 next-env.d.ts
 
-certificates
+certificates
+
+# editors
+.vscode

apps/dashboard/eslint.config.js

@@ -0,0 +1,14 @@
+import baseConfig, { restrictEnvAccess } from '@ds-project/eslint/base';
+import nextjsConfig from '@ds-project/eslint/nextjs';
+import reactConfig from '@ds-project/eslint/react';
+
+/** @type {import('typescript-eslint').Config} */
+export default [
+  {
+    ignores: ['.next/**'],
+  },
+  ...baseConfig,
+  ...reactConfig,
+  ...nextjsConfig,
+  ...restrictEnvAccess,
+];

apps/dashboard/next.config.mjs

@@ -1,3 +1,9 @@
+import { fileURLToPath } from 'node:url';
+import createJiti from 'jiti';
+const jiti = createJiti(fileURLToPath(import.meta.url));
+
+jiti('./src/config');
+
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   images: {
@@ -34,6 +40,15 @@ const nextConfig = {
       },
     ];
   },
+
+  reactStrictMode: true,
+
+  /** Enables hot reloading for local packages without a build step */
+  transpilePackages: ['@ds-project/database'],
+
+  /** We already do linting and typechecking as separate tasks in CI */
+  eslint: { ignoreDuringBuilds: true },
+  typescript: { ignoreBuildErrors: true },
 };
 
 export default nextConfig;

apps/dashboard/package.json

@@ -2,28 +2,26 @@
   "name": "dashboard",
   "version": "0.1.0",
   "private": true,
+  "type": "module",
+  "prettier": "@ds-project/prettier",
   "scripts": {
     "dev": "next dev --experimental-https",
     "build": "next build",
     "start": "next start",
-    "lint": "next lint",
+    "lint": "eslint",
     "type-check": "tsc --noEmit",
-    "db:types": "pnpm dlx supabase gen types --lang=typescript --linked > src/lib/supabase/__generated__/database.generated.types.ts",
-    "db:generate": "drizzle-kit generate",
-    "db:migrate": "drizzle-kit migrate",
-    "db:studio": "drizzle-kit studio",
-    "db:reset": "pnpx supabase db reset",
-    "db:start": "pnpx supabase start",
-    "db:stop": "pnpx supabase stop"
+    "format": "prettier --check ."
   },
   "dependencies": {
     "@ds-project/components": "workspace:*",
+    "@ds-project/database": "workspace:*",
     "@hookform/resolvers": "^3.9.0",
     "@octokit/app": "^15.1.0",
     "@octokit/auth-oauth-app": "^8.1.1",
     "@octokit/core": "^6.1.2",
     "@supabase/ssr": "^0.4.0",
     "@supabase/supabase-js": "^2.45.0",
+    "@t3-oss/env-nextjs": "^0.11.0",
     "@vercel/kv": "^2.0.0",
     "clsx": "^2.1.1",
     "date-fns": "^3.6.0",
@@ -35,31 +33,34 @@
     "next": "14.2.5",
     "postgres": "^3.4.4",
     "rambda": "^9.2.1",
-    "react": "^18.3.1",
+    "react": "catalog:",
     "react-diff-viewer": "^3.1.1",
-    "react-dom": "^18.3.1",
+    "react-dom": "catalog:",
     "react-hook-form": "^7.52.2",
     "react-json-view": "^1.21.3",
     "react-json-view-lite": "^1.4.0",
     "server-only": "^0.0.1",
-    "style-dictionary": "^4.0.1",
+    "style-dictionary": "catalog:",
     "tailwind-merge": "^2.4.0",
     "zod": "^3.23.8"
   },
   "devDependencies": {
+    "@ds-project/eslint": "workspace:*",
+    "@ds-project/prettier": "workspace:*",
+    "@ds-project/typescript": "workspace:*",
     "@next/env": "^14.2.5",
     "@octokit/types": "^13.5.0",
-    "@repo/eslint-config": "workspace:*",
     "@types/node": "^22.1.0",
     "@types/object-hash": "^3.0.6",
-    "@types/react": "^18.3.3",
-    "@types/react-dom": "^18.3.0",
+    "@types/react": "catalog:",
+    "@types/react-dom": "catalog:",
     "drizzle-kit": "^0.23.2",
-    "eslint": "^8",
+    "eslint": "catalog:",
     "eslint-config-next": "14.2.5",
+    "jiti": "^1.21.6",
     "postcss": "^8",
     "supabase": "^1.187.10",
     "tailwindcss": "^3.4.7",
-    "typescript": "^5.5.4"
+    "typescript": "catalog:"
   }
 }

apps/dashboard/src/app/(dashboard)/integrations/providers/figma/_actions/installation.action.ts

@@ -1,10 +1,11 @@
 'use server';
 
 import { eq } from 'drizzle-orm';
-import { database } from '@/lib/drizzle';
-import type { FigmaIntegration } from '@/lib/drizzle/schema';
-import { integrationType } from '@/lib/drizzle/schema';
+
 import { isAuthenticated } from '@/lib/supabase/server/utils/is-authenticated';
+import { database } from '@ds-project/database/client';
+import type { FigmaIntegration } from '@ds-project/database/schema';
+import { integrationType } from '@ds-project/database/schema';
 
 export async function getInstallation() {
   if (!(await isAuthenticated())) {

apps/dashboard/src/app/(dashboard)/integrations/providers/figma/resources/[resourceId]/_actions/resource.action.ts

@@ -1,8 +1,8 @@
 'use server';
 
 import { eq } from 'drizzle-orm';
-import { database } from '@/lib/drizzle';
 import { isAuthenticated } from '@/lib/supabase/server/utils/is-authenticated';
+import { database } from '@ds-project/database/client';
 
 export async function getResource(resourceId: string) {
   if (!(await isAuthenticated())) {

apps/dashboard/src/app/(dashboard)/integrations/providers/figma/resources/_actions/register-file.action.ts

@@ -1,11 +1,14 @@
 'use server';
 
 import { revalidatePath } from 'next/cache';
-import { database } from '@/lib/drizzle';
-import { figmaFilesTable, insertFigmaFileSchema } from '@/lib/drizzle/schema';
 import { isAuthenticated } from '@/lib/supabase/server/utils/is-authenticated';
 import { getUserAccount } from '@/lib/supabase/server/utils/get-user-account';
 import { figmaFileSchema, figmaUrlRegex } from '../_schemas/schema';
+import {
+  figmaFilesTable,
+  insertFigmaFileSchema,
+} from '@ds-project/database/schema';
+import { database } from '@ds-project/database/client';
 
 export async function registerFile(formData: FormData) {
   if (!(await isAuthenticated())) {

apps/dashboard/src/app/(dashboard)/integrations/providers/figma/resources/_actions/resources.action.ts

@@ -1,7 +1,7 @@
 import { eq } from 'drizzle-orm';
-import { database } from '@/lib/drizzle';
 import { isAuthenticated } from '@/lib/supabase/server/utils/is-authenticated';
 import { getProjectId } from '@/lib/supabase/server/utils/get-project-id';
+import { database } from '@ds-project/database/client';
 
 export async function getResources() {
   if (!(await isAuthenticated())) {

apps/dashboard/src/app/(dashboard)/integrations/providers/figma/resources/_components/resources-list.tsx

@@ -1,8 +1,8 @@
 import type { InferSelectModel } from 'drizzle-orm';
 import { Text } from '@ds-project/components';
 import Link from 'next/link';
-import type { resourcesTable } from '@/lib/drizzle/schema';
 import { FigmaFile } from './figma-file';
+import type { resourcesTable } from '@ds-project/database/schema';
 
 interface ResourcesListProps {
   resources: InferSelectModel<typeof resourcesTable>[];

apps/dashboard/src/app/(dashboard)/integrations/providers/github/_actions/installation.action.ts

@@ -1,10 +1,11 @@
 'use server';
 
 import { eq } from 'drizzle-orm';
-import { database } from '@/lib/drizzle';
-import type { GithubIntegration } from '@/lib/drizzle/schema';
-import { integrationType } from '@/lib/drizzle/schema';
+
 import { isAuthenticated } from '@/lib/supabase/server/utils/is-authenticated';
+import { database } from '@ds-project/database/client';
+import type { GithubIntegration } from '@ds-project/database/schema';
+import { integrationType } from '@ds-project/database/schema';
 
 export async function getInstallation() {
   if (!(await isAuthenticated())) {

apps/dashboard/src/app/(dashboard)/integrations/providers/github/_actions/select-repository.action.ts

@@ -1,13 +1,14 @@
 'use server';
 
 import { eq } from 'drizzle-orm';
-import { database } from '@/lib/drizzle';
+
+import { createServerClient } from '@/lib/supabase/server/client';
 import {
   integrationDataSchema,
   integrationsTable,
   integrationType,
-} from '@/lib/drizzle/schema';
-import { createServerClient } from '@/lib/supabase/server/client';
+} from '@ds-project/database/schema';
+import { database } from '@ds-project/database/client';
 
 export async function selectRepository(formData: FormData) {
   const supabase = createServerClient();

apps/dashboard/src/app/(dashboard)/integrations/providers/github/callback/route.ts

@@ -1,13 +1,14 @@
 import type { NextRequest } from 'next/server';
 import { NextResponse } from 'next/server';
-import { database } from '@/lib/drizzle';
+
+import { getProjectId } from '@/lib/supabase/server/utils/get-project-id';
 import {
   integrationDataSchema,
   integrationsTable,
   integrationsTableSchema,
   integrationType,
-} from '@/lib/drizzle/schema';
-import { getProjectId } from '@/lib/supabase/server/utils/get-project-id';
+} from '@ds-project/database/schema';
+import { database } from '@ds-project/database/client';
 
 export async function GET(request: NextRequest) {
   const { searchParams, origin } = new URL(request.url);
@@ -35,7 +36,6 @@ export async function GET(request: NextRequest) {
     // Register installation id
     await database.insert(integrationsTable).values(validatedValues);
   } catch (error) {
-    // eslint-disable-next-line no-console -- TODO: replace with monitoring
     console.error('Failed to connect GitHub app.');
   }
 

apps/dashboard/src/app/api/auth/start/route.ts

@@ -1,9 +1,9 @@
-import crypto from "node:crypto";
-import { kv } from "@vercel/kv";
+import crypto from 'node:crypto';
+import { kv } from '@vercel/kv';
 
 export async function POST() {
-  const readKey = crypto.randomBytes(64).toString("hex");
-  const writeKey = crypto.randomBytes(64).toString("hex");
+  const readKey = crypto.randomBytes(64).toString('hex');
+  const writeKey = crypto.randomBytes(64).toString('hex');
 
   if (
     await kv.set(
@@ -18,5 +18,5 @@ export async function POST() {
     return Response.json({ readKey, writeKey });
   }
 
-  return new Response("Unexpected error", { status: 500 });
+  return new Response('Unexpected error', { status: 500 });
 }

apps/dashboard/src/app/api/figma/design-systems/link/route.ts

@@ -1,7 +1,7 @@
 import type { NextRequest } from 'next/server';
 import { isAuthenticated } from '@/lib/supabase/server/utils/is-authenticated';
-import { database } from '@/lib/drizzle';
-import { resourcesTable } from '@/lib/drizzle/schema';
+import { database } from '@ds-project/database/client';
+import { resourcesTable } from '@ds-project/database/schema';
 
 export async function POST(request: NextRequest) {
   if (!(await isAuthenticated(request))) {

apps/dashboard/src/app/api/figma/design-systems/list/route.ts

@@ -1,8 +1,9 @@
 import type { NextRequest } from 'next/server';
 import { isAuthenticated } from '@/lib/supabase/server/utils/is-authenticated';
-import { database } from '@/lib/drizzle';
-import { projectsTable } from '@/lib/drizzle/schema';
+
 import { getProjectId } from '@/lib/supabase/server/utils/get-project-id';
+import { database } from '@ds-project/database/client';
+import { projectsTable } from '@ds-project/database/schema';
 
 export async function GET(request: NextRequest) {
   if (!(await isAuthenticated(request))) {