Merge pull request #5 from Design-System-Project/feature/tfr2-107-add…

…-api-code

Refactor project structure

.gitignore

@@ -1,14 +1,57 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+node_modules/
+/.pnp
+.pnp.js
+.yarn/install-state.gz
+
+# testing
+/coverage
+
+# next.js
+.next/
+/out/
+
+# production
+dist/
+
+# misc
 .DS_Store
-node_modules
-.turbo
+*.pem
+.cache/
+
+# debug
 *.log
-.next
-dist
-dist-ssr
-*.local
-.env
-.cache
-server/dist
-public/dist
-storybook-static/
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+
+certificates
+
+# editors
 .vscode
+.idea
+
+# monorepo
+.turbo
+
+
+# package specific
+packages/components/src/components
+packages/components/components.json
+
+# database
+packages/database/supabase/.branches
+packages/database/supabase/.temp
+packages/database/supabase/.env
+
+
+

apps/dashboard/.env

@@ -0,0 +1,2 @@
+NEXT_PUBLIC_SUPABASE_URL=
+NEXT_PUBLIC_SUPABASE_ANON_KEY=

apps/dashboard/package.json

@@ -10,9 +10,11 @@
     "start": "next start",
     "lint": "eslint",
     "type-check": "tsc --noEmit",
-    "format": "prettier --check ."
+    "format": "prettier --check . --ignore-path ../../.gitignore --ignore-path ../../.prettierignore"
   },
   "dependencies": {
+    "@ds-project/api": "workspace:*",
+    "@ds-project/auth": "workspace:*",
     "@ds-project/components": "workspace:*",
     "@ds-project/database": "workspace:*",
     "@hookform/resolvers": "^3.9.0",
@@ -22,6 +24,9 @@
     "@supabase/ssr": "^0.4.0",
     "@supabase/supabase-js": "^2.45.0",
     "@t3-oss/env-nextjs": "^0.11.0",
+    "@tanstack/react-query": "^5.51.24",
+    "@trpc/react-query": "catalog:",
+    "@trpc/server": "catalog:",
     "@vercel/kv": "^2.0.0",
     "clsx": "^2.1.1",
     "date-fns": "^3.6.0",
@@ -30,7 +35,7 @@
     "framer-motion": "^11.3.21",
     "human-id": "^4.1.1",
     "memoize": "^10.0.0",
-    "next": "14.2.5",
+    "next": "catalog:",
     "postgres": "^3.4.4",
     "rambda": "^9.2.1",
     "react": "catalog:",
@@ -41,26 +46,28 @@
     "react-json-view-lite": "^1.4.0",
     "server-only": "^0.0.1",
     "style-dictionary": "catalog:",
+    "superjson": "^2.2.1",
     "tailwind-merge": "^2.4.0",
     "zod": "^3.23.8"
   },
   "devDependencies": {
+    "@ds-project/services": "workspace:*",
     "@ds-project/eslint": "workspace:*",
     "@ds-project/prettier": "workspace:*",
     "@ds-project/typescript": "workspace:*",
     "@next/env": "^14.2.5",
     "@octokit/types": "^13.5.0",
-    "@types/node": "^22.1.0",
+    "@types/node": "catalog:",
     "@types/object-hash": "^3.0.6",
     "@types/react": "catalog:",
     "@types/react-dom": "catalog:",
     "drizzle-kit": "^0.23.2",
     "eslint": "catalog:",
     "eslint-config-next": "14.2.5",
     "jiti": "^1.21.6",
-    "postcss": "^8",
+    "postcss": "catalog:",
     "supabase": "^1.187.10",
-    "tailwindcss": "^3.4.7",
+    "tailwindcss": "catalog:",
     "typescript": "catalog:"
   }
 }

apps/dashboard/src/app/(dashboard)/integrations/providers/figma/_components/provider.tsx

@@ -1,15 +1,15 @@
 import { Button, Icons, Text } from '@ds-project/components';
 import Link from 'next/link';
 import { getFigma } from '@/lib/figma';
-import { getInstallation } from '../_actions';
+import { api } from '@ds-project/api/rsc';
 
 export async function FigmaProvider() {
   const figma = await getFigma();
   const installationUrl = await figma.getInstallationUrl();
 
-  const installation = await getInstallation();
+  const figmaIntegration = await api.integrations.figma();
 
-  const isInstallationActive = Boolean(installation?.data.accessToken);
+  const isInstallationActive = Boolean(figmaIntegration?.data.accessToken);
 
   return (
     <div className=" flex items-center space-x-4 rounded-md border p-4">

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

@@ -1,15 +1,7 @@
 'use server';
 
-import { eq } from 'drizzle-orm';
-import { isAuthenticated } from '@/lib/supabase/server/utils/is-authenticated';
-import { database } from '@ds-project/database/client';
+import { api } from '@ds-project/api/rsc';
 
 export async function getResource(resourceId: string) {
-  if (!(await isAuthenticated())) {
-    throw new Error('Not authenticated');
-  }
-
-  return database.query.resourcesTable.findFirst({
-    where: (resource) => eq(resource.id, resourceId),
-  });
+  return api.resources.byId({ id: resourceId });
 }

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

@@ -1,14 +1,9 @@
 'use server';
 
-import { isAuthenticated } from '@/lib/supabase/server/utils/is-authenticated';
 import { getFigma } from '@/lib/figma';
 import { figmaUrlRegex } from '../_schemas/schema';
 
 export async function getFilePreview({ url }: { url: string }) {
-  if (!(await isAuthenticated())) {
-    throw new Error('Not authenticated');
-  }
-
   try {
     const match = url.match(figmaUrlRegex);
     const fileKey = match?.groups?.fileKey;
@@ -20,7 +15,6 @@ export async function getFilePreview({ url }: { url: string }) {
     const figma = await getFigma();
     return await figma.getFile(fileKey);
   } catch (error) {
-    // eslint-disable-next-line no-console -- TODO: replace with monitoring
     console.error('Error parsing form data', error);
   }
 }

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

@@ -1,20 +1,17 @@
 'use server';
 
 import { revalidatePath } from 'next/cache';
-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 { database } from '@ds-project/database/client';
 import {
-  figmaFilesTable,
-  insertFigmaFileSchema,
+  FigmaResources,
+  insertFigmaResourcesSchema,
 } from '@ds-project/database/schema';
-import { database } from '@ds-project/database/client';
+import { api } from '@ds-project/api/rsc';
 
 export async function registerFile(formData: FormData) {
-  if (!(await isAuthenticated())) {
-    throw new Error('Not authenticated');
-  }
-
   const validatedData = figmaFileSchema.parse(
     Object.fromEntries(formData.entries())
   );
@@ -24,16 +21,16 @@ export async function registerFile(formData: FormData) {
 
   if (!fileKey) throw new Error('No file key found in the figma url');
 
-  const account = await getUserAccount();
+  const account = await api.accounts.current();
 
   if (!account) throw new Error('No account found');
 
-  const validatedFigmaFile = insertFigmaFileSchema.parse({
+  const validatedFigmaFile = insertFigmaResourcesSchema.parse({
     fileKey,
     ...validatedData,
   });
 
-  await database.insert(figmaFilesTable).values(validatedFigmaFile);
+  await database.insert(FigmaResources).values(validatedFigmaFile);
 
   revalidatePath('/integrations/figma/files');
 }

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

@@ -1,28 +1,9 @@
-import { eq } from 'drizzle-orm';
-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';
+import { api } from '@ds-project/api/rsc';
 
 export async function getResources() {
-  if (!(await isAuthenticated())) {
-    throw new Error('Not authenticated');
-  }
+  const project = await api.projects.current();
 
-  const projectId = await getProjectId();
+  if (!project?.id) throw new Error('No project associated with this account');
 
-  if (!projectId) throw new Error('No project associated with this account');
-
-  return database.query.resourcesTable.findMany({
-    with: {
-      project: {
-        with: {
-          resources: true,
-          accountsToProjects: {
-            where: (accountsToProjects) =>
-              eq(accountsToProjects.projectId, projectId),
-          },
-        },
-      },
-    },
-  });
+  return api.resources.byProjectId({ projectId: project.id });
 }

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

@@ -2,10 +2,10 @@ import type { InferSelectModel } from 'drizzle-orm';
 import { Text } from '@ds-project/components';
 import Link from 'next/link';
 import { FigmaFile } from './figma-file';
-import type { resourcesTable } from '@ds-project/database/schema';
+import type { Resources } from '@ds-project/database/schema';
 
 interface ResourcesListProps {
-  resources: InferSelectModel<typeof resourcesTable>[];
+  resources: InferSelectModel<typeof Resources>[];
 }
 export function ResourcesList({ resources }: ResourcesListProps) {
   return (

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

@@ -1,3 +1,2 @@
-export * from './installation.action';
 export * from './request-tokens.action';
 export * from './select-repository.action';