chore(platoform): Swapped all legacy API calls with `@keyshade/api-cl…

…ient` (#584)

Co-authored-by: rajdip-b <[email protected]>

apps/platform/.eslintrc.cjs

@@ -7,24 +7,17 @@ module.exports = {
   },
   rules: {
     'import/no-extraneous-dependencies': 0,
-    '@typescript-eslint/interface-name-prefix': 'off',
     '@typescript-eslint/explicit-function-return-type': 'off',
     '@typescript-eslint/explicit-module-boundary-types': 'off',
-    '@typescript-eslint/no-explicit-any': 'off',
     '@typescript-eslint/no-unused-vars': ['warn'],
-    '@typescript-eslint/no-unsafe-call': 'off',
-    '@typescript-eslint/no-unsafe-return': 'off',
     '@typescript-eslint/space-before-function-paren': 'off',
     '@typescript-eslint/strict-boolean-expressions': 'off',
-    '@typescript-eslint/prefer-nullish-coalescing': 'off',
-    'space-before-function-paren': 'off',
-    '@typescript-eslint/member-delimiter-style': 'off',
     '@typescript-eslint/no-confusing-void-expression': 'off',
     '@typescript-eslint/no-floating-promises': 'off',
     '@typescript-eslint/no-misused-promises': 'off',
     '@typescript-eslint/no-unsafe-assignment': 'off',
+    '@typescript-eslint/no-unsafe-call': 'off',
     '@typescript-eslint/no-unsafe-member-access': 'off',
-    '@typescript-eslint/no-unsafe-argument': 'off',
-    '@typescript-eslint/no-unnecessary-condition': 'off'
+    '@typescript-eslint/no-unsafe-return': 'off'
   }
 }

apps/platform/Dockerfile

@@ -36,13 +36,11 @@ RUN addgroup --system --gid 1001 nodejs
 RUN adduser --system --uid 1001  nextjs
 USER nextjs
 
-COPY --from=installer /app/apps/platform/next.config.mjs .
 COPY --from=installer /app/apps/platform/package.json .
 
 # Automatically leverage output traces to reduce image size
 # https://nextjs.org/docs/advanced-features/output-file-tracing
-COPY --from=installer  --chown=nextjs:nodejs /app/apps/platform/.next/standalone ./
-COPY --from=installer  --chown=nextjs:nodejs /app/apps/platform/.next/static ./apps/platform/.next/static
+COPY --from=installer  --chown=nextjs:nodejs /app/apps/platform/.next ./apps/platform/.next
 COPY --from=installer  --chown=nextjs:nodejs /app/apps/platform/public ./apps/platform/public
 
 

apps/platform/src/app/(main)/page.tsx

@@ -6,7 +6,6 @@ import type {
   ProjectWithCount,
   Workspace
 } from '@keyshade/schema'
-import { ProjectController } from '@keyshade/api-client'
 import { AddSVG } from '@public/svg/shared'
 import { FolderSVG } from '@public/svg/dashboard'
 import ProjectCard from '@/components/dashboard/projectCard'
@@ -38,6 +37,7 @@ import {
   DialogHeader,
   DialogTrigger
 } from '@/components/ui/dialog'
+import ControllerInstance from '@/lib/controller-instance'
 
 export default function Index(): JSX.Element {
   const [isSheetOpen, setIsSheetOpen] = useState<boolean>(false)
@@ -76,16 +76,13 @@ export default function Index(): JSX.Element {
   // If a workspace is selected, we want to fetch all the projects
   // under that workspace and display it in the dashboard.
   useEffect(() => {
-    const projectController = new ProjectController(
-      process.env.NEXT_PUBLIC_BACKEND_URL
-    )
-
     async function getAllProjects() {
       if (currentWorkspace) {
-        const { success, error, data } = await projectController.getAllProjects(
-          { workspaceSlug: currentWorkspace.slug },
-          {}
-        )
+        const { success, error, data } =
+          await ControllerInstance.getInstance().projectController.getAllProjects(
+            { workspaceSlug: currentWorkspace.slug },
+            {}
+          )
 
         if (success && data) {
           setProjects(data.items)
@@ -105,16 +102,13 @@ export default function Index(): JSX.Element {
   // Function to create a new project
   const createNewProject = useCallback(async () => {
     if (currentWorkspace) {
-      const projectController = new ProjectController(
-        process.env.NEXT_PUBLIC_BACKEND_URL
-      )
-
       newProjectData.workspaceSlug = currentWorkspace.slug
 
-      const { data, error, success } = await projectController.createProject(
-        newProjectData,
-        {}
-      )
+      const { data, error, success } =
+        await ControllerInstance.getInstance().projectController.createProject(
+          newProjectData,
+          {}
+        )
 
       if (success && data) {
         setProjects([

apps/platform/src/app/(main)/project/[project]/@secret/page.tsx

@@ -5,6 +5,7 @@ import { usePathname } from 'next/navigation'
 import dayjs, { extend } from 'dayjs'
 import relativeTime from 'dayjs/plugin/relativeTime'
 import { NoteIconSVG } from '@public/svg/secret'
+import type { GetAllSecretsOfProjectResponse } from '@keyshade/schema'
 import {
   Accordion,
   AccordionContent,
@@ -19,8 +20,6 @@ import {
   TableHeader,
   TableRow
 } from '@/components/ui/table'
-import { Secrets } from '@/lib/api-functions/secrets'
-import type { Secret } from '@/types'
 import { ScrollArea } from '@/components/ui/scroll-area'
 import {
   Tooltip,
@@ -29,35 +28,45 @@ import {
   TooltipTrigger
 } from '@/components/ui/tooltip'
 import { Skeleton } from '@/components/ui/skeleton'
+import ControllerInstance from '@/lib/controller-instance'
 
 extend(relativeTime)
 
 function SecretPage(): React.JSX.Element {
-  const [allSecrets, setAllSecrets] = useState<Secret[]>()
+  const [allSecrets, setAllSecrets] =
+    useState<GetAllSecretsOfProjectResponse['items']>()
   const [isLoading, setIsLoading] = useState<boolean>(true)
   const pathname = usePathname()
 
   useEffect(() => {
     setIsLoading(true)
-    Secrets.getAllSecretbyProjectId(pathname.split('/')[2])
-      .then((data) => {
-        setAllSecrets(data)
-      })
-      .catch((error) => {
+
+    async function getAllSecretsByProjectSlug() {
+      const { success, error, data } =
+        await ControllerInstance.getInstance().secretController.getAllSecretsOfProject(
+          { projectSlug: pathname.split('/')[2] },
+          {}
+        )
+
+      if (success && data) {
+        setAllSecrets(data.items)
+      } else {
         // eslint-disable-next-line no-console -- we need to log the error
         console.error(error)
-      })
-      .finally(() => {
-        setIsLoading(false)
-      })
+      }
+    }
+
+    getAllSecretsByProjectSlug()
+
+    setIsLoading(false)
   }, [pathname])
 
   if (isLoading) {
     return (
       <div className="space-y-4">
-        <SerectLoader />
-        <SerectLoader />
-        <SerectLoader />
+        <SecretLoader />
+        <SecretLoader />
+        <SecretLoader />
       </div>
     )
   }
@@ -69,37 +78,35 @@ function SecretPage(): React.JSX.Element {
         collapsible
         type="single"
       >
-        {allSecrets?.map((secret) => {
+        {allSecrets?.map(({ secret, values }) => {
           return (
             <AccordionItem
               className="rounded-xl bg-white/5 px-5"
-              key={secret.secret.id}
-              value={secret.secret.id}
+              key={secret.id}
+              value={secret.id}
             >
               <AccordionTrigger
                 className="hover:no-underline"
                 rightChildren={
                   <div className="text-xs text-white/50">
-                    {dayjs(secret.secret.updatedAt).toNow(true)} ago by{' '}
-                    <span className="text-white">
-                      {secret.secret.lastUpdatedBy.name}
-                    </span>
+                    {dayjs(secret.updatedAt).toNow(true)} ago by{' '}
+                    <span className="text-white">{secret.lastUpdatedById}</span>
                   </div>
                 }
               >
                 <div className="flex gap-x-5">
                   <div className="flex items-center gap-x-4">
                     {/* <SecretLogoSVG /> */}
-                    {secret.secret.name}
+                    {secret.name}
                   </div>
-                  {secret.secret.note ? (
+                  {secret.note ? (
                     <TooltipProvider>
                       <Tooltip>
                         <TooltipTrigger>
                           <NoteIconSVG className="w-7" />
                         </TooltipTrigger>
                         <TooltipContent className="border-white/20 bg-white/10 text-white backdrop-blur-xl">
-                          <p>{secret.secret.note}</p>
+                          <p>{secret.note}</p>
                         </TooltipContent>
                       </Tooltip>
                     </TooltipProvider>
@@ -115,10 +122,10 @@ function SecretPage(): React.JSX.Element {
                     </TableRow>
                   </TableHeader>
                   <TableBody>
-                    {secret.values.map((value) => {
+                    {values.map((value) => {
                       return (
                         <TableRow key={value.environment.id}>
-                          <TableCell>{value.environment.name}</TableCell>
+                          <TableCell>{value.environment.slug}</TableCell>
                           <TableCell className="max-w-40 overflow-auto">
                             {value.value}
                           </TableCell>
@@ -136,7 +143,7 @@ function SecretPage(): React.JSX.Element {
   )
 }
 
-function SerectLoader(): React.JSX.Element {
+function SecretLoader(): React.JSX.Element {
   return (
     <div className=" rounded-xl bg-white/5 p-4">
       <div className="flex justify-between">

apps/platform/src/app/(main)/project/[project]/layout.tsx

@@ -2,6 +2,7 @@
 import { useEffect, useState } from 'react'
 import { useSearchParams } from 'next/navigation'
 import { AddSVG } from '@public/svg/shared'
+import type { Project } from '@keyshade/schema'
 import { Button } from '@/components/ui/button'
 import {
   Dialog,
@@ -13,8 +14,7 @@ import {
 } from '@/components/ui/dialog'
 import { Input } from '@/components/ui/input'
 import { Label } from '@/components/ui/label'
-import type { Project } from '@/types'
-import { Projects } from '@/lib/api-functions/projects'
+import ControllerInstance from '@/lib/controller-instance'
 
 interface DetailedProjectPageProps {
   params: { project: string }
@@ -38,14 +38,22 @@ function DetailedProjectPage({
   const tab = searchParams.get('tab') ?? 'rollup-details'
 
   useEffect(() => {
-    Projects.getProjectbyID(params.project)
-      .then((project) => {
-        setCurrentProject(project)
-      })
-      .catch((error) => {
+    async function getProjectBySlug() {
+      const { success, error, data } =
+        await ControllerInstance.getInstance().projectController.getProject(
+          { projectSlug: params.project },
+          {}
+        )
+
+      if (success && data) {
+        setCurrentProject(data)
+      } else {
         // eslint-disable-next-line no-console -- we need to log the error
         console.error(error)
-      })
+      }
+    }
+
+    getProjectBySlug()
   }, [params.project])
 
   return (