finishing touches

apps/platform/.eslintrc.cjs

@@ -7,24 +7,13 @@ 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-member-access': 'off',
-    '@typescript-eslint/no-unsafe-argument': 'off',
-    '@typescript-eslint/no-unnecessary-condition': 'off'
+    '@typescript-eslint/no-misused-promises': 'off'
   }
 }

apps/platform/Dockerfile

@@ -38,13 +38,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 type { Secret } from '@keyshade/schema'
-import { SecretController } from '@keyshade/api-client'
 import { ScrollArea } from '@/components/ui/scroll-area'
 import {
   Tooltip,
@@ -29,31 +28,28 @@ 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)
 
-    const secretController = new SecretController(
-      process.env.NEXT_PUBLIC_BACKEND_URL
-    )
-
     async function getAllSecretsByProjectSlug() {
       const { success, error, data } =
-        await secretController.getAllSecretsOfProject(
+        await ControllerInstance.getInstance().secretController.getAllSecretsOfProject(
           { projectSlug: pathname.split('/')[2] },
           {}
         )
 
       if (success && data) {
-        //@ts-ignore
-        setAllSecrets(data)
+        setAllSecrets(data.items)
       } else {
         // eslint-disable-next-line no-console -- we need to log the error
         console.error(error)
@@ -68,9 +64,9 @@ function SecretPage(): React.JSX.Element {
   if (isLoading) {
     return (
       <div className="space-y-4">
-        <SerectLoader />
-        <SerectLoader />
-        <SerectLoader />
+        <SecretLoader />
+        <SecretLoader />
+        <SecretLoader />
       </div>
     )
   }
@@ -82,7 +78,7 @@ 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"
@@ -126,7 +122,7 @@ function SecretPage(): React.JSX.Element {
                     </TableRow>
                   </TableHeader>
                   <TableBody>
-                    {secret.versions.map((value) => {
+                    {values.map((value) => {
                       return (
                         <TableRow key={value.environment.id}>
                           <TableCell>{value.environment.slug}</TableCell>
@@ -147,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 { ProjectController } from '@keyshade/api-client'
-import type { Project } from '@keyshade/schema'
+import ControllerInstance from '@/lib/controller-instance'
 
 interface DetailedProjectPageProps {
   params: { project: string }
@@ -38,29 +38,22 @@ function DetailedProjectPage({
   const tab = searchParams.get('tab') ?? 'rollup-details'
 
   useEffect(() => {
+    async function getProjectBySlug() {
+      const { success, error, data } =
+        await ControllerInstance.getInstance().projectController.getProject(
+          { projectSlug: params.project },
+          {}
+        )
 
-    const projectController = new ProjectController(
-      process.env.NEXT_PUBLIC_BACKEND_URL
-    )
-
-    async function getProjectBySlug(){
-      const {success, error, data} = await projectController.getProject(
-        {projectSlug: params.project},
-        {}
-      )
-
-      if( success && data ){
-        //@ts-ignore
+      if (success && data) {
         setCurrentProject(data)
-      }
-      else{
+      } else {
         // eslint-disable-next-line no-console -- we need to log the error
         console.error(error)
       }
     }
 
     getProjectBySlug()
-
   }, [params.project])
 
   return (

apps/platform/src/app/(main)/settings/@profile/page.tsx

@@ -1,54 +1,52 @@
 'use client'
-import React, { useEffect, useState } from 'react'
+import React, { useCallback, useEffect, useState } from 'react'
 import { toast } from 'sonner'
-import type { User } from '@keyshade/schema'
 import InputLoading from './loading'
 import { Input } from '@/components/ui/input'
 import { Separator } from '@/components/ui/separator'
+import ControllerInstance from '@/lib/controller-instance'
 import { Button } from '@/components/ui/button'
-import { apiClient } from '@/lib/api-client'
-
-type UserData = Omit<
-  User,
-  'id' | 'isActive' | 'isOnboardingFinished' | 'isAdmin' | 'authProvider'
->
-async function getUserDetails(): Promise<User | undefined> {
-  try {
-    return await apiClient.get<User>('/user')
-  } catch (error) {
-    // eslint-disable-next-line no-console -- we need to log the error
-    console.error(error)
-  }
-}
-
-async function updateUserDetails(userData: UserData): Promise<void> {
-  try {
-    await apiClient.put<User>('/user', userData)
-  } catch (error) {
-    // eslint-disable-next-line no-console -- we need to log the error
-    console.error(error)
-  }
-}
 
 function ProfilePage(): React.JSX.Element {
   const [isLoading, setIsLoading] = useState<boolean>(true)
-  const [userData, setUserData] = useState<UserData>({
+  const [userData, setUserData] = useState({
     email: '',
     name: '',
     profilePictureUrl: ''
   })
   const [isModified, setIsModified] = useState<boolean>(false)
 
+  const updateSelf = useCallback(async () => {
+    try {
+      await ControllerInstance.getInstance().userController.updateSelf(
+        {
+          name: userData.name,
+          email: userData.email
+        },
+        {}
+      )
+      toast.success('Profile updated successfully')
+    } catch (error) {
+      // eslint-disable-next-line no-console -- we need to log the error
+      console.error(error)
+    }
+    setIsModified(false)
+  }, [userData])
+
   useEffect(() => {
-    getUserDetails()
-      .then((data) => {
-        if (data) {
+    ControllerInstance.getInstance()
+      .userController.getSelf()
+      .then(({ data, success, error }) => {
+        if (success && data) {
           setUserData({
             email: data.email,
-            name: data.name ?? '',
-            profilePictureUrl: data.profilePictureUrl
+            name: data.name,
+            profilePictureUrl: data.profilePictureUrl || ''
           })
           setIsLoading(false)
+        } else {
+          // eslint-disable-next-line no-console -- we need to log the error
+          console.error(error)
         }
       })
       .catch((error) => {
@@ -67,7 +65,7 @@ function ProfilePage(): React.JSX.Element {
             Upload a picture to change your avatar across Keyshade.
           </span>
         </div>
-        <div className="aspect-square w-[5rem] rounded-full bg-gray-600" />{' '}
+        <div className="aspect-square w-[5rem] rounded-full bg-gray-600" />
         {/* //! This is will be replaced by an image tag */}
       </div>
       {/* Name */}
@@ -87,7 +85,7 @@ function ProfilePage(): React.JSX.Element {
               setUserData((prev) => ({ ...prev, name: e.target.value }))
             }}
             placeholder="name"
-            value={userData.name ?? ''}
+            value={userData.name || ''}
           />
         )}
       </div>
@@ -114,20 +112,7 @@ function ProfilePage(): React.JSX.Element {
         )}
       </div>
       <div>
-        <Button
-          disabled={!isModified}
-          onClick={() => {
-            updateUserDetails(userData)
-              .then(() => {
-                toast.success('User details updated successfully')
-              })
-              .catch(() => {
-                toast.error('Failed to update user details')
-              })
-            setIsModified(false)
-          }}
-          variant="secondary"
-        >
+        <Button disabled={!isModified} onClick={updateSelf} variant="secondary">
           Save Changes
         </Button>
       </div>

apps/platform/src/components/shared/navbar/index.tsx

@@ -34,7 +34,7 @@ async function fetchNameImage(): Promise<UserNameImage | undefined> {
     )
     const data: User = (await response.json()) as User
     return {
-      name: data.name?.split(' ')[0] ?? data.email.split('@')[0],
+      name: data.name.split(' ')[0] ?? data.email.split('@')[0],
       image: data.profilePictureUrl
     }
   } catch (error) {

apps/platform/src/components/shared/sidebar/index.tsx

@@ -6,8 +6,8 @@ import {
   SettingsSVG,
   TeamSVG
 } from '@public/svg/shared'
-import { Combobox } from '@/components/ui/combobox'
 import SidebarTab from './sidebarTab'
+import { Combobox } from '@/components/ui/combobox'
 
 function Sidebar(): JSX.Element {
   const sidebarTabData = [