feat: resolved eslint issues and seperated org layout to make it simple

frontend-v2/eslint.config.js

@@ -50,6 +50,7 @@ export default tseslint.config(
     rules: {
       ...reactHooks.configs.recommended.rules,
       "react-refresh/only-export-components": "off",
+      "@typescript-eslint/only-throw-error": "off",
       "@typescript-eslint/no-empty-function": "off",
       quotes: ["error", "double", { avoidEscape: true }],
       "comma-dangle": ["error", "only-multiline"],

frontend-v2/src/components/navigation/NavHeader.tsx

@@ -3,7 +3,7 @@ import { ParsedUrlQuery } from "querystring";
 import { useState } from "react";
 import { faAngleRight, faCheck, faCopy, faLock } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { Link, useLocation, useNavigate } from "@tanstack/react-router";
+import { Link, useNavigate } from "@tanstack/react-router";
 import { twMerge } from "tailwind-merge";
 
 import { useOrganization, useWorkspace } from "@app/context";

frontend-v2/src/components/projects/NewProjectModal.tsx

@@ -1,9 +1,9 @@
 import { FC, useEffect } from "react";
 import { Controller, useForm } from "react-hook-form";
-import { useRouter } from "next/router";
 import { faInfoCircle } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { zodResolver } from "@hookform/resolvers/zod";
+import { useNavigate } from "@tanstack/react-router";
 import z from "zod";
 
 import { createNotification } from "@app/components/notifications";
@@ -32,6 +32,7 @@ import {
   useSubscription,
   useUser
 } from "@app/context";
+import { getProjectHomePage } from "@app/helpers/project";
 import {
   fetchOrgUsers,
   useAddUserToWsNonE2EE,
@@ -41,6 +42,7 @@ import {
 } from "@app/hooks/api";
 import { INTERNAL_KMS_KEY_ID } from "@app/hooks/api/kms/types";
 import { InfisicalProjectTemplate, useListProjectTemplates } from "@app/hooks/api/projectTemplates";
+import { ProjectType } from "@app/hooks/api/workspace/types";
 
 const formSchema = z.object({
   name: z.string().trim().min(1, "Required").max(64, "Too long, maximum length is 64 characters"),
@@ -59,12 +61,13 @@ type TAddProjectFormData = z.infer<typeof formSchema>;
 interface NewProjectModalProps {
   isOpen: boolean;
   onOpenChange: (isOpen: boolean) => void;
+  projectType: ProjectType;
 }
 
-type NewProjectFormProps = Pick<NewProjectModalProps, "onOpenChange">;
+type NewProjectFormProps = Pick<NewProjectModalProps, "onOpenChange" | "projectType">;
 
-const NewProjectForm = ({ onOpenChange }: NewProjectFormProps) => {
-  const router = useRouter();
+const NewProjectForm = ({ onOpenChange, projectType }: NewProjectFormProps) => {
+  const navigate = useNavigate();
   const { currentOrg } = useOrganization();
   const { permission } = useOrgPermission();
   const { user } = useUser();
@@ -82,7 +85,7 @@ const NewProjectForm = ({ onOpenChange }: NewProjectFormProps) => {
     enabled: Boolean(canReadProjectTemplates && subscription?.projectTemplates)
   });
 
-  const { data: externalKmsList } = useGetExternalKmsList(currentOrg?.id!, {
+  const { data: externalKmsList } = useGetExternalKmsList(currentOrg.id, {
     enabled: permission.can(OrgPermissionActions.Read, OrgPermissionSubjects.Kms)
   });
 
@@ -117,15 +120,15 @@ const NewProjectForm = ({ onOpenChange }: NewProjectFormProps) => {
     if (!user) return;
     try {
       const {
-        data: {
-          project: { id: newProjectId }
-        }
+        data: { project }
       } = await createWs.mutateAsync({
         projectName: name,
         projectDescription: description,
         kmsKeyId: kmsKeyId !== INTERNAL_KMS_KEY_ID ? kmsKeyId : undefined,
-        template
+        template,
+        type: projectType
       });
+      const { id: newProjectId } = project;
 
       if (addMembers) {
         const orgUsers = await fetchOrgUsers(currentOrg.id);
@@ -145,7 +148,8 @@ const NewProjectForm = ({ onOpenChange }: NewProjectFormProps) => {
       createNotification({ text: "Project created", type: "success" });
       reset();
       onOpenChange(false);
-      router.push(`/project/${newProjectId}/secrets/overview`);
+      // TODO(rbr): make this return constant so this gets typed
+      navigate({ to: getProjectHomePage(project) });
     } catch (err) {
       console.error(err);
       createNotification({ text: "Failed to create project", type: "error" });
@@ -316,14 +320,18 @@ const NewProjectForm = ({ onOpenChange }: NewProjectFormProps) => {
   );
 };
 
-export const NewProjectModal: FC<NewProjectModalProps> = ({ isOpen, onOpenChange }) => {
+export const NewProjectModal: FC<NewProjectModalProps> = ({
+  isOpen,
+  onOpenChange,
+  projectType
+}) => {
   return (
     <Modal isOpen={isOpen} onOpenChange={onOpenChange}>
       <ModalContent
         title="Create a new project"
         subTitle="This project will contain your secrets and configurations."
       >
-        <NewProjectForm onOpenChange={onOpenChange} />
+        <NewProjectForm onOpenChange={onOpenChange} projectType={projectType} />
       </ModalContent>
     </Modal>
   );

frontend-v2/src/components/utilities/cryptography/crypto.ts

@@ -1,3 +1,5 @@
+// @ts-expect-error to avoid wasm dependencies
+// eslint-disable-next-line
 import argon2 from "argon2-browser/dist/argon2-bundled.min.js";
 import nacl from "tweetnacl";
 import { decodeBase64, decodeUTF8, encodeBase64, encodeUTF8 } from "tweetnacl-util";
@@ -148,7 +150,7 @@ const decryptAssymmetric = ({
     decodeBase64(privateKey)
   );
 
-  return encodeUTF8(plaintext);
+  return encodeUTF8(plaintext!);
 };
 
 type EncryptSymmetricProps = {

frontend-v2/src/components/utilities/cryptography/issueBackupKey.ts

@@ -73,7 +73,7 @@ const issueBackupKey = async ({
           },
           async () => {
             clientKey.createVerifier(
-              async (err: any, result: { salt: string; verifier: string }) => {
+              async (_err: any, result: { salt: string; verifier: string }) => {
                 const { ciphertext, iv, tag } = Aes256Gcm.encrypt({
                   text: String(localStorage.getItem("PRIVATE_KEY")),
                   secret: generatedKey
@@ -104,7 +104,7 @@ const issueBackupKey = async ({
         );
       }
     );
-  } catch (error) {
+  } catch {
     setBackupKeyError(true);
     console.log("Failed to issue a backup key");
   }

frontend-v2/src/components/utilities/secrets/checkOverrides.ts

@@ -1,34 +0,0 @@
-import { SecretDataProps } from "public/data/frequentInterfaces";
-
-import { SecretType } from "@app/hooks/api/types";
-
-/**
- * This function downloads the secrets as a .env file
- * @param {object} obj
- * @param {SecretDataProps[]} obj.data - secrets that we want to check for overrides
- * @returns
- */
-const checkOverrides = async ({ data }: { data: SecretDataProps[] }) => {
-  let secrets: SecretDataProps[] = data!.map((secret) => Object.create(secret));
-  const overridenSecrets = data!.filter((secret) =>
-    secret.valueOverride === undefined || secret?.value !== secret?.valueOverride
-      ? SecretType.Shared
-      : SecretType.Personal
-  );
-  if (overridenSecrets.length) {
-    overridenSecrets.forEach((secret) => {
-      const index = secrets!.findIndex(
-        (_secret) =>
-          _secret.key === secret.key &&
-          (secret.valueOverride === undefined || secret?.value !== secret?.valueOverride)
-      );
-      secrets![index].value = secret.value;
-    });
-    secrets = secrets!.filter(
-      (secret) => secret.valueOverride === undefined || secret?.value !== secret?.valueOverride
-    );
-  }
-  return secrets;
-};
-
-export default checkOverrides;

frontend-v2/src/components/utilities/secrets/downloadDotEnv.ts

@@ -1,37 +0,0 @@
-import { SecretDataProps } from "public/data/frequentInterfaces";
-
-import checkOverrides from "./checkOverrides";
-
-/**
- * This function downloads the secrets as a .env file
- * @param {object} obj
- * @param {SecretDataProps[]} obj.data - secrets that we want to download
- * @param {string} obj.env - the environment which we're downloading (used for naming the file)
- */
-const downloadDotEnv = async ({ data, env }: { data: SecretDataProps[]; env: string }) => {
-  if (!data) return;
-  const secrets = await checkOverrides({ data });
-
-  const file = secrets!
-    .map(
-      (item: SecretDataProps) =>
-        `${
-          item.comment
-            ? `${item.comment
-                .split("\n")
-                .map((comment) => "# ".concat(comment))
-                .join("\n")}\n`
-            : ""
-        }${[item.key, item.value].join("=")}`
-    )
-    .join("\n");
-
-  const blob = new Blob([file]);
-  const fileDownloadUrl = URL.createObjectURL(blob);
-  const alink = document.createElement("a");
-  alink.href = fileDownloadUrl;
-  alink.download = `${env}.env`;
-  alink.click();
-};
-
-export default downloadDotEnv;

frontend-v2/src/components/utilities/secrets/downloadYaml.ts

@@ -1,43 +0,0 @@
-// import YAML from 'yaml';
-// import { YAMLSeq } from 'yaml/types';
-
-import { SecretDataProps } from "public/data/frequentInterfaces";
-
-// import { envMapping } from "../../../public/data/frequentConstants";
-// import checkOverrides from './checkOverrides';
-
-/**
- * This function downloads the secrets as a .yml file
- * @param {object} obj
- * @param {SecretDataProps[]} obj.data - secrets that we want to download
- * @param {string} obj.env - used for naming the file
- * @returns
- */
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-const downloadYaml = async ({ data, env }: { data: SecretDataProps[]; env: string }) => {
-  // if (!data) return;
-  // const doc = new YAML.Document();
-  // doc.contents = new YAMLSeq();
-  // const secrets = await checkOverrides({ data });
-  // secrets.forEach((secret) => {
-  //   const pair = YAML.createNode({ [secret.key]: secret.value });
-  //   pair.commentBefore = secret.comment
-  //     .split('\n')
-  //     .map((line) => (line ? ' '.concat(line) : ''))
-  //     .join('\n');
-  //   doc.add(pair);
-  // });
-  // const file = doc
-  //   .toString()
-  //   .split('\n')
-  //   .map((line) => (line.startsWith('-') ? line.replace('- ', '') : line))
-  //   .join('\n');
-  // const blob = new Blob([file]);
-  // const fileDownloadUrl = URL.createObjectURL(blob);
-  // const alink = document.createElement('a');
-  // alink.href = fileDownloadUrl;
-  // alink.download = envMapping[env] + '.yml';
-  // alink.click();
-};
-
-export default downloadYaml;

frontend-v2/src/components/utilities/secrets/encryptSecrets.ts

@@ -1,39 +0,0 @@
-import { SecretDataProps } from "public/data/frequentInterfaces";
-/**
- * Encypt secrets before pushing the to the DB
- * @param {object} obj
- * @param {object} obj.secretsToEncrypt - secrets that we want to encrypt
- * @param {object} obj.workspaceId - the id of a project in which we are encrypting secrets
- * @returns
- */
-const encryptSecrets = async ({
-  secretsToEncrypt,
-  env
-}: {
-  secretsToEncrypt: SecretDataProps[];
-  workspaceId: string;
-  env: string;
-}) => {
-  let secrets;
-  try {
-    secrets = secretsToEncrypt.map((secret) => {
-      const result = {
-        id: secret.id,
-        createdAt: "",
-        environment: env,
-        secretKey: secret.key,
-        secretValue: secret.value,
-        secretComment: secret.comment,
-        tags: secret.tags
-      };
-
-      return result;
-    });
-  } catch (error) {
-    console.log("Error while encrypting secrets");
-  }
-
-  return secrets;
-};
-
-export default encryptSecrets;

frontend-v2/src/context/OrganizationContext/OrganizationContext.tsx

@@ -1,8 +1,8 @@
 import { createContext, ReactNode, useContext, useMemo } from "react";
+import { useRouteContext } from "@tanstack/react-router";
 
 import { useGetOrganizations } from "@app/hooks/api";
 import { Organization } from "@app/hooks/api/types";
-import { useRouteContext } from "@tanstack/react-router";
 
 type TOrgContext = {
   orgs?: Organization[];

frontend-v2/src/context/SubscriptionContext/SubscriptionContext.tsx

@@ -1,10 +1,10 @@
 import { createContext, ReactNode, useContext, useMemo } from "react";
+import { useRouteContext } from "@tanstack/react-router";
 
 import { useGetOrgSubscription } from "@app/hooks/api";
 import { SubscriptionPlan } from "@app/hooks/api/types";
 
 import { useOrganization } from "../OrganizationContext";
-import { useRouteContext } from "@tanstack/react-router";
 
 type TSubscriptionContext = {
   subscription?: SubscriptionPlan;

frontend-v2/src/context/UserContext/UserContext.tsx

@@ -1,8 +1,8 @@
 import { createContext, ReactNode, useContext, useMemo } from "react";
+import { useRouteContext } from "@tanstack/react-router";
 
 import { useGetUser } from "@app/hooks/api";
 import { User, UserEnc } from "@app/hooks/api/types";
-import { useRouteContext } from "@tanstack/react-router";
 
 type TUserContext = {
   user: User & UserEnc;

frontend-v2/src/helpers/key.ts

@@ -74,7 +74,7 @@ const decryptPrivateKeyHelper = async ({
     } else {
       throw new Error("Insufficient details to decrypt private key");
     }
-  } catch (err) {
+  } catch {
     throw new Error("Failed to decrypt private key");
   }
 

frontend-v2/src/helpers/project.ts

@@ -1,5 +1,6 @@
 import { apiRequest } from "@app/config/request";
 import { createWorkspace } from "@app/hooks/api/workspace/queries";
+import { ProjectType, Workspace } from "@app/hooks/api/workspace/types";
 
 const secretsToBeAdded = [
   {
@@ -36,12 +37,13 @@ const secretsToBeAdded = [
  * Create and initialize a new project in organization with id [organizationId]
  * Note: current user should be a member of the organization
  */
-const initProjectHelper = async ({ projectName }: { projectName: string }) => {
+export const initProjectHelper = async ({ projectName }: { projectName: string }) => {
   // create new project
   const {
     data: { project }
   } = await createWorkspace({
-    projectName
+    projectName,
+    type: ProjectType.SecretManager
   });
 
   try {
@@ -59,4 +61,22 @@ const initProjectHelper = async ({ projectName }: { projectName: string }) => {
   return project;
 };
 
-export { initProjectHelper };
+export const getProjectHomePage = (workspace: Workspace) => {
+  if (workspace.type === ProjectType.SecretManager) {
+    return `/${workspace.type}/${workspace.id}/secrets/overview`;
+  }
+  if (workspace.type === ProjectType.CertificateManager) {
+    return `/${workspace.type}/${workspace.id}/certificates`;
+  }
+
+  return `/${workspace.type}/${workspace.id}/kms`;
+};
+
+export const getProjectTitle = (type: ProjectType) => {
+  const titleConvert = {
+    [ProjectType.SecretManager]: "Secret Management",
+    [ProjectType.KMS]: "Key Management",
+    [ProjectType.CertificateManager]: "Cert Management"
+  };
+  return titleConvert[type];
+};

frontend-v2/src/hooks/api/accessApproval/mutation.tsx

@@ -15,7 +15,7 @@ import {
 export const useCreateAccessApprovalPolicy = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TCreateAccessPolicyDTO>({
+  return useMutation<object, object, TCreateAccessPolicyDTO>({
     mutationFn: async ({
       environment,
       projectSlug,
@@ -45,7 +45,7 @@ export const useCreateAccessApprovalPolicy = () => {
 export const useUpdateAccessApprovalPolicy = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TUpdateAccessPolicyDTO>({
+  return useMutation<object, object, TUpdateAccessPolicyDTO>({
     mutationFn: async ({ id, approvers, approvals, name, secretPath, enforcementLevel }) => {
       const { data } = await apiRequest.patch(`/api/v1/access-approvals/policies/${id}`, {
         approvals,
@@ -65,7 +65,7 @@ export const useUpdateAccessApprovalPolicy = () => {
 export const useDeleteAccessApprovalPolicy = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TDeleteSecretPolicyDTO>({
+  return useMutation<object, object, TDeleteSecretPolicyDTO>({
     mutationFn: async ({ id }) => {
       const { data } = await apiRequest.delete(`/api/v1/access-approvals/policies/${id}`);
       return data;
@@ -78,7 +78,7 @@ export const useDeleteAccessApprovalPolicy = () => {
 
 export const useCreateAccessRequest = () => {
   const queryClient = useQueryClient();
-  return useMutation<{}, {}, TCreateAccessRequestDTO>({
+  return useMutation<object, object, TCreateAccessRequestDTO>({
     mutationFn: async ({ projectSlug, ...request }) => {
       const { data } = await apiRequest.post<TAccessApproval>(
         "/api/v1/access-approvals/requests",
@@ -104,8 +104,8 @@ export const useCreateAccessRequest = () => {
 export const useReviewAccessRequest = () => {
   const queryClient = useQueryClient();
   return useMutation<
-    {},
-    {},
+    object,
+    object,
     {
       requestId: string;
       status: "approved" | "rejected";

frontend-v2/src/hooks/api/admin/mutation.ts

@@ -18,7 +18,7 @@ export const useCreateAdminUser = () => {
 
   return useMutation<
     { user: User; token: string; organization: { id: string } },
-    {},
+    object,
     TCreateAdminUserDTO
   >({
     mutationFn: async (opt) => {
@@ -36,7 +36,7 @@ export const useUpdateServerConfig = () => {
 
   return useMutation<
     TServerConfig,
-    {},
+    object,
     Partial<TServerConfig & { slackClientId: string; slackClientSecret: string }>
   >({
     mutationFn: async (opt) => {
@@ -72,7 +72,7 @@ export const useAdminDeleteUser = () => {
 
 export const useUpdateAdminSlackConfig = () => {
   const queryClient = useQueryClient();
-  return useMutation<AdminSlackConfig, {}, TUpdateAdminSlackConfigDTO>({
+  return useMutation<AdminSlackConfig, object, TUpdateAdminSlackConfigDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.put<AdminSlackConfig>(
         "/api/v1/admin/integrations/slack/config",

frontend-v2/src/hooks/api/apiKeys/queries.tsx

@@ -13,7 +13,7 @@ import {
 
 export const useCreateAPIKeyV2 = () => {
   const queryClient = useQueryClient();
-  return useMutation<CreateServiceTokenDataV3Res, {}, CreateAPIKeyDataV2DTO>({
+  return useMutation<CreateServiceTokenDataV3Res, object, CreateAPIKeyDataV2DTO>({
     mutationFn: async ({ name }) => {
       const { data } = await apiRequest.post("/api/v3/api-key", {
         name
@@ -29,7 +29,7 @@ export const useCreateAPIKeyV2 = () => {
 
 export const useUpdateAPIKeyV2 = () => {
   const queryClient = useQueryClient();
-  return useMutation<APIKeyDataV2, {}, UpdateAPIKeyDataV2DTO>({
+  return useMutation<APIKeyDataV2, object, UpdateAPIKeyDataV2DTO>({
     mutationFn: async ({ apiKeyDataId, name }) => {
       const {
         data: { apiKeyData }
@@ -46,7 +46,7 @@ export const useUpdateAPIKeyV2 = () => {
 
 export const useDeleteAPIKeyV2 = () => {
   const queryClient = useQueryClient();
-  return useMutation<APIKeyDataV2, {}, DeleteAPIKeyDataV2DTO>({
+  return useMutation<APIKeyDataV2, object, DeleteAPIKeyDataV2DTO>({
     mutationFn: async ({ apiKeyDataId }) => {
       const {
         data: { apiKeyData }

frontend-v2/src/hooks/api/auditLogStreams/mutations.tsx

@@ -13,7 +13,7 @@ import {
 export const useCreateAuditLogStream = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{ auditLogStream: TAuditLogStream }, {}, TCreateAuditLogStreamDTO>({
+  return useMutation<{ auditLogStream: TAuditLogStream }, object, TCreateAuditLogStreamDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.post<{ auditLogStream: TAuditLogStream }>(
         "/api/v1/audit-log-streams",
@@ -30,7 +30,7 @@ export const useCreateAuditLogStream = () => {
 export const useUpdateAuditLogStream = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{ auditLogStream: TAuditLogStream }, {}, TUpdateAuditLogStreamDTO>({
+  return useMutation<{ auditLogStream: TAuditLogStream }, object, TUpdateAuditLogStreamDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.patch<{ auditLogStream: TAuditLogStream }>(
         `/api/v1/audit-log-streams/${dto.id}`,
@@ -47,7 +47,7 @@ export const useUpdateAuditLogStream = () => {
 export const useDeleteAuditLogStream = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{ auditLogStream: TAuditLogStream }, {}, TDeleteAuditLogStreamDTO>({
+  return useMutation<{ auditLogStream: TAuditLogStream }, object, TDeleteAuditLogStreamDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.delete<{ auditLogStream: TAuditLogStream }>(
         `/api/v1/audit-log-streams/${dto.id}`

frontend-v2/src/hooks/api/auditLogs/types.tsx

@@ -45,10 +45,9 @@ export interface IdentityActor {
   metadata: IdentityActorMetadata;
 }
 
-export interface PlatformActorMetadata {}
 export interface PlatformActor {
   type: ActorType.PLATFORM;
-  metadata: PlatformActorMetadata;
+  metadata: object;
 }
 
 export type Actor = UserActor | ServiceActor | IdentityActor | PlatformActor;

frontend-v2/src/hooks/api/auth/queries.tsx

@@ -148,7 +148,7 @@ export const useCompleteAccountSignup = () => {
 };
 
 export const useSendMfaToken = () => {
-  return useMutation<{}, {}, SendMfaTokenDTO>({
+  return useMutation<object, object, SendMfaTokenDTO>({
     mutationFn: async ({ email }) => {
       const { data } = await apiRequest.post("/api/v2/auth/mfa/send", { email });
       return data;
@@ -175,7 +175,7 @@ export const verifyMfaToken = async ({
 };
 
 export const useVerifyMfaToken = () => {
-  return useMutation<VerifyMfaTokenRes, {}, VerifyMfaTokenDTO>({
+  return useMutation<VerifyMfaTokenRes, object, VerifyMfaTokenDTO>({
     mutationFn: async ({ email, mfaCode, mfaMethod }) => {
       return verifyMfaToken({
         email,

frontend-v2/src/hooks/api/bots/queries.tsx

@@ -23,7 +23,7 @@ export const useGetWorkspaceBot = (workspaceId: string) =>
 export const useUpdateBotActiveStatus = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TSetBotActiveStatusDto>({
+  return useMutation<object, object, TSetBotActiveStatusDto>({
     mutationFn: ({ botId, isActive, botKey }) => {
       return apiRequest.patch(`/api/v1/bot/${botId}/active`, {
         isActive,

frontend-v2/src/hooks/api/ca/mutations.tsx

@@ -21,7 +21,7 @@ import {
 
 export const useCreateCa = () => {
   const queryClient = useQueryClient();
-  return useMutation<TCertificateAuthority, {}, TCreateCaDTO>({
+  return useMutation<TCertificateAuthority, object, TCreateCaDTO>({
     mutationFn: async (body) => {
       const {
         data: { ca }
@@ -36,7 +36,7 @@ export const useCreateCa = () => {
 
 export const useUpdateCa = () => {
   const queryClient = useQueryClient();
-  return useMutation<TCertificateAuthority, {}, TUpdateCaDTO>({
+  return useMutation<TCertificateAuthority, object, TUpdateCaDTO>({
     mutationFn: async ({ caId, projectSlug, ...body }) => {
       const {
         data: { ca }
@@ -52,7 +52,7 @@ export const useUpdateCa = () => {
 
 export const useDeleteCa = () => {
   const queryClient = useQueryClient();
-  return useMutation<TCertificateAuthority, {}, TDeleteCaDTO>({
+  return useMutation<TCertificateAuthority, object, TDeleteCaDTO>({
     mutationFn: async ({ caId }) => {
       const {
         data: { ca }
@@ -67,7 +67,7 @@ export const useDeleteCa = () => {
 
 export const useSignIntermediate = () => {
   // TODO: consider renaming
-  return useMutation<TSignIntermediateResponse, {}, TSignIntermediateDTO>({
+  return useMutation<TSignIntermediateResponse, object, TSignIntermediateDTO>({
     mutationFn: async (body) => {
       const { data } = await apiRequest.post<TSignIntermediateResponse>(
         `/api/v1/pki/ca/${body.caId}/sign-intermediate`,
@@ -80,7 +80,7 @@ export const useSignIntermediate = () => {
 
 export const useImportCaCertificate = () => {
   const queryClient = useQueryClient();
-  return useMutation<TImportCaCertificateResponse, {}, TImportCaCertificateDTO>({
+  return useMutation<TImportCaCertificateResponse, object, TImportCaCertificateDTO>({
     mutationFn: async ({ caId, ...body }) => {
       const { data } = await apiRequest.post<TImportCaCertificateResponse>(
         `/api/v1/pki/ca/${caId}/import-certificate`,
@@ -99,7 +99,7 @@ export const useImportCaCertificate = () => {
 // consider rename to issue certificate
 export const useCreateCertificate = () => {
   const queryClient = useQueryClient();
-  return useMutation<TCreateCertificateResponse, {}, TCreateCertificateDTO>({
+  return useMutation<TCreateCertificateResponse, object, TCreateCertificateDTO>({
     mutationFn: async (body) => {
       const { data } = await apiRequest.post<TCreateCertificateResponse>(
         "/api/v1/pki/certificates/issue-certificate",
@@ -115,7 +115,7 @@ export const useCreateCertificate = () => {
 
 export const useRenewCa = () => {
   const queryClient = useQueryClient();
-  return useMutation<TRenewCaResponse, {}, TRenewCaDTO>({
+  return useMutation<TRenewCaResponse, object, TRenewCaDTO>({
     mutationFn: async (body) => {
       const { data } = await apiRequest.post<TRenewCaResponse>(
         `/api/v1/pki/ca/${body.caId}/renew`,

frontend-v2/src/hooks/api/certificateTemplates/mutations.tsx

@@ -16,7 +16,7 @@ import {
 
 export const useCreateCertTemplate = () => {
   const queryClient = useQueryClient();
-  return useMutation<TCertificateTemplate, {}, TCreateCertificateTemplateDTO>({
+  return useMutation<TCertificateTemplate, object, TCreateCertificateTemplateDTO>({
     mutationFn: async (data) => {
       const { data: certificateTemplate } = await apiRequest.post<TCertificateTemplate>(
         "/api/v1/pki/certificate-templates",
@@ -33,7 +33,7 @@ export const useCreateCertTemplate = () => {
 
 export const useUpdateCertTemplate = () => {
   const queryClient = useQueryClient();
-  return useMutation<TCertificateTemplate, {}, TUpdateCertificateTemplateDTO>({
+  return useMutation<TCertificateTemplate, object, TUpdateCertificateTemplateDTO>({
     mutationFn: async (data) => {
       const { data: certificateTemplate } = await apiRequest.patch<TCertificateTemplate>(
         `/api/v1/pki/certificate-templates/${data.id}`,
@@ -52,7 +52,7 @@ export const useUpdateCertTemplate = () => {
 
 export const useDeleteCertTemplate = () => {
   const queryClient = useQueryClient();
-  return useMutation<TCertificateTemplate, {}, TDeleteCertificateTemplateDTO>({
+  return useMutation<TCertificateTemplate, object, TDeleteCertificateTemplateDTO>({
     mutationFn: async (data) => {
       const { data: certificateTemplate } = await apiRequest.delete<TCertificateTemplate>(
         `/api/v1/pki/certificate-templates/${data.id}`
@@ -69,7 +69,7 @@ export const useDeleteCertTemplate = () => {
 
 export const useCreateEstConfig = () => {
   const queryClient = useQueryClient();
-  return useMutation<{}, {}, TCreateEstConfigDTO>({
+  return useMutation<object, object, TCreateEstConfigDTO>({
     mutationFn: async (body) => {
       const { data } = await apiRequest.post(
         `/api/v1/pki/certificate-templates/${body.certificateTemplateId}/est-config`,
@@ -85,7 +85,7 @@ export const useCreateEstConfig = () => {
 
 export const useUpdateEstConfig = () => {
   const queryClient = useQueryClient();
-  return useMutation<{}, {}, TUpdateEstConfigDTO>({
+  return useMutation<object, object, TUpdateEstConfigDTO>({
     mutationFn: async (body) => {
       const { data } = await apiRequest.patch(
         `/api/v1/pki/certificate-templates/${body.certificateTemplateId}/est-config`,

frontend-v2/src/hooks/api/certificates/mutations.tsx

@@ -7,7 +7,7 @@ import { TCertificate, TDeleteCertDTO, TRevokeCertDTO } from "./types";
 
 export const useDeleteCert = () => {
   const queryClient = useQueryClient();
-  return useMutation<TCertificate, {}, TDeleteCertDTO>({
+  return useMutation<TCertificate, object, TDeleteCertDTO>({
     mutationFn: async ({ serialNumber }) => {
       const {
         data: { certificate }
@@ -24,7 +24,7 @@ export const useDeleteCert = () => {
 
 export const useRevokeCert = () => {
   const queryClient = useQueryClient();
-  return useMutation<TCertificate, {}, TRevokeCertDTO>({
+  return useMutation<TCertificate, object, TRevokeCertDTO>({
     mutationFn: async ({ serialNumber, revocationReason }) => {
       const {
         data: { certificate }

frontend-v2/src/hooks/api/dynamicSecret/mutation.ts

@@ -14,7 +14,7 @@ import {
 export const useCreateDynamicSecret = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TCreateDynamicSecretDTO>({
+  return useMutation<object, object, TCreateDynamicSecretDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.post<{ dynamicSecret: TDynamicSecret }>(
         "/api/v1/dynamic-secrets",
@@ -33,7 +33,7 @@ export const useCreateDynamicSecret = () => {
 export const useUpdateDynamicSecret = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TUpdateDynamicSecretDTO>({
+  return useMutation<object, object, TUpdateDynamicSecretDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.patch<{ dynamicSecret: TDynamicSecret }>(
         `/api/v1/dynamic-secrets/${dto.name}`,
@@ -52,7 +52,7 @@ export const useUpdateDynamicSecret = () => {
 export const useDeleteDynamicSecret = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TDeleteDynamicSecretDTO>({
+  return useMutation<object, object, TDeleteDynamicSecretDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.delete<{ dynamicSecret: TDynamicSecret }>(
         `/api/v1/dynamic-secrets/${dto.name}`,

frontend-v2/src/hooks/api/dynamicSecretLease/mutation.ts

@@ -15,7 +15,7 @@ export const useCreateDynamicSecretLease = () => {
 
   return useMutation<
     { lease: TDynamicSecretLease; data: unknown },
-    {},
+    object,
     TCreateDynamicSecretLeaseDTO
   >({
     mutationFn: async (dto) => {
@@ -36,7 +36,7 @@ export const useCreateDynamicSecretLease = () => {
 export const useRenewDynamicSecretLease = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TRenewDynamicSecretLeaseDTO>({
+  return useMutation<object, object, TRenewDynamicSecretLeaseDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.post<{ lease: TDynamicSecretLease }>(
         `/api/v1/dynamic-secrets/leases/${dto.leaseId}/renew`,
@@ -55,7 +55,7 @@ export const useRenewDynamicSecretLease = () => {
 export const useRevokeDynamicSecretLease = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TRevokeDynamicSecretLeaseDTO>({
+  return useMutation<object, object, TRevokeDynamicSecretLeaseDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.delete<{ lease: TDynamicSecretLease }>(
         `/api/v1/dynamic-secrets/leases/${dto.leaseId}`,

frontend-v2/src/hooks/api/identities/mutations.tsx

@@ -55,7 +55,7 @@ import {
 
 export const useCreateIdentity = () => {
   const queryClient = useQueryClient();
-  return useMutation<Identity, {}, CreateIdentityDTO>({
+  return useMutation<Identity, object, CreateIdentityDTO>({
     mutationFn: async (body) => {
       const {
         data: { identity }
@@ -70,7 +70,7 @@ export const useCreateIdentity = () => {
 
 export const useUpdateIdentity = () => {
   const queryClient = useQueryClient();
-  return useMutation<Identity, {}, UpdateIdentityDTO>({
+  return useMutation<Identity, object, UpdateIdentityDTO>({
     mutationFn: async ({ identityId, name, role, metadata }) => {
       const {
         data: { identity }
@@ -91,7 +91,7 @@ export const useUpdateIdentity = () => {
 
 export const useDeleteIdentity = () => {
   const queryClient = useQueryClient();
-  return useMutation<Identity, {}, DeleteIdentityDTO>({
+  return useMutation<Identity, object, DeleteIdentityDTO>({
     mutationFn: async ({ identityId }) => {
       const {
         data: { identity }
@@ -108,7 +108,7 @@ export const useDeleteIdentity = () => {
 
 export const useAddIdentityUniversalAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityUniversalAuth, {}, AddIdentityUniversalAuthDTO>({
+  return useMutation<IdentityUniversalAuth, object, AddIdentityUniversalAuthDTO>({
     mutationFn: async ({
       identityId,
       clientSecretTrustedIps,
@@ -138,7 +138,7 @@ export const useAddIdentityUniversalAuth = () => {
 
 export const useUpdateIdentityUniversalAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityUniversalAuth, {}, UpdateIdentityUniversalAuthDTO>({
+  return useMutation<IdentityUniversalAuth, object, UpdateIdentityUniversalAuthDTO>({
     mutationFn: async ({
       identityId,
       clientSecretTrustedIps,
@@ -168,7 +168,7 @@ export const useUpdateIdentityUniversalAuth = () => {
 
 export const useDeleteIdentityUniversalAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityUniversalAuth, {}, DeleteIdentityUniversalAuthDTO>({
+  return useMutation<IdentityUniversalAuth, object, DeleteIdentityUniversalAuthDTO>({
     mutationFn: async ({ identityId }) => {
       const {
         data: { identityUniversalAuth }
@@ -187,7 +187,7 @@ export const useCreateIdentityUniversalAuthClientSecret = () => {
   const queryClient = useQueryClient();
   return useMutation<
     CreateIdentityUniversalAuthClientSecretRes,
-    {},
+    object,
     CreateIdentityUniversalAuthClientSecretDTO
   >({
     mutationFn: async ({ identityId, description, ttl, numUsesLimit }) => {
@@ -211,7 +211,7 @@ export const useCreateIdentityUniversalAuthClientSecret = () => {
 
 export const useRevokeIdentityUniversalAuthClientSecret = () => {
   const queryClient = useQueryClient();
-  return useMutation<ClientSecretData, {}, DeleteIdentityUniversalAuthClientSecretDTO>({
+  return useMutation<ClientSecretData, object, DeleteIdentityUniversalAuthClientSecretDTO>({
     mutationFn: async ({ identityId, clientSecretId }) => {
       const {
         data: { clientSecretData }
@@ -230,7 +230,7 @@ export const useRevokeIdentityUniversalAuthClientSecret = () => {
 
 export const useAddIdentityGcpAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityGcpAuth, {}, AddIdentityGcpAuthDTO>({
+  return useMutation<IdentityGcpAuth, object, AddIdentityGcpAuthDTO>({
     mutationFn: async ({
       identityId,
       type,
@@ -270,7 +270,7 @@ export const useAddIdentityGcpAuth = () => {
 
 export const useUpdateIdentityGcpAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityGcpAuth, {}, UpdateIdentityGcpAuthDTO>({
+  return useMutation<IdentityGcpAuth, object, UpdateIdentityGcpAuthDTO>({
     mutationFn: async ({
       identityId,
       type,
@@ -310,7 +310,7 @@ export const useUpdateIdentityGcpAuth = () => {
 
 export const useDeleteIdentityGcpAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityGcpAuth, {}, DeleteIdentityGcpAuthDTO>({
+  return useMutation<IdentityGcpAuth, object, DeleteIdentityGcpAuthDTO>({
     mutationFn: async ({ identityId }) => {
       const {
         data: { identityGcpAuth }
@@ -327,7 +327,7 @@ export const useDeleteIdentityGcpAuth = () => {
 
 export const useAddIdentityAwsAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityAwsAuth, {}, AddIdentityAwsAuthDTO>({
+  return useMutation<IdentityAwsAuth, object, AddIdentityAwsAuthDTO>({
     mutationFn: async ({
       identityId,
       stsEndpoint,
@@ -365,7 +365,7 @@ export const useAddIdentityAwsAuth = () => {
 
 export const useUpdateIdentityAwsAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityAwsAuth, {}, UpdateIdentityAwsAuthDTO>({
+  return useMutation<IdentityAwsAuth, object, UpdateIdentityAwsAuthDTO>({
     mutationFn: async ({
       identityId,
       stsEndpoint,
@@ -403,7 +403,7 @@ export const useUpdateIdentityAwsAuth = () => {
 
 export const useDeleteIdentityAwsAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityAwsAuth, {}, DeleteIdentityAwsAuthDTO>({
+  return useMutation<IdentityAwsAuth, object, DeleteIdentityAwsAuthDTO>({
     mutationFn: async ({ identityId }) => {
       const {
         data: { identityAwsAuth }
@@ -420,7 +420,7 @@ export const useDeleteIdentityAwsAuth = () => {
 
 export const useUpdateIdentityOidcAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityOidcAuth, {}, UpdateIdentityOidcAuthDTO>({
+  return useMutation<IdentityOidcAuth, object, UpdateIdentityOidcAuthDTO>({
     mutationFn: async ({
       identityId,
       accessTokenTTL,
@@ -464,7 +464,7 @@ export const useUpdateIdentityOidcAuth = () => {
 
 export const useAddIdentityOidcAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityOidcAuth, {}, AddIdentityOidcAuthDTO>({
+  return useMutation<IdentityOidcAuth, object, AddIdentityOidcAuthDTO>({
     mutationFn: async ({
       identityId,
       oidcDiscoveryUrl,
@@ -508,7 +508,7 @@ export const useAddIdentityOidcAuth = () => {
 
 export const useDeleteIdentityOidcAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityTokenAuth, {}, DeleteIdentityOidcAuthDTO>({
+  return useMutation<IdentityTokenAuth, object, DeleteIdentityOidcAuthDTO>({
     mutationFn: async ({ identityId }) => {
       const {
         data: { identityOidcAuth }
@@ -524,7 +524,7 @@ export const useDeleteIdentityOidcAuth = () => {
 };
 export const useUpdateIdentityJwtAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityJwtAuth, {}, UpdateIdentityJwtAuthDTO>({
+  return useMutation<IdentityJwtAuth, object, UpdateIdentityJwtAuthDTO>({
     mutationFn: async ({
       identityId,
       configurationType,
@@ -572,7 +572,7 @@ export const useUpdateIdentityJwtAuth = () => {
 
 export const useAddIdentityJwtAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityJwtAuth, {}, AddIdentityJwtAuthDTO>({
+  return useMutation<IdentityJwtAuth, object, AddIdentityJwtAuthDTO>({
     mutationFn: async ({
       identityId,
       configurationType,
@@ -620,7 +620,7 @@ export const useAddIdentityJwtAuth = () => {
 
 export const useDeleteIdentityJwtAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityTokenAuth, {}, DeleteIdentityJwtAuthDTO>({
+  return useMutation<IdentityTokenAuth, object, DeleteIdentityJwtAuthDTO>({
     mutationFn: async ({ identityId }) => {
       const {
         data: { identityJwtAuth }
@@ -637,7 +637,7 @@ export const useDeleteIdentityJwtAuth = () => {
 
 export const useAddIdentityAzureAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityAzureAuth, {}, AddIdentityAzureAuthDTO>({
+  return useMutation<IdentityAzureAuth, object, AddIdentityAzureAuthDTO>({
     mutationFn: async ({
       identityId,
       tenantId,
@@ -675,7 +675,7 @@ export const useAddIdentityAzureAuth = () => {
 
 export const useAddIdentityKubernetesAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityKubernetesAuth, {}, AddIdentityKubernetesAuthDTO>({
+  return useMutation<IdentityKubernetesAuth, object, AddIdentityKubernetesAuthDTO>({
     mutationFn: async ({
       identityId,
       kubernetesHost,
@@ -719,7 +719,7 @@ export const useAddIdentityKubernetesAuth = () => {
 
 export const useUpdateIdentityAzureAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityAzureAuth, {}, UpdateIdentityAzureAuthDTO>({
+  return useMutation<IdentityAzureAuth, object, UpdateIdentityAzureAuthDTO>({
     mutationFn: async ({
       identityId,
       tenantId,
@@ -757,7 +757,7 @@ export const useUpdateIdentityAzureAuth = () => {
 
 export const useDeleteIdentityAzureAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityAzureAuth, {}, DeleteIdentityAzureAuthDTO>({
+  return useMutation<IdentityAzureAuth, object, DeleteIdentityAzureAuthDTO>({
     mutationFn: async ({ identityId }) => {
       const {
         data: { identityAzureAuth }
@@ -774,7 +774,7 @@ export const useDeleteIdentityAzureAuth = () => {
 
 export const useUpdateIdentityKubernetesAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityKubernetesAuth, {}, UpdateIdentityKubernetesAuthDTO>({
+  return useMutation<IdentityKubernetesAuth, object, UpdateIdentityKubernetesAuthDTO>({
     mutationFn: async ({
       identityId,
       kubernetesHost,
@@ -818,7 +818,7 @@ export const useUpdateIdentityKubernetesAuth = () => {
 
 export const useDeleteIdentityKubernetesAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityTokenAuth, {}, DeleteIdentityKubernetesAuthDTO>({
+  return useMutation<IdentityTokenAuth, object, DeleteIdentityKubernetesAuthDTO>({
     mutationFn: async ({ identityId }) => {
       const {
         data: { identityKubernetesAuth }
@@ -835,7 +835,7 @@ export const useDeleteIdentityKubernetesAuth = () => {
 
 export const useAddIdentityTokenAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityTokenAuth, {}, AddIdentityTokenAuthDTO>({
+  return useMutation<IdentityTokenAuth, object, AddIdentityTokenAuthDTO>({
     mutationFn: async ({
       identityId,
       accessTokenTTL,
@@ -867,7 +867,7 @@ export const useAddIdentityTokenAuth = () => {
 
 export const useUpdateIdentityTokenAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityTokenAuth, {}, UpdateIdentityTokenAuthDTO>({
+  return useMutation<IdentityTokenAuth, object, UpdateIdentityTokenAuthDTO>({
     mutationFn: async ({
       identityId,
       accessTokenTTL,
@@ -899,7 +899,7 @@ export const useUpdateIdentityTokenAuth = () => {
 
 export const useDeleteIdentityTokenAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityTokenAuth, {}, DeleteIdentityTokenAuthDTO>({
+  return useMutation<IdentityTokenAuth, object, DeleteIdentityTokenAuthDTO>({
     mutationFn: async ({ identityId }) => {
       const {
         data: { identityTokenAuth }
@@ -916,7 +916,7 @@ export const useDeleteIdentityTokenAuth = () => {
 
 export const useCreateTokenIdentityTokenAuth = () => {
   const queryClient = useQueryClient();
-  return useMutation<CreateTokenIdentityTokenAuthRes, {}, CreateTokenIdentityTokenAuthDTO>({
+  return useMutation<CreateTokenIdentityTokenAuthRes, object, CreateTokenIdentityTokenAuthDTO>({
     mutationFn: async ({ identityId, name }) => {
       const { data } = await apiRequest.post<CreateTokenIdentityTokenAuthRes>(
         `/api/v1/auth/token-auth/identities/${identityId}/tokens`,
@@ -935,7 +935,7 @@ export const useCreateTokenIdentityTokenAuth = () => {
 
 export const useUpdateIdentityTokenAuthToken = () => {
   const queryClient = useQueryClient();
-  return useMutation<IdentityAccessToken, {}, UpdateTokenIdentityTokenAuthDTO>({
+  return useMutation<IdentityAccessToken, object, UpdateTokenIdentityTokenAuthDTO>({
     mutationFn: async ({ tokenId, name }) => {
       const {
         data: { token }
@@ -956,7 +956,7 @@ export const useUpdateIdentityTokenAuthToken = () => {
 
 export const useRevokeIdentityTokenAuthToken = () => {
   const queryClient = useQueryClient();
-  return useMutation<RevokeTokenRes, {}, RevokeTokenDTO>({
+  return useMutation<RevokeTokenRes, object, RevokeTokenDTO>({
     mutationFn: async ({ tokenId }) => {
       const { data } = await apiRequest.post<RevokeTokenRes>(
         `/api/v1/auth/token-auth/tokens/${tokenId}/revoke`

frontend-v2/src/hooks/api/identityProjectAdditionalPrivilege/mutation.tsx

@@ -13,7 +13,7 @@ import {
 export const useCreateIdentityProjectAdditionalPrivilege = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<TIdentityProjectPrivilege, {}, TCreateIdentityProjectPrivilegeDTO>({
+  return useMutation<TIdentityProjectPrivilege, object, TCreateIdentityProjectPrivilegeDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.post("/api/v2/identity-project-additional-privilege", dto);
       return data.privilege;
@@ -27,7 +27,7 @@ export const useCreateIdentityProjectAdditionalPrivilege = () => {
 export const useUpdateIdentityProjectAdditionalPrivilege = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<TIdentityProjectPrivilege, {}, TUpdateIdentityProjectPrivlegeDTO>({
+  return useMutation<TIdentityProjectPrivilege, object, TUpdateIdentityProjectPrivlegeDTO>({
     mutationFn: async ({ projectId, privilegeId, identityId, permissions, slug, type }) => {
       const { data: res } = await apiRequest.patch(
         `/api/v2/identity-project-additional-privilege/${privilegeId}`,
@@ -51,7 +51,7 @@ export const useUpdateIdentityProjectAdditionalPrivilege = () => {
 export const useDeleteIdentityProjectAdditionalPrivilege = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<TIdentityProjectPrivilege, {}, TDeleteIdentityProjectPrivilegeDTO>({
+  return useMutation<TIdentityProjectPrivilege, object, TDeleteIdentityProjectPrivilegeDTO>({
     mutationFn: async ({ identityId, projectId, privilegeId }) => {
       const { data } = await apiRequest.delete(
         `/api/v2/identity-project-additional-privilege/${privilegeId}`,

frontend-v2/src/hooks/api/incidentContacts/queries.tsx

@@ -25,7 +25,7 @@ export const useGetOrgIncidentContact = (orgId: string) =>
 export const useAddIncidentContact = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, AddIncidentContactDTO>({
+  return useMutation<object, object, AddIncidentContactDTO>({
     mutationFn: async ({ orgId, email }) => {
       const { data } = await apiRequest.post(`/api/v1/organization/${orgId}/incidentContactOrg`, {
         email
@@ -41,7 +41,7 @@ export const useAddIncidentContact = () => {
 export const useDeleteIncidentContact = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, DeleteIncidentContactDTO>({
+  return useMutation<object, object, DeleteIncidentContactDTO>({
     mutationFn: async ({ orgId, incidentContactId }) => {
       const { data } = await apiRequest.delete(
         `/api/v1/organization/${orgId}/incidentContactOrg/${incidentContactId}`

frontend-v2/src/hooks/api/integrationAuth/mutations.tsx

@@ -6,7 +6,7 @@ import { IntegrationAuth, TDuplicateIntegrationAuthDTO } from "./types";
 
 // For now, this should only be used in the Github app integration flow.
 export const useDuplicateIntegrationAuth = () => {
-  return useMutation<IntegrationAuth, {}, TDuplicateIntegrationAuthDTO>({
+  return useMutation<IntegrationAuth, object, TDuplicateIntegrationAuthDTO>({
     mutationFn: async (body) => {
       const { data } = await apiRequest.post<{ integrationAuth: IntegrationAuth }>(
         `/api/v1/integration-auth/${body.integrationAuthId}/duplicate`,

frontend-v2/src/hooks/api/integrationAuth/queries.tsx

@@ -966,7 +966,7 @@ export const useSaveIntegrationAccessToken = () => {
 export const useDeleteIntegrationAuths = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, { integration: string; workspaceId: string }>({
+  return useMutation<object, object, { integration: string; workspaceId: string }>({
     mutationFn: ({ integration, workspaceId }) =>
       apiRequest.delete(
         `/api/v1/integration-auth?${new URLSearchParams({
@@ -985,7 +985,7 @@ export const useDeleteIntegrationAuth = () => {
   // not used
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, { id: string; workspaceId: string }>({
+  return useMutation<object, object, { id: string; workspaceId: string }>({
     mutationFn: ({ id }) => apiRequest.delete(`/api/v1/integration-auth/${id}`),
     onSuccess: (_, { workspaceId }) => {
       queryClient.invalidateQueries(workspaceKeys.getWorkspaceAuthorization(workspaceId));

frontend-v2/src/hooks/api/integrations/queries.tsx

@@ -123,8 +123,8 @@ export const useDeleteIntegration = () => {
   const queryClient = useQueryClient();
 
   return useMutation<
-    {},
-    {},
+    object,
+    object,
     { id: string; workspaceId: string; shouldDeleteIntegrationSecrets: boolean }
   >({
     mutationFn: ({ id, shouldDeleteIntegrationSecrets }) =>
@@ -159,7 +159,7 @@ export const useGetIntegration = (
 };
 
 export const useSyncIntegration = () => {
-  return useMutation<{}, {}, { id: string; workspaceId: string; lastUsed: string }>({
+  return useMutation<object, object, { id: string; workspaceId: string; lastUsed: string }>({
     mutationFn: ({ id }) => apiRequest.post(`/api/v1/integration/${id}/sync`),
     onSuccess: () => {
       createNotification({

frontend-v2/src/hooks/api/keys/queries.tsx

@@ -31,7 +31,7 @@ export const uploadWsKey = async ({ workspaceId, userId, encryptedKey, nonce }:
 };
 
 export const useUploadWsKey = () =>
-  useMutation<{}, {}, UploadWsKeyDTO>({
+  useMutation<object, object, UploadWsKeyDTO>({
     mutationFn: async ({ encryptedKey, nonce, userId, workspaceId }) => {
       return uploadWsKey({
         workspaceId,

frontend-v2/src/hooks/api/ldapConfig/queries.tsx

@@ -19,7 +19,7 @@ export const useGetLDAPConfig = (organizationId: string) => {
         );
 
         return data;
-      } catch (err) {
+      } catch {
         return null;
       }
     },

frontend-v2/src/hooks/api/oidcConfig/queries.tsx

@@ -18,7 +18,7 @@ export const useGetOIDCConfig = (orgSlug: string) => {
         );
 
         return data;
-      } catch (err) {
+      } catch {
         return null;
       }
     },

frontend-v2/src/hooks/api/organization/queries.tsx

@@ -100,7 +100,7 @@ export const useCreateOrg = (options: { invalidate: boolean } = { invalidate: tr
 
 export const useUpdateOrg = () => {
   const queryClient = useQueryClient();
-  return useMutation<{}, {}, UpdateOrgDTO>({
+  return useMutation<object, object, UpdateOrgDTO>({
     mutationFn: ({
       name,
       authEnforced,

frontend-v2/src/hooks/api/pkiAlerts/mutations.tsx

@@ -8,7 +8,7 @@ import { TCreatePkiAlertDTO, TDeletePkiAlertDTO, TPkiAlert, TUpdatePkiAlertDTO }
 
 export const useCreatePkiAlert = () => {
   const queryClient = useQueryClient();
-  return useMutation<TPkiAlert, {}, TCreatePkiAlertDTO>({
+  return useMutation<TPkiAlert, object, TCreatePkiAlertDTO>({
     mutationFn: async (body) => {
       const { data: alert } = await apiRequest.post<TPkiAlert>("/api/v1/pki/alerts", body);
       return alert;
@@ -21,7 +21,7 @@ export const useCreatePkiAlert = () => {
 
 export const useUpdatePkiAlert = () => {
   const queryClient = useQueryClient();
-  return useMutation<TPkiAlert, {}, TUpdatePkiAlertDTO>({
+  return useMutation<TPkiAlert, object, TUpdatePkiAlertDTO>({
     mutationFn: async ({ alertId, ...body }) => {
       const { data: alert } = await apiRequest.patch<TPkiAlert>(
         `/api/v1/pki/alerts/${alertId}`,
@@ -38,7 +38,7 @@ export const useUpdatePkiAlert = () => {
 
 export const useDeletePkiAlert = () => {
   const queryClient = useQueryClient();
-  return useMutation<TPkiAlert, {}, TDeletePkiAlertDTO>({
+  return useMutation<TPkiAlert, object, TDeletePkiAlertDTO>({
     mutationFn: async ({ alertId }) => {
       const { data: alert } = await apiRequest.delete<TPkiAlert>(`/api/v1/pki/alerts/${alertId}`);
       return alert;

frontend-v2/src/hooks/api/pkiCollections/mutations.tsx

@@ -16,7 +16,7 @@ import {
 
 export const useCreatePkiCollection = () => {
   const queryClient = useQueryClient();
-  return useMutation<TPkiCollection, {}, TCreatePkiCollectionDTO>({
+  return useMutation<TPkiCollection, object, TCreatePkiCollectionDTO>({
     mutationFn: async (body) => {
       const { data: pkiCollection } = await apiRequest.post<TPkiCollection>(
         "/api/v1/pki/collections",
@@ -32,7 +32,7 @@ export const useCreatePkiCollection = () => {
 
 export const useUpdatePkiCollection = () => {
   const queryClient = useQueryClient();
-  return useMutation<TPkiCollection, {}, TUpdatePkiCollectionTO>({
+  return useMutation<TPkiCollection, object, TUpdatePkiCollectionTO>({
     mutationFn: async ({ collectionId, ...body }) => {
       const { data: pkiCollection } = await apiRequest.patch<TPkiCollection>(
         `/api/v1/pki/collections/${collectionId}`,
@@ -49,7 +49,7 @@ export const useUpdatePkiCollection = () => {
 
 export const useDeletePkiCollection = () => {
   const queryClient = useQueryClient();
-  return useMutation<TPkiCollection, {}, TDeletePkiCollectionDTO>({
+  return useMutation<TPkiCollection, object, TDeletePkiCollectionDTO>({
     mutationFn: async ({ collectionId }) => {
       const { data: pkiCollection } = await apiRequest.delete<TPkiCollection>(
         `/api/v1/pki/collections/${collectionId}`
@@ -65,7 +65,7 @@ export const useDeletePkiCollection = () => {
 
 export const useAddItemToPkiCollection = () => {
   const queryClient = useQueryClient();
-  return useMutation<TPkiCollectionItem, {}, TAddItemToPkiCollectionDTO>({
+  return useMutation<TPkiCollectionItem, object, TAddItemToPkiCollectionDTO>({
     mutationFn: async ({ collectionId, type, itemId }) => {
       const { data: pkiCollectionItem } = await apiRequest.post<TPkiCollectionItem>(
         `/api/v1/pki/collections/${collectionId}/items`,
@@ -84,7 +84,7 @@ export const useAddItemToPkiCollection = () => {
 
 export const useRemoveItemFromPkiCollection = () => {
   const queryClient = useQueryClient();
-  return useMutation<TPkiCollectionItem, {}, TRemoveItemFromPkiCollectionDTO>({
+  return useMutation<TPkiCollectionItem, object, TRemoveItemFromPkiCollectionDTO>({
     mutationFn: async ({ collectionId, itemId }) => {
       const { data: pkiCollectionItem } = await apiRequest.delete<TPkiCollectionItem>(
         `/api/v1/pki/collections/${collectionId}/items/${itemId}`

frontend-v2/src/hooks/api/projectUserAdditionalPrivilege/mutation.tsx

@@ -13,7 +13,7 @@ import {
 export const useCreateProjectUserAdditionalPrivilege = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{ privilege: TProjectUserPrivilege }, {}, TCreateProjectUserPrivilegeDTO>({
+  return useMutation<{ privilege: TProjectUserPrivilege }, object, TCreateProjectUserPrivilegeDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.post("/api/v1/user-project-additional-privilege", dto);
       return data.privilege;
@@ -27,7 +27,7 @@ export const useCreateProjectUserAdditionalPrivilege = () => {
 export const useUpdateProjectUserAdditionalPrivilege = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{ privilege: TProjectUserPrivilege }, {}, TUpdateProjectUserPrivlegeDTO>({
+  return useMutation<{ privilege: TProjectUserPrivilege }, object, TUpdateProjectUserPrivlegeDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.patch(
         `/api/v1/user-project-additional-privilege/${dto.privilegeId}`,
@@ -44,7 +44,7 @@ export const useUpdateProjectUserAdditionalPrivilege = () => {
 export const useDeleteProjectUserAdditionalPrivilege = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{ privilege: TProjectUserPrivilege }, {}, TDeleteProjectUserPrivilegeDTO>({
+  return useMutation<{ privilege: TProjectUserPrivilege }, object, TDeleteProjectUserPrivilegeDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.delete(
         `/api/v1/user-project-additional-privilege/${dto.privilegeId}`

frontend-v2/src/hooks/api/rateLimit/mutation.ts

@@ -8,7 +8,7 @@ import { TRateLimit } from "./types";
 export const useUpdateRateLimit = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<TRateLimit, {}, TRateLimit>({
+  return useMutation<TRateLimit, object, TRateLimit>({
     mutationFn: async (opt) => {
       const { data } = await apiRequest.put<{ rateLimit: TRateLimit }>("/api/v1/rate-limit", opt);
       return data.rateLimit;

frontend-v2/src/hooks/api/roles/mutation.tsx

@@ -18,7 +18,7 @@ import {
 export const useCreateProjectRole = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<TProjectRole, {}, TCreateProjectRoleDTO>({
+  return useMutation<TProjectRole, object, TCreateProjectRoleDTO>({
     mutationFn: async ({ projectId, ...dto }: TCreateProjectRoleDTO) => {
       const {
         data: { role }
@@ -34,7 +34,7 @@ export const useCreateProjectRole = () => {
 export const useUpdateProjectRole = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<TProjectRole, {}, TUpdateProjectRoleDTO>({
+  return useMutation<TProjectRole, object, TUpdateProjectRoleDTO>({
     mutationFn: async ({ id, projectId, ...dto }: TUpdateProjectRoleDTO) => {
       const {
         data: { role }
@@ -52,7 +52,7 @@ export const useUpdateProjectRole = () => {
 
 export const useDeleteProjectRole = () => {
   const queryClient = useQueryClient();
-  return useMutation<TProjectRole, {}, TDeleteProjectRoleDTO>({
+  return useMutation<TProjectRole, object, TDeleteProjectRoleDTO>({
     mutationFn: async ({ projectId, id }: TDeleteProjectRoleDTO) => {
       const {
         data: { role }
@@ -68,7 +68,7 @@ export const useDeleteProjectRole = () => {
 export const useCreateOrgRole = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<TOrgRole, {}, TCreateOrgRoleDTO>({
+  return useMutation<TOrgRole, object, TCreateOrgRoleDTO>({
     mutationFn: async ({ orgId, permissions, ...dto }: TCreateOrgRoleDTO) => {
       const {
         data: { role }
@@ -88,7 +88,7 @@ export const useCreateOrgRole = () => {
 export const useUpdateOrgRole = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<TOrgRole, {}, TUpdateOrgRoleDTO>({
+  return useMutation<TOrgRole, object, TUpdateOrgRoleDTO>({
     mutationFn: async ({ id, orgId, permissions, ...dto }: TUpdateOrgRoleDTO) => {
       const {
         data: { role }
@@ -109,7 +109,7 @@ export const useUpdateOrgRole = () => {
 export const useDeleteOrgRole = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<TOrgRole, {}, TDeleteOrgRoleDTO>({
+  return useMutation<TOrgRole, object, TDeleteOrgRoleDTO>({
     mutationFn: async ({ orgId, id }: TDeleteOrgRoleDTO) => {
       const {
         data: { role }

frontend-v2/src/hooks/api/scim/mutations.tsx

@@ -7,7 +7,7 @@ import { CreateScimTokenDTO, CreateScimTokenRes, DeleteScimTokenDTO } from "./ty
 
 export const useCreateScimToken = () => {
   const queryClient = useQueryClient();
-  return useMutation<CreateScimTokenRes, {}, CreateScimTokenDTO>({
+  return useMutation<CreateScimTokenRes, object, CreateScimTokenDTO>({
     mutationFn: async ({ organizationId, description, ttlDays }) => {
       const { data } = await apiRequest.post("/api/v1/scim/scim-tokens", {
         organizationId,
@@ -25,7 +25,7 @@ export const useCreateScimToken = () => {
 
 export const useDeleteScimToken = () => {
   const queryClient = useQueryClient();
-  return useMutation<CreateScimTokenRes, {}, DeleteScimTokenDTO>({
+  return useMutation<CreateScimTokenRes, object, DeleteScimTokenDTO>({
     mutationFn: async ({ scimTokenId }) => {
       const { data } = await apiRequest.delete(`/api/v1/scim/scim-tokens/${scimTokenId}`);
       return data;

frontend-v2/src/hooks/api/secretApproval/mutation.tsx

@@ -8,7 +8,7 @@ import { TCreateSecretPolicyDTO, TDeleteSecretPolicyDTO, TUpdateSecretPolicyDTO
 export const useCreateSecretApprovalPolicy = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TCreateSecretPolicyDTO>({
+  return useMutation<object, object, TCreateSecretPolicyDTO>({
     mutationFn: async ({
       environment,
       workspaceId,
@@ -38,7 +38,7 @@ export const useCreateSecretApprovalPolicy = () => {
 export const useUpdateSecretApprovalPolicy = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TUpdateSecretPolicyDTO>({
+  return useMutation<object, object, TUpdateSecretPolicyDTO>({
     mutationFn: async ({ id, approvers, approvals, secretPath, name, enforcementLevel }) => {
       const { data } = await apiRequest.patch(`/api/v1/secret-approvals/${id}`, {
         approvals,
@@ -58,7 +58,7 @@ export const useUpdateSecretApprovalPolicy = () => {
 export const useDeleteSecretApprovalPolicy = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TDeleteSecretPolicyDTO>({
+  return useMutation<object, object, TDeleteSecretPolicyDTO>({
     mutationFn: async ({ id }) => {
       const { data } = await apiRequest.delete(`/api/v1/secret-approvals/${id}`);
       return data;

frontend-v2/src/hooks/api/secretApprovalRequest/mutation.tsx

@@ -12,7 +12,7 @@ import {
 export const useUpdateSecretApprovalReviewStatus = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TUpdateSecretApprovalReviewStatusDTO>({
+  return useMutation<object, object, TUpdateSecretApprovalReviewStatusDTO>({
     mutationFn: async ({ id, status }) => {
       const { data } = await apiRequest.post(`/api/v1/secret-approval-requests/${id}/review`, {
         status
@@ -28,7 +28,7 @@ export const useUpdateSecretApprovalReviewStatus = () => {
 export const useUpdateSecretApprovalRequestStatus = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TUpdateSecretApprovalRequestStatusDTO>({
+  return useMutation<object, object, TUpdateSecretApprovalRequestStatusDTO>({
     mutationFn: async ({ id, status }) => {
       const { data } = await apiRequest.post(`/api/v1/secret-approval-requests/${id}/status`, {
         status
@@ -45,7 +45,7 @@ export const useUpdateSecretApprovalRequestStatus = () => {
 export const usePerformSecretApprovalRequestMerge = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TPerformSecretApprovalRequestMerge>({
+  return useMutation<object, object, TPerformSecretApprovalRequestMerge>({
     mutationFn: async ({ id, bypassReason }) => {
       const { data } = await apiRequest.post(`/api/v1/secret-approval-requests/${id}/merge`, {
         bypassReason

frontend-v2/src/hooks/api/secretApprovalRequest/queries.tsx

@@ -143,7 +143,7 @@ const fetchSecretApprovalRequestList = async ({
 export const useGetSecretApprovalRequests = ({
   workspaceId,
   environment,
-  options = {},
+  options = object,
   status,
   limit = 20,
   committer

frontend-v2/src/hooks/api/secretFolders/queries.tsx

@@ -116,7 +116,7 @@ export const useGetFoldersByEnv = ({
 export const useCreateFolder = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TCreateFolderDTO>({
+  return useMutation<object, object, TCreateFolderDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.post("/api/v1/folders", {
         ...dto,
@@ -147,7 +147,7 @@ export const useCreateFolder = () => {
 export const useUpdateFolder = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TUpdateFolderDTO>({
+  return useMutation<object, object, TUpdateFolderDTO>({
     mutationFn: async ({ path = "/", folderId, name, environment, projectId }) => {
       const { data } = await apiRequest.patch(`/api/v1/folders/${folderId}`, {
         name,
@@ -180,7 +180,7 @@ export const useUpdateFolder = () => {
 export const useDeleteFolder = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TDeleteFolderDTO>({
+  return useMutation<object, object, TDeleteFolderDTO>({
     mutationFn: async ({ path = "/", folderId, environment, projectId }) => {
       const { data } = await apiRequest.delete(`/api/v1/folders/${folderId}`, {
         data: {
@@ -214,7 +214,7 @@ export const useDeleteFolder = () => {
 export const useUpdateFolderBatch = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TUpdateFolderBatchDTO>({
+  return useMutation<object, object, TUpdateFolderBatchDTO>({
     mutationFn: async ({ projectSlug, folders }) => {
       const { data } = await apiRequest.patch("/api/v1/folders/batch", {
         projectSlug,

frontend-v2/src/hooks/api/secretImports/mutation.tsx

@@ -14,7 +14,7 @@ import {
 export const useCreateSecretImport = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TCreateSecretImportDTO>({
+  return useMutation<object, object, TCreateSecretImportDTO>({
     mutationFn: async ({ import: secretImport, environment, isReplication, projectId, path }) => {
       const { data } = await apiRequest.post("/api/v1/secret-imports", {
         import: secretImport,
@@ -42,7 +42,7 @@ export const useCreateSecretImport = () => {
 export const useUpdateSecretImport = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TUpdateSecretImportDTO>({
+  return useMutation<object, object, TUpdateSecretImportDTO>({
     mutationFn: async ({ environment, import: secretImports, projectId, path, id }) => {
       const { data } = await apiRequest.patch(`/api/v1/secret-imports/${id}`, {
         import: secretImports,
@@ -67,7 +67,7 @@ export const useUpdateSecretImport = () => {
 };
 
 export const useResyncSecretReplication = () => {
-  return useMutation<{}, {}, TResyncSecretReplicationDTO>({
+  return useMutation<object, object, TResyncSecretReplicationDTO>({
     mutationFn: async ({ environment, projectId, path, id }) => {
       const { data } = await apiRequest.post(`/api/v1/secret-imports/${id}/replication-resync`, {
         environment,
@@ -82,7 +82,7 @@ export const useResyncSecretReplication = () => {
 export const useDeleteSecretImport = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TDeleteSecretImportDTO>({
+  return useMutation<object, object, TDeleteSecretImportDTO>({
     mutationFn: async ({ id, projectId, path, environment }) => {
       const { data } = await apiRequest.delete(`/api/v1/secret-imports/${id}`, {
         data: {

frontend-v2/src/hooks/api/secretRotation/mutation.tsx

@@ -12,7 +12,7 @@ import {
 export const useCreateSecretRotation = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TCreateSecretRotationDTO>({
+  return useMutation<object, object, TCreateSecretRotationDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.post("/api/v1/secret-rotations", dto);
       return data;
@@ -26,7 +26,7 @@ export const useCreateSecretRotation = () => {
 export const useDeleteSecretRotation = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TDeleteSecretRotationDTO>({
+  return useMutation<object, object, TDeleteSecretRotationDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.delete(`/api/v1/secret-rotations/${dto.id}`);
       return data;
@@ -40,7 +40,7 @@ export const useDeleteSecretRotation = () => {
 export const useRestartSecretRotation = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TRestartSecretRotationDTO>({
+  return useMutation<object, object, TRestartSecretRotationDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.post("/api/v1/secret-rotations/restart", { id: dto.id });
       return data;

frontend-v2/src/hooks/api/secretSnapshots/queries.tsx

@@ -142,7 +142,7 @@ export const useGetWsSnapshotCount = ({
 export const usePerformSecretRollback = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TSecretRollbackDTO>({
+  return useMutation<object, object, TSecretRollbackDTO>({
     mutationFn: async ({ snapshotId }) => {
       const { data } = await apiRequest.post(`/api/v1/secret-snapshot/${snapshotId}/rollback`);
       return data;

frontend-v2/src/hooks/api/secrets/mutations.tsx

@@ -19,10 +19,10 @@ import {
 export const useCreateSecretV3 = ({
   options
 }: {
-  options?: Omit<MutationOptions<{}, {}, TCreateSecretsV3DTO>, "mutationFn">;
+  options?: Omit<MutationOptions<object, object, TCreateSecretsV3DTO>, "mutationFn">;
 } = {}) => {
   const queryClient = useQueryClient();
-  return useMutation<{}, {}, TCreateSecretsV3DTO>({
+  return useMutation<object, object, TCreateSecretsV3DTO>({
     mutationFn: async ({
       secretPath = "/",
       type,
@@ -68,10 +68,10 @@ export const useCreateSecretV3 = ({
 export const useUpdateSecretV3 = ({
   options
 }: {
-  options?: Omit<MutationOptions<{}, {}, TUpdateSecretsV3DTO>, "mutationFn">;
+  options?: Omit<MutationOptions<object, object, TUpdateSecretsV3DTO>, "mutationFn">;
 } = {}) => {
   const queryClient = useQueryClient();
-  return useMutation<{}, {}, TUpdateSecretsV3DTO>({
+  return useMutation<object, object, TUpdateSecretsV3DTO>({
     mutationFn: async ({
       secretPath = "/",
       type,
@@ -123,11 +123,11 @@ export const useUpdateSecretV3 = ({
 export const useDeleteSecretV3 = ({
   options
 }: {
-  options?: Omit<MutationOptions<{}, {}, TDeleteSecretsV3DTO>, "mutationFn">;
+  options?: Omit<MutationOptions<object, object, TDeleteSecretsV3DTO>, "mutationFn">;
 } = {}) => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TDeleteSecretsV3DTO>({
+  return useMutation<object, object, TDeleteSecretsV3DTO>({
     mutationFn: async ({
       secretPath = "/",
       type,
@@ -169,11 +169,11 @@ export const useDeleteSecretV3 = ({
 export const useCreateSecretBatch = ({
   options
 }: {
-  options?: Omit<MutationOptions<{}, {}, TCreateSecretBatchDTO>, "mutationFn">;
+  options?: Omit<MutationOptions<object, object, TCreateSecretBatchDTO>, "mutationFn">;
 } = {}) => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TCreateSecretBatchDTO>({
+  return useMutation<object, object, TCreateSecretBatchDTO>({
     mutationFn: async ({ secretPath = "/", workspaceId, environment, secrets }) => {
       const { data } = await apiRequest.post("/api/v3/secrets/batch/raw", {
         workspaceId,
@@ -205,11 +205,11 @@ export const useCreateSecretBatch = ({
 export const useUpdateSecretBatch = ({
   options
 }: {
-  options?: Omit<MutationOptions<{}, {}, TUpdateSecretBatchDTO>, "mutationFn">;
+  options?: Omit<MutationOptions<object, object, TUpdateSecretBatchDTO>, "mutationFn">;
 } = {}) => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TUpdateSecretBatchDTO>({
+  return useMutation<object, object, TUpdateSecretBatchDTO>({
     mutationFn: async ({ secretPath = "/", workspaceId, environment, secrets }) => {
       const { data } = await apiRequest.patch("/api/v3/secrets/batch/raw", {
         workspaceId,
@@ -241,11 +241,11 @@ export const useUpdateSecretBatch = ({
 export const useDeleteSecretBatch = ({
   options
 }: {
-  options?: Omit<MutationOptions<{}, {}, TDeleteSecretBatchDTO>, "mutationFn">;
+  options?: Omit<MutationOptions<object, object, TDeleteSecretBatchDTO>, "mutationFn">;
 } = {}) => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TDeleteSecretBatchDTO>({
+  return useMutation<object, object, TDeleteSecretBatchDTO>({
     mutationFn: async ({ secretPath = "/", workspaceId, environment, secrets }) => {
       const { data } = await apiRequest.delete("/api/v3/secrets/batch/raw", {
         data: {
@@ -279,7 +279,7 @@ export const useDeleteSecretBatch = ({
 export const useMoveSecrets = ({
   options
 }: {
-  options?: Omit<MutationOptions<{}, {}, TMoveSecretsDTO>, "mutationFn">;
+  options?: Omit<MutationOptions<object, object, TMoveSecretsDTO>, "mutationFn">;
 } = {}) => {
   const queryClient = useQueryClient();
 
@@ -288,7 +288,7 @@ export const useMoveSecrets = ({
       isSourceUpdated: boolean;
       isDestinationUpdated: boolean;
     },
-    {},
+    object,
     TMoveSecretsDTO
   >({
     mutationFn: async ({
@@ -355,7 +355,7 @@ export const createSecret = async (dto: TCreateSecretsV3DTO) => {
 };
 
 export const useBackfillSecretReference = () =>
-  useMutation<{ message: string }, {}, { projectId: string }>({
+  useMutation<{ message: string }, object, { projectId: string }>({
     mutationFn: async ({ projectId }) => {
       const { data } = await apiRequest.post("/api/v3/secrets/backfill-secret-references", {
         projectId

frontend-v2/src/hooks/api/serviceTokens/queries.tsx

@@ -36,7 +36,7 @@ export const useCreateServiceToken = () => {
   // TODO: deprecate
   const queryClient = useQueryClient();
 
-  return useMutation<CreateServiceTokenRes, {}, CreateServiceTokenDTO>({
+  return useMutation<CreateServiceTokenRes, object, CreateServiceTokenDTO>({
     mutationFn: async (body) => {
       const { data } = await apiRequest.post("/api/v2/service-token/", body);
       data.serviceToken += `.${body.randomBytes}`;
@@ -51,7 +51,7 @@ export const useCreateServiceToken = () => {
 export const useDeleteServiceToken = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<DeleteServiceTokenRes, {}, string>({
+  return useMutation<DeleteServiceTokenRes, object, string>({
     mutationFn: async (serviceTokenId) => {
       const { data } = await apiRequest.delete(`/api/v2/service-token/${serviceTokenId}`);
       return data;

frontend-v2/src/hooks/api/ssoConfig/queries.tsx

@@ -17,7 +17,7 @@ export const useGetSSOConfig = (organizationId: string) => {
         );
 
         return data;
-      } catch (err) {
+      } catch {
         return null;
       }
     },

frontend-v2/src/hooks/api/tags/queries.tsx

@@ -27,7 +27,7 @@ export const useGetWsTags = (workspaceID: string) => {
 export const useCreateWsTag = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<WsTag, {}, CreateTagDTO>({
+  return useMutation<WsTag, object, CreateTagDTO>({
     mutationFn: async ({ workspaceID, tagColor, tagSlug }) => {
       const { data } = await apiRequest.post<{ workspaceTag: WsTag }>(
         `/api/v1/workspace/${workspaceID}/tags`,
@@ -47,7 +47,7 @@ export const useCreateWsTag = () => {
 export const useDeleteWsTag = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<WsTag, {}, DeleteTagDTO>({
+  return useMutation<WsTag, object, DeleteTagDTO>({
     mutationFn: async ({ tagID, projectId }) => {
       const { data } = await apiRequest.delete<{ workspaceTag: WsTag }>(
         `/api/v1/workspace/${projectId}/tags/${tagID}`

frontend-v2/src/hooks/api/userEngagement/mutations.tsx

@@ -5,7 +5,7 @@ import { apiRequest } from "@app/config/request";
 import { TCreateUserWishDto } from "./types";
 
 export const useCreateUserWish = () => {
-  return useMutation<{}, {}, TCreateUserWishDto>({
+  return useMutation<object, object, TCreateUserWishDto>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.post("/api/v1/user-engagement/me/wish", dto);
       return data;

frontend-v2/src/hooks/api/users/mutation.tsx

@@ -13,7 +13,7 @@ import { AddUserToWsDTOE2EE, AddUserToWsDTONonE2EE } from "./types";
 export const useAddUserToWsE2EE = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, AddUserToWsDTOE2EE>({
+  return useMutation<object, object, AddUserToWsDTOE2EE>({
     mutationFn: async ({ workspaceId, members, decryptKey, userPrivateKey }) => {
       // assymmetrically decrypt symmetric key with local private key
       const key = decryptAssymmetric({
@@ -50,7 +50,7 @@ export const useAddUserToWsE2EE = () => {
 export const useAddUserToWsNonE2EE = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, AddUserToWsDTONonE2EE>({
+  return useMutation<object, object, AddUserToWsDTONonE2EE>({
     mutationFn: async ({ projectId, usernames, roleSlugs }) => {
       const { data } = await apiRequest.post(`/api/v2/workspace/${projectId}/memberships`, {
         usernames,

frontend-v2/src/hooks/api/users/queries.tsx

@@ -80,7 +80,7 @@ export const fetchUserProjectFavorites = async (orgId: string) => {
 export const useRenameUser = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, RenameUserDTO>({
+  return useMutation<object, object, RenameUserDTO>({
     mutationFn: ({ newName }) =>
       apiRequest.patch("/api/v2/users/me/name", {
         firstName: newName?.split(" ")[0],
@@ -152,7 +152,7 @@ export const useAddUsersToOrg = () => {
     };
   };
 
-  return useMutation<Response, {}, AddUserToOrgDTO>({
+  return useMutation<Response, object, AddUserToOrgDTO>({
     mutationFn: (dto) => {
       return apiRequest.post("/api/v1/invite-org/signup", dto);
     },
@@ -207,7 +207,7 @@ export const useGetOrgMembershipProjectMemberships = (
 export const useDeleteOrgMembership = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, DeletOrgMembershipDTO>({
+  return useMutation<object, object, DeletOrgMembershipDTO>({
     mutationFn: ({ membershipId, orgId }) => {
       return apiRequest.delete(`/api/v2/organizations/${orgId}/memberships/${membershipId}`);
     },
@@ -220,7 +220,7 @@ export const useDeleteOrgMembership = () => {
 export const useDeactivateOrgMembership = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, DeletOrgMembershipDTO>({
+  return useMutation<object, object, DeletOrgMembershipDTO>({
     mutationFn: ({ membershipId, orgId }) => {
       return apiRequest.post(
         `/api/v2/organizations/${orgId}/memberships/${membershipId}/deactivate`
@@ -236,7 +236,7 @@ export const useDeactivateOrgMembership = () => {
 export const useUpdateOrgMembership = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, UpdateOrgMembershipDTO>({
+  return useMutation<object, object, UpdateOrgMembershipDTO>({
     mutationFn: ({ organizationId, membershipId, role, isActive, metadata }) => {
       return apiRequest.patch(
         `/api/v2/organizations/${organizationId}/memberships/${membershipId}`,
@@ -261,7 +261,7 @@ export const useUpdateOrgMembership = () => {
 
 export const useRegisterUserAction = () => {
   const queryClient = useQueryClient();
-  return useMutation<{}, {}, string>({
+  return useMutation<object, object, string>({
     mutationFn: (action) => apiRequest.post("/api/v1/user-action", { action }),
     onSuccess: () => {
       queryClient.invalidateQueries(userKeys.userAction);

frontend-v2/src/hooks/api/webhooks/mutation.tsx

@@ -8,7 +8,7 @@ import { TCreateWebhookDto, TDeleteWebhookDto, TTestWebhookDTO, TUpdateWebhookDt
 export const useCreateWebhook = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TCreateWebhookDto>({
+  return useMutation<object, object, TCreateWebhookDto>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.post("/api/v1/webhooks", dto);
       return data;
@@ -22,7 +22,7 @@ export const useCreateWebhook = () => {
 export const useTestWebhook = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TTestWebhookDTO>({
+  return useMutation<object, object, TTestWebhookDTO>({
     mutationFn: async ({ webhookId }) => {
       const { data } = await apiRequest.post(`/api/v1/webhooks/${webhookId}/test`);
       return data;
@@ -39,7 +39,7 @@ export const useTestWebhook = () => {
 export const useUpdateWebhook = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TUpdateWebhookDto>({
+  return useMutation<object, object, TUpdateWebhookDto>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.patch(`/api/v1/webhooks/${dto.webhookId}`, {
         isDisabled: dto.isDisabled
@@ -55,7 +55,7 @@ export const useUpdateWebhook = () => {
 export const useDeleteWebhook = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TDeleteWebhookDto>({
+  return useMutation<object, object, TDeleteWebhookDto>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.delete(`/api/v1/webhooks/${dto.webhookId}`);
       return data;

frontend-v2/src/hooks/api/workflowIntegrations/mutation.tsx

@@ -13,7 +13,7 @@ import {
 export const useUpdateSlackIntegration = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TUpdateSlackIntegrationDTO>({
+  return useMutation<object, object, TUpdateSlackIntegrationDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.patch(`/api/v1/workflow-integrations/slack/${dto.id}`, dto);
 
@@ -29,7 +29,7 @@ export const useUpdateSlackIntegration = () => {
 export const useDeleteSlackIntegration = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, TDeleteSlackIntegrationDTO>({
+  return useMutation<object, object, TDeleteSlackIntegrationDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.delete(`/api/v1/workflow-integrations/slack/${dto.id}`);
 

frontend-v2/src/hooks/api/workspace/mutations.tsx

@@ -78,7 +78,7 @@ export const useDeleteGroupFromWorkspace = () => {
 
 export const useLeaveProject = () => {
   const queryClient = useQueryClient();
-  return useMutation<{}, {}, { workspaceId: string }>({
+  return useMutation<object, object, { workspaceId: string }>({
     mutationFn: ({ workspaceId }) => {
       return apiRequest.delete(`/api/v1/workspace/${workspaceId}/leave`);
     },
@@ -90,7 +90,7 @@ export const useLeaveProject = () => {
 
 export const useMigrateProjectToV3 = () => {
   const queryClient = useQueryClient();
-  return useMutation<{}, {}, { workspaceId: string }>({
+  return useMutation<object, object, { workspaceId: string }>({
     mutationFn: ({ workspaceId }) => {
       return apiRequest.post(`/api/v1/workspace/${workspaceId}/migrate-v3`);
     },

frontend-v2/src/hooks/api/workspace/queries.tsx

@@ -76,7 +76,7 @@ export const fetchWorkspaceSecrets = async (workspaceId: string) => {
 export const useUpgradeProject = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, { projectId: string; privateKey: string }>({
+  return useMutation<object, object, { projectId: string; privateKey: string }>({
     mutationFn: ({ projectId, privateKey }) => {
       return apiRequest.post(`/api/v2/workspace/${projectId}/upgrade`, {
         userPrivateKey: privateKey
@@ -171,7 +171,7 @@ export const useGetUserWorkspaceMemberships = (orgId: string) =>
 export const useNameWorkspaceSecrets = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, NameWorkspaceSecretsDTO>({
+  return useMutation<object, object, NameWorkspaceSecretsDTO>({
     mutationFn: async ({ workspaceId, secretsToUpdate }) =>
       apiRequest.post(`/api/v3/workspaces/${workspaceId}/secrets/names`, {
         secretsToUpdate
@@ -225,7 +225,7 @@ export const createWorkspace = (
 export const useCreateWorkspace = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{ data: { project: Workspace } }, {}, CreateWorkspaceDTO>({
+  return useMutation<{ data: { project: Workspace } }, object, CreateWorkspaceDTO>({
     mutationFn: async ({ projectName, projectDescription, kmsKeyId, template, type }) =>
       createWorkspace({
         projectName,
@@ -243,7 +243,7 @@ export const useCreateWorkspace = () => {
 export const useUpdateProject = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<Workspace, {}, UpdateProjectDTO>({
+  return useMutation<Workspace, object, UpdateProjectDTO>({
     mutationFn: async ({ projectID, newProjectName, newProjectDescription }) => {
       const { data } = await apiRequest.patch<{ workspace: Workspace }>(
         `/api/v1/workspace/${projectID}`,
@@ -263,7 +263,7 @@ export const useUpdateProject = () => {
 export const useToggleAutoCapitalization = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<Workspace, {}, ToggleAutoCapitalizationDTO>({
+  return useMutation<Workspace, object, ToggleAutoCapitalizationDTO>({
     mutationFn: async ({ workspaceID, state }) => {
       const { data } = await apiRequest.post<{ workspace: Workspace }>(
         `/api/v1/workspace/${workspaceID}/auto-capitalization`,
@@ -282,7 +282,7 @@ export const useToggleAutoCapitalization = () => {
 export const useUpdateWorkspaceVersionLimit = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<Workspace, {}, UpdatePitVersionLimitDTO>({
+  return useMutation<Workspace, object, UpdatePitVersionLimitDTO>({
     mutationFn: async ({ projectSlug, pitVersionLimit }) => {
       const { data } = await apiRequest.put(`/api/v1/workspace/${projectSlug}/version-limit`, {
         pitVersionLimit
@@ -298,7 +298,7 @@ export const useUpdateWorkspaceVersionLimit = () => {
 export const useUpdateWorkspaceAuditLogsRetention = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<Workspace, {}, UpdateAuditLogsRetentionDTO>({
+  return useMutation<Workspace, object, UpdateAuditLogsRetentionDTO>({
     mutationFn: async ({ projectSlug, auditLogsRetentionDays }) => {
       const { data } = await apiRequest.put(
         `/api/v1/workspace/${projectSlug}/audit-logs-retention`,
@@ -317,7 +317,7 @@ export const useUpdateWorkspaceAuditLogsRetention = () => {
 export const useDeleteWorkspace = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<Workspace, {}, DeleteWorkspaceDTO>({
+  return useMutation<Workspace, object, DeleteWorkspaceDTO>({
     mutationFn: async ({ workspaceID }) => {
       const { data } = await apiRequest.delete(`/api/v1/workspace/${workspaceID}`);
       return data.workspace;
@@ -332,7 +332,7 @@ export const useDeleteWorkspace = () => {
 export const useCreateWsEnvironment = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, CreateEnvironmentDTO>({
+  return useMutation<object, object, CreateEnvironmentDTO>({
     mutationFn: ({ workspaceId, name, slug }) => {
       return apiRequest.post(`/api/v1/workspace/${workspaceId}/environments`, {
         name,
@@ -348,7 +348,7 @@ export const useCreateWsEnvironment = () => {
 export const useUpdateWsEnvironment = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, UpdateEnvironmentDTO>({
+  return useMutation<object, object, UpdateEnvironmentDTO>({
     mutationFn: ({ workspaceId, id, name, slug, position }) => {
       return apiRequest.patch(`/api/v1/workspace/${workspaceId}/environments/${id}`, {
         name,
@@ -365,7 +365,7 @@ export const useUpdateWsEnvironment = () => {
 export const useDeleteWsEnvironment = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, DeleteEnvironmentDTO>({
+  return useMutation<object, object, DeleteEnvironmentDTO>({
     mutationFn: ({ id, workspaceId }) => {
       return apiRequest.delete(`/api/v1/workspace/${workspaceId}/environments/${id}`);
     },

frontend-v2/src/hooks/usePersistentState.ts

@@ -1,8 +1,8 @@
 import { useEffect, useState } from "react";
 
-type TPersisntentStateReturn<T extends unknown> = [T, (val: T) => void];
+type TPersisntentStateReturn<T> = [T, (val: T) => void];
 
-export const usePersistentState = <T extends unknown>(
+export const usePersistentState = <T>(
   initialValue: T,
   persistenceKey: string
 ): TPersisntentStateReturn<T> => {

frontend-v2/src/hooks/useTimedReset.tsx

@@ -1,6 +1,6 @@
 import { Dispatch, SetStateAction, useEffect, useState } from "react";
 
-type Props<T extends unknown> = {
+type Props<T> = {
   initialState: T;
   delay?: number;
 };

frontend-v2/src/layouts/OrganizationLayout/OrganizationLayout.tsx

@@ -1,107 +1,37 @@
 import { useState } from "react";
 import { useTranslation } from "react-i18next";
-import { faGithub, faSlack } from "@fortawesome/free-brands-svg-icons";
-import {
-  faAngleDown,
-  faArrowUpRightFromSquare,
-  faBook,
-  faCheck,
-  faEnvelope,
-  faInfinity,
-  faInfo,
-  faMobile,
-  faPlus,
-  faQuestion
-} from "@fortawesome/free-solid-svg-icons";
+import { faMobile } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { DropdownMenuTrigger } from "@radix-ui/react-dropdown-menu";
+import { Link, Outlet } from "@tanstack/react-router";
 
-import SecurityClient from "@app/components/utilities/SecurityClient";
-import {
-  Button,
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  Menu,
-  MenuItem
-} from "@app/components/v2";
-import { useOrganization, useSubscription, useUser } from "@app/context";
-import { usePopUp, useToggle } from "@app/hooks";
-import {
-  useGetOrganizations,
-  useGetOrgTrialUrl,
-  useLogoutUser,
-  useSelectOrganization
-} from "@app/hooks/api";
-import { MfaMethod } from "@app/hooks/api/auth/types";
-import { AuthMethod } from "@app/hooks/api/users/types";
-import { ProjectType } from "@app/hooks/api/workspace/types";
-import { InsecureConnectionBanner } from "./components/InsecureConnectionBanner";
-// import { navigateUserToOrg } from "@app/views/Login/Login.utils";
-// import { CreateOrgModal } from "@app/views/Org/components";
-
-import { WishForm } from "@app/components/features/WishForm";
 import { Mfa } from "@app/components/auth/Mfa";
-import { Link, Outlet, useNavigate } from "@tanstack/react-router";
+import SecurityClient from "@app/components/utilities/SecurityClient";
+import { Menu, MenuItem } from "@app/components/v2";
+import { useOrganization, useUser } from "@app/context";
+import { usePopUp, useToggle } from "@app/hooks";
+import { useSelectOrganization } from "@app/hooks/api";
+import { MfaMethod } from "@app/hooks/api/auth/types";
+import { ProjectType } from "@app/hooks/api/workspace/types";
 
-const supportOptions = [
-  [
-    <FontAwesomeIcon key={1} className="pr-4 text-sm" icon={faSlack} />,
-    "Support Forum",
-    "https://infisical.com/slack"
-  ],
-  [
-    <FontAwesomeIcon key={2} className="pr-4 text-sm" icon={faBook} />,
-    "Read Docs",
-    "https://infisical.com/docs/documentation/getting-started/introduction"
-  ],
-  [
-    <FontAwesomeIcon key={3} className="pr-4 text-sm" icon={faGithub} />,
-    "GitHub Issues",
-    "https://github.com/Infisical/infisical/issues"
-  ],
-  [
-    <FontAwesomeIcon key={4} className="pr-4 text-sm" icon={faEnvelope} />,
-    "Email Support",
-    "mailto:support@infisical.com"
-  ]
-];
+import { InsecureConnectionBanner } from "./components/InsecureConnectionBanner";
+import { SidebarFooter } from "./components/SidebarFooter";
+import { SidebarHeader } from "./components/SidebarHeader";
 
 export const OrganizationLayout = () => {
-  const navigate = useNavigate();
-
-  const { mutateAsync } = useGetOrgTrialUrl();
-
   const { currentOrg } = useOrganization();
-  const { data: orgs } = useGetOrganizations();
 
   const [shouldShowMfa, toggleShowMfa] = useToggle(false);
   const [requiredMfaMethod, setRequiredMfaMethod] = useState(MfaMethod.EMAIL);
   const [mfaSuccessCallback, setMfaSuccessCallback] = useState<() => void>(() => {});
 
   const { user } = useUser();
-  const { subscription } = useSubscription();
-
-  const infisicalPlatformVersion = process.env.NEXT_PUBLIC_INFISICAL_PLATFORM_VERSION;
 
   const { popUp, handlePopUpToggle } = usePopUp(["createOrg"] as const);
+  const { mutateAsync: selectOrganization } = useSelectOrganization();
 
   const { t } = useTranslation();
 
-  const { mutateAsync: selectOrganization } = useSelectOrganization();
-
-  const logout = useLogoutUser();
-  const logOutUser = async () => {
-    try {
-      console.log("Logging out...");
-      await logout.mutateAsync();
-      navigate({ to: "/login" });
-    } catch (error) {
-      console.error(error);
-    }
-  };
-
-  const changeOrg = async (orgId: string) => {
+  const handleOrgChange = async (orgId: string) => {
     const { token, isMfaEnabled, mfaMethod } = await selectOrganization({
       organizationId: orgId
     });
@@ -112,8 +42,7 @@ export const OrganizationLayout = () => {
         setRequiredMfaMethod(mfaMethod);
       }
       toggleShowMfa.on();
-      setMfaSuccessCallback(() => () => changeOrg(orgId));
-      return;
+      setMfaSuccessCallback(() => () => handleOrgChange(orgId));
     }
 
     // await navigateUserToOrg(router, orgId);
@@ -140,144 +69,7 @@ export const OrganizationLayout = () => {
           <aside className="dark w-full border-r border-mineshaft-600 bg-gradient-to-tr from-mineshaft-700 via-mineshaft-800 to-mineshaft-900 md:w-60">
             <nav className="items-between flex h-full flex-col justify-between overflow-y-auto dark:[color-scheme:dark]">
               <div>
-                <div className="flex h-12 cursor-default items-center px-3 pt-6">
-                  <DropdownMenu>
-                    <DropdownMenuTrigger
-                      asChild
-                      className="max-w-[160px] data-[state=open]:bg-mineshaft-600"
-                    >
-                      <div className="mr-auto flex items-center rounded-md py-1.5 pl-1.5 pr-2 hover:bg-mineshaft-600">
-                        <div className="flex h-5 w-5 min-w-[20px] items-center justify-center rounded-md bg-primary text-sm">
-                          {currentOrg?.name.charAt(0)}
-                        </div>
-                        <div
-                          className="overflow-hidden truncate text-ellipsis pl-2 text-sm text-mineshaft-100"
-                          style={{ maxWidth: "140px" }}
-                        >
-                          {currentOrg?.name}
-                        </div>
-                        <FontAwesomeIcon
-                          icon={faAngleDown}
-                          className="pl-1 pt-1 text-xs text-mineshaft-300"
-                        />
-                      </div>
-                    </DropdownMenuTrigger>
-                    <DropdownMenuContent align="start" className="p-1">
-                      <div className="px-2 py-1 text-xs text-mineshaft-400">{user?.username}</div>
-                      {orgs?.map((org) => {
-                        return (
-                          <DropdownMenuItem key={org.id}>
-                            <Button
-                              onClick={async () => {
-                                if (currentOrg?.id === org.id) return;
-
-                                if (org.authEnforced) {
-                                  // org has an org-level auth method enabled (e.g. SAML)
-                                  // -> logout + redirect to SAML SSO
-
-                                  await logout.mutateAsync();
-                                  if (org.orgAuthMethod === AuthMethod.OIDC) {
-                                    window.open(`/api/v1/sso/oidc/login?orgSlug=${org.slug}`);
-                                  } else {
-                                    window.open(
-                                      `/api/v1/sso/redirect/saml2/organizations/${org.slug}`
-                                    );
-                                  }
-                                  window.close();
-                                  return;
-                                }
-
-                                changeOrg(org?.id);
-                              }}
-                              variant="plain"
-                              colorSchema="secondary"
-                              size="xs"
-                              className="flex w-full items-center justify-start p-0 font-normal"
-                              leftIcon={
-                                currentOrg?.id === org.id && (
-                                  <FontAwesomeIcon icon={faCheck} className="mr-3 text-primary" />
-                                )
-                              }
-                            >
-                              <div className="flex w-full max-w-[150px] items-center justify-between truncate">
-                                {org.name}
-                              </div>
-                            </Button>
-                          </DropdownMenuItem>
-                        );
-                      })}
-
-                      <div className="mt-1 h-1 border-t border-mineshaft-600" />
-                      <button type="button" onClick={logOutUser} className="w-full">
-                        <DropdownMenuItem>Log Out</DropdownMenuItem>
-                      </button>
-                    </DropdownMenuContent>
-                  </DropdownMenu>
-                  <DropdownMenu>
-                    <DropdownMenuTrigger
-                      asChild
-                      className="p-1 hover:bg-primary-400 hover:text-black data-[state=open]:bg-primary-400 data-[state=open]:text-black"
-                    >
-                      <div
-                        className="child flex items-center justify-center rounded-full bg-mineshaft pr-1 text-mineshaft-300 hover:bg-mineshaft-500"
-                        style={{ fontSize: "11px", width: "26px", height: "26px" }}
-                      >
-                        {user?.firstName?.charAt(0)}
-                        {user?.lastName && user?.lastName?.charAt(0)}
-                      </div>
-                    </DropdownMenuTrigger>
-                    <DropdownMenuContent align="start" className="p-1">
-                      <div className="px-2 py-1 text-xs text-mineshaft-400">{user?.username}</div>
-                      <Link to="/personal-settings">
-                        <DropdownMenuItem>Personal Settings</DropdownMenuItem>
-                      </Link>
-                      <a
-                        href="https://infisical.com/docs/documentation/getting-started/introduction"
-                        target="_blank"
-                        rel="noopener noreferrer"
-                        className="mt-3 w-full text-sm font-normal leading-[1.2rem] text-mineshaft-300 hover:text-mineshaft-100"
-                      >
-                        <DropdownMenuItem>
-                          Documentation
-                          <FontAwesomeIcon
-                            icon={faArrowUpRightFromSquare}
-                            className="mb-[0.06rem] pl-1.5 text-xxs"
-                          />
-                        </DropdownMenuItem>
-                      </a>
-                      <a
-                        href="https://infisical.com/slack"
-                        target="_blank"
-                        rel="noopener noreferrer"
-                        className="mt-3 w-full text-sm font-normal leading-[1.2rem] text-mineshaft-300 hover:text-mineshaft-100"
-                      >
-                        <DropdownMenuItem>
-                          Join Slack Community
-                          <FontAwesomeIcon
-                            icon={faArrowUpRightFromSquare}
-                            className="mb-[0.06rem] pl-1.5 text-xxs"
-                          />
-                        </DropdownMenuItem>
-                      </a>
-                      {user?.superAdmin && (
-                        <Link to="/admin">
-                          <DropdownMenuItem className="mt-1 border-t border-mineshaft-600">
-                            Server Admin Console
-                          </DropdownMenuItem>
-                        </Link>
-                      )}
-                      <Link to={`/org/${currentOrg?.id}/admin`}>
-                        <DropdownMenuItem className="mt-1 border-t border-mineshaft-600">
-                          Organization Admin Console
-                        </DropdownMenuItem>
-                      </Link>
-                      <div className="mt-1 h-1 border-t border-mineshaft-600" />
-                      <button type="button" onClick={logOutUser} className="w-full">
-                        <DropdownMenuItem>Log Out</DropdownMenuItem>
-                      </button>
-                    </DropdownMenuContent>
-                  </DropdownMenu>
-                </div>
+                <SidebarHeader onChangeOrg={handleOrgChange} />
                 <div className="px-1">
                   <Menu className="mt-4">
                     <Link
@@ -394,96 +186,7 @@ export const OrganizationLayout = () => {
                   </Menu>
                 </div>
               </div>
-              <div
-                className={`relative mt-10 ${
-                  subscription && subscription.slug === "starter" && !subscription.has_used_trial
-                    ? "mb-2"
-                    : "mb-4"
-                } flex w-full cursor-default flex-col items-center px-3 text-sm text-mineshaft-400`}
-              >
-                {(window.location.origin.includes("https://app.infisical.com") ||
-                  window.location.origin.includes("https://gamma.infisical.com")) && <WishForm />}
-                <div
-                  onKeyDown={() => null}
-                  role="button"
-                  tabIndex={0}
-                  onClick={() =>
-                    navigate({
-                      to: "/organization/$organizationId/members",
-                      params: {
-                        organizationId: currentOrg?.id
-                      },
-                      search: {
-                        action: "invite"
-                      }
-                    })
-                  }
-                  className="w-full"
-                >
-                  <div className="mb-3 w-full pl-5 duration-200 hover:text-mineshaft-200">
-                    <FontAwesomeIcon icon={faPlus} className="mr-3" />
-                    Invite people
-                  </div>
-                </div>
-                <DropdownMenu>
-                  <DropdownMenuTrigger asChild>
-                    <div className="mb-2 w-full pl-5 duration-200 hover:text-mineshaft-200">
-                      <FontAwesomeIcon icon={faQuestion} className="mr-3 px-[0.1rem]" />
-                      Help & Support
-                    </div>
-                  </DropdownMenuTrigger>
-                  <DropdownMenuContent align="start" className="p-1">
-                    {supportOptions.map(([icon, text, url]) => (
-                      <DropdownMenuItem key={url as string}>
-                        <a
-                          target="_blank"
-                          rel="noopener noreferrer"
-                          href={String(url)}
-                          className="flex w-full items-center rounded-md font-normal text-mineshaft-300 duration-200"
-                        >
-                          <div className="relative flex w-full cursor-pointer select-none items-center justify-start rounded-md">
-                            {icon}
-                            <div className="text-sm">{text}</div>
-                          </div>
-                        </a>
-                      </DropdownMenuItem>
-                    ))}
-                    {infisicalPlatformVersion && (
-                      <div className="mb-2 mt-2 w-full cursor-default pl-5 text-sm duration-200 hover:text-mineshaft-200">
-                        <FontAwesomeIcon icon={faInfo} className="mr-4 px-[0.1rem]" />
-                        Version: {infisicalPlatformVersion}
-                      </div>
-                    )}
-                  </DropdownMenuContent>
-                </DropdownMenu>
-                {subscription &&
-                  subscription.slug === "starter" &&
-                  !subscription.has_used_trial && (
-                    <button
-                      type="button"
-                      onClick={async () => {
-                        if (!subscription || !currentOrg) return;
-
-                        // direct user to start pro trial
-                        const url = await mutateAsync({
-                          orgId: currentOrg.id,
-                          success_url: window.location.href
-                        });
-
-                        window.location.href = url;
-                      }}
-                      className="mt-1.5 w-full"
-                    >
-                      <div className="justify-left mb-1.5 mt-1.5 flex w-full items-center rounded-md bg-mineshaft-600 py-1 pl-4 text-mineshaft-300 duration-200 hover:bg-mineshaft-500 hover:text-primary-400">
-                        <FontAwesomeIcon
-                          icon={faInfinity}
-                          className="ml-0.5 mr-3 py-2 text-primary"
-                        />
-                        Start Free Pro Trial
-                      </div>
-                    </button>
-                  )}
-              </div>
+              <SidebarFooter />
             </nav>
           </aside>
           {

frontend-v2/src/layouts/OrganizationLayout/components/InsecureConnectionBanner/InsecureConnectionBanner.tsx

@@ -17,7 +17,7 @@ export const InsecureConnectionBanner = () => {
   if (isAcknowledged) return null;
 
   return (
-    <div className="flex w-screen items-start border-b border-red-900 bg-red-700 py-1 px-2 font-inter text-sm text-mineshaft-200">
+    <div className="flex w-screen items-start border-b border-red-900 bg-red-700 px-2 py-1 font-inter text-sm text-mineshaft-200">
       <FontAwesomeIcon className="ml-3.5 mt-1" icon={faWarning} />
       <span className="mx-1 ml-2 mt-[0.04rem]">
         Your connection to this Infisical instance is not secured via HTTPS. Some features may not

frontend-v2/src/layouts/OrganizationLayout/components/SidebarFooter/SidebarFooter.tsx

@@ -0,0 +1,134 @@
+import { faGithub, faSlack } from "@fortawesome/free-brands-svg-icons";
+import {
+  faBook,
+  faEnvelope,
+  faInfinity,
+  faInfo,
+  faPlus,
+  faQuestion
+} from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { Link } from "@tanstack/react-router";
+
+import { WishForm } from "@app/components/features/WishForm";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger
+} from "@app/components/v2";
+import { useOrganization, useSubscription } from "@app/context";
+import { useGetOrgTrialUrl } from "@app/hooks/api";
+
+const supportOptions = [
+  [
+    <FontAwesomeIcon key={1} className="pr-4 text-sm" icon={faSlack} />,
+    "Support Forum",
+    "https://infisical.com/slack"
+  ],
+  [
+    <FontAwesomeIcon key={2} className="pr-4 text-sm" icon={faBook} />,
+    "Read Docs",
+    "https://infisical.com/docs/documentation/getting-started/introduction"
+  ],
+  [
+    <FontAwesomeIcon key={3} className="pr-4 text-sm" icon={faGithub} />,
+    "GitHub Issues",
+    "https://github.com/Infisical/infisical/issues"
+  ],
+  [
+    <FontAwesomeIcon key={4} className="pr-4 text-sm" icon={faEnvelope} />,
+    "Email Support",
+    "mailto:support@infisical.com"
+  ]
+];
+
+export const SidebarFooter = () => {
+  const { subscription } = useSubscription();
+  const { currentOrg } = useOrganization();
+
+  const { mutateAsync } = useGetOrgTrialUrl();
+
+  const infisicalPlatformVersion = import.meta.env.VITE_INFISICAL_PLATFORM_VERSION;
+
+  return (
+    <div
+      className={`relative mt-10 ${
+        subscription && subscription.slug === "starter" && !subscription.has_used_trial
+          ? "mb-2"
+          : "mb-4"
+      } flex w-full cursor-default flex-col items-center px-3 text-sm text-mineshaft-400`}
+    >
+      {(window.location.origin.includes("https://app.infisical.com") ||
+        window.location.origin.includes("https://gamma.infisical.com")) && <WishForm />}
+      <Link
+        to="/organization/$organizationId/members"
+        params={{
+          organizationId: currentOrg?.id
+        }}
+        search={{
+          action: "invite"
+        }}
+        className="w-full"
+      >
+        <div className="mb-3 w-full pl-5 duration-200 hover:text-mineshaft-200">
+          <FontAwesomeIcon icon={faPlus} className="mr-3" />
+          Invite people
+        </div>
+      </Link>
+      <DropdownMenu>
+        <DropdownMenuTrigger asChild>
+          <div className="mb-2 w-full pl-5 duration-200 hover:text-mineshaft-200">
+            <FontAwesomeIcon icon={faQuestion} className="mr-3 px-[0.1rem]" />
+            Help & Support
+          </div>
+        </DropdownMenuTrigger>
+        <DropdownMenuContent align="start" className="p-1">
+          {supportOptions.map(([icon, text, url]) => (
+            <DropdownMenuItem key={url as string}>
+              <a
+                target="_blank"
+                rel="noopener noreferrer"
+                href={String(url)}
+                className="flex w-full items-center rounded-md font-normal text-mineshaft-300 duration-200"
+              >
+                <div className="relative flex w-full cursor-pointer select-none items-center justify-start rounded-md">
+                  {icon}
+                  <div className="text-sm">{text}</div>
+                </div>
+              </a>
+            </DropdownMenuItem>
+          ))}
+          {infisicalPlatformVersion && (
+            <div className="mb-2 mt-2 w-full cursor-default pl-5 text-sm duration-200 hover:text-mineshaft-200">
+              <FontAwesomeIcon icon={faInfo} className="mr-4 px-[0.1rem]" />
+              Version: {infisicalPlatformVersion}
+            </div>
+          )}
+        </DropdownMenuContent>
+      </DropdownMenu>
+      {subscription && subscription.slug === "starter" && !subscription.has_used_trial && (
+        <button
+          type="button"
+          onClick={async () => {
+            if (!subscription || !currentOrg) return;
+
+            // direct user to start pro trial
+            const url = await mutateAsync({
+              orgId: currentOrg.id,
+              success_url: window.location.href
+            });
+
+            window.location.href = url;
+          }}
+          className="mt-1.5 w-full"
+        >
+          <div className="justify-left mb-1.5 mt-1.5 flex w-full items-center rounded-md bg-mineshaft-600 py-1 pl-4 text-mineshaft-300 duration-200 hover:bg-mineshaft-500 hover:text-primary-400">
+            <FontAwesomeIcon icon={faInfinity} className="ml-0.5 mr-3 py-2 text-primary" />
+            Start Free Pro Trial
+          </div>
+        </button>
+      )}
+    </div>
+  );
+};

frontend-v2/src/layouts/OrganizationLayout/components/SidebarFooter/index.tsx

@@ -0,0 +1 @@
+export { SidebarFooter } from "./SidebarFooter";

frontend-v2/src/layouts/OrganizationLayout/components/SidebarHeader/SidebarHeader.tsx

@@ -0,0 +1,169 @@
+import { faAngleDown, faArrowUpRightFromSquare, faCheck } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { Link, useNavigate } from "@tanstack/react-router";
+
+import {
+  Button,
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger
+} from "@app/components/v2";
+import { useOrganization, useUser } from "@app/context";
+import { useGetOrganizations, useLogoutUser } from "@app/hooks/api";
+import { AuthMethod } from "@app/hooks/api/users/types";
+
+type Prop = {
+  onChangeOrg: (orgId: string) => void;
+};
+
+export const SidebarHeader = ({ onChangeOrg }: Prop) => {
+  const { currentOrg } = useOrganization();
+  const { user } = useUser();
+  const navigate = useNavigate();
+  const { data: orgs } = useGetOrganizations();
+
+  const logout = useLogoutUser();
+  const logOutUser = async () => {
+    try {
+      console.log("Logging out...");
+      await logout.mutateAsync();
+      navigate({ to: "/login" });
+    } catch (error) {
+      console.error(error);
+    }
+  };
+
+  return (
+    <div className="flex h-12 cursor-default items-center px-3 pt-6">
+      <DropdownMenu>
+        <DropdownMenuTrigger asChild className="max-w-[160px] data-[state=open]:bg-mineshaft-600">
+          <div className="mr-auto flex items-center rounded-md py-1.5 pl-1.5 pr-2 hover:bg-mineshaft-600">
+            <div className="flex h-5 w-5 min-w-[20px] items-center justify-center rounded-md bg-primary text-sm">
+              {currentOrg?.name.charAt(0)}
+            </div>
+            <div
+              className="overflow-hidden truncate text-ellipsis pl-2 text-sm text-mineshaft-100"
+              style={{ maxWidth: "140px" }}
+            >
+              {currentOrg?.name}
+            </div>
+            <FontAwesomeIcon icon={faAngleDown} className="pl-1 pt-1 text-xs text-mineshaft-300" />
+          </div>
+        </DropdownMenuTrigger>
+        <DropdownMenuContent align="start" className="p-1">
+          <div className="px-2 py-1 text-xs text-mineshaft-400">{user?.username}</div>
+          {orgs?.map((org) => {
+            return (
+              <DropdownMenuItem key={org.id}>
+                <Button
+                  onClick={async () => {
+                    if (currentOrg?.id === org.id) return;
+
+                    if (org.authEnforced) {
+                      // org has an org-level auth method enabled (e.g. SAML)
+                      // -> logout + redirect to SAML SSO
+
+                      await logout.mutateAsync();
+                      if (org.orgAuthMethod === AuthMethod.OIDC) {
+                        window.open(`/api/v1/sso/oidc/login?orgSlug=${org.slug}`);
+                      } else {
+                        window.open(`/api/v1/sso/redirect/saml2/organizations/${org.slug}`);
+                      }
+                      window.close();
+                      return;
+                    }
+
+                    onChangeOrg(org?.id);
+                  }}
+                  variant="plain"
+                  colorSchema="secondary"
+                  size="xs"
+                  className="flex w-full items-center justify-start p-0 font-normal"
+                  leftIcon={
+                    currentOrg?.id === org.id && (
+                      <FontAwesomeIcon icon={faCheck} className="mr-3 text-primary" />
+                    )
+                  }
+                >
+                  <div className="flex w-full max-w-[150px] items-center justify-between truncate">
+                    {org.name}
+                  </div>
+                </Button>
+              </DropdownMenuItem>
+            );
+          })}
+
+          <div className="mt-1 h-1 border-t border-mineshaft-600" />
+          <button type="button" onClick={logOutUser} className="w-full">
+            <DropdownMenuItem>Log Out</DropdownMenuItem>
+          </button>
+        </DropdownMenuContent>
+      </DropdownMenu>
+      <DropdownMenu>
+        <DropdownMenuTrigger
+          asChild
+          className="p-1 hover:bg-primary-400 hover:text-black data-[state=open]:bg-primary-400 data-[state=open]:text-black"
+        >
+          <div
+            className="child flex items-center justify-center rounded-full bg-mineshaft pr-1 text-mineshaft-300 hover:bg-mineshaft-500"
+            style={{ fontSize: "11px", width: "26px", height: "26px" }}
+          >
+            {user?.firstName?.charAt(0)}
+            {user?.lastName && user?.lastName?.charAt(0)}
+          </div>
+        </DropdownMenuTrigger>
+        <DropdownMenuContent align="start" className="p-1">
+          <div className="px-2 py-1 text-xs text-mineshaft-400">{user?.username}</div>
+          <Link to="/personal-settings">
+            <DropdownMenuItem>Personal Settings</DropdownMenuItem>
+          </Link>
+          <a
+            href="https://infisical.com/docs/documentation/getting-started/introduction"
+            target="_blank"
+            rel="noopener noreferrer"
+            className="mt-3 w-full text-sm font-normal leading-[1.2rem] text-mineshaft-300 hover:text-mineshaft-100"
+          >
+            <DropdownMenuItem>
+              Documentation
+              <FontAwesomeIcon
+                icon={faArrowUpRightFromSquare}
+                className="mb-[0.06rem] pl-1.5 text-xxs"
+              />
+            </DropdownMenuItem>
+          </a>
+          <a
+            href="https://infisical.com/slack"
+            target="_blank"
+            rel="noopener noreferrer"
+            className="mt-3 w-full text-sm font-normal leading-[1.2rem] text-mineshaft-300 hover:text-mineshaft-100"
+          >
+            <DropdownMenuItem>
+              Join Slack Community
+              <FontAwesomeIcon
+                icon={faArrowUpRightFromSquare}
+                className="mb-[0.06rem] pl-1.5 text-xxs"
+              />
+            </DropdownMenuItem>
+          </a>
+          {user?.superAdmin && (
+            <Link to="/admin">
+              <DropdownMenuItem className="mt-1 border-t border-mineshaft-600">
+                Server Admin Console
+              </DropdownMenuItem>
+            </Link>
+          )}
+          <Link to={`/org/${currentOrg?.id}/admin`}>
+            <DropdownMenuItem className="mt-1 border-t border-mineshaft-600">
+              Organization Admin Console
+            </DropdownMenuItem>
+          </Link>
+          <div className="mt-1 h-1 border-t border-mineshaft-600" />
+          <button type="button" onClick={logOutUser} className="w-full">
+            <DropdownMenuItem>Log Out</DropdownMenuItem>
+          </button>
+        </DropdownMenuContent>
+      </DropdownMenu>
+    </div>
+  );
+};

frontend-v2/src/layouts/OrganizationLayout/components/SidebarHeader/index.tsx

@@ -0,0 +1 @@
+export { SidebarHeader } from "./SidebarHeader";

frontend-v2/src/routes/_authenticate.tsx

@@ -1,10 +1,10 @@
 import { createFileRoute, redirect } from "@tanstack/react-router";
 
 import { createNotification } from "@app/components/notifications";
-import { authKeys, fetchAuthToken } from "@app/hooks/api/auth/queries";
 import { userKeys } from "@app/hooks/api";
-import { fetchUserDetails } from "@app/hooks/api/users/queries";
+import { authKeys, fetchAuthToken } from "@app/hooks/api/auth/queries";
 import { setAuthToken } from "@app/hooks/api/reactQuery";
+import { fetchUserDetails } from "@app/hooks/api/users/queries";
 
 export const Route = createFileRoute("/_authenticate")({
   beforeLoad: async ({ context, location }) => {

frontend-v2/src/routes/_authenticate/_org_details.tsx

@@ -1,6 +1,7 @@
+import { createFileRoute } from "@tanstack/react-router";
+
 import { fetchOrganizationById, organizationKeys } from "@app/hooks/api/organization/queries";
 import { fetchOrgSubscription, subscriptionQueryKeys } from "@app/hooks/api/subscriptions/queries";
-import { createFileRoute } from "@tanstack/react-router";
 
 export const Route = createFileRoute("/_authenticate/_org_details")({
   beforeLoad: async ({ context }) => {

frontend-v2/src/routes/_authenticate/_org_details/_organization_layout.tsx

@@ -1,6 +1,7 @@
-import { OrganizationLayout } from "@app/layouts/OrganizationLayout";
 import { createFileRoute } from "@tanstack/react-router";
 
+import { OrganizationLayout } from "@app/layouts/OrganizationLayout";
+
 export const Route = createFileRoute("/_authenticate/_org_details/_organization_layout")({
   component: OrganizationLayout
 });

frontend-v2/src/routes/_authenticate/_org_details/_organization_layout/organization/$organizationId/index.tsx

@@ -1,15 +1,11 @@
-import {
-  createFileRoute,
-  useRouteContext,
-  useRouter,
-} from '@tanstack/react-router'
+import { createFileRoute, useRouteContext, useRouter } from "@tanstack/react-router";
 
 function RouteComponent() {
   const user = useRouteContext({
-    from: '/_authenticate',
-    select: (el) => el.user,
-  })
-  const router = useRouter()
+    from: "/_authenticate",
+    select: (el) => el.user
+  });
+  const router = useRouter();
 
   return (
     <div>
@@ -19,20 +15,20 @@ function RouteComponent() {
         onClick={() => {
           router.invalidate({
             filter: (d) => {
-              console.log(d)
-              return true
-            },
-          })
+              console.log(d);
+              return true;
+            }
+          });
         }}
       >
         Click
       </button>
     </div>
-  )
+  );
 }
 
 export const Route = createFileRoute(
-  '/_authenticate/_org_details/_organization_layout/organization/$organizationId/',
+  "/_authenticate/_org_details/_organization_layout/organization/$organizationId/"
 )({
-  component: RouteComponent,
-})
+  component: RouteComponent
+});

frontend-v2/src/routes/_authenticate/_org_details/_organization_layout/organization/$organizationId/secret-manager.tsx

@@ -1,11 +1,11 @@
-import { createFileRoute } from '@tanstack/react-router'
+import { createFileRoute } from "@tanstack/react-router";
 
 function SecretManagerOverviewPage() {
-  return <div>Hello "/organization/secret-manager"!</div>
+  return <div>Hello "/organization/secret-manager"!</div>;
 }
 
 export const Route = createFileRoute(
-  '/_authenticate/_org_details/_organization_layout/organization/$organizationId/secret-manager',
+  "/_authenticate/_org_details/_organization_layout/organization/$organizationId/secret-manager"
 )({
-  component: SecretManagerOverviewPage,
-})
+  component: SecretManagerOverviewPage
+});

frontend-v2/src/routes/_authenticate/_restrict_login_signup/login/-components/PasswordStep/PasswordStep.tsx

@@ -6,6 +6,7 @@ import axios from "axios";
 import { addSeconds, formatISO } from "date-fns";
 import { jwtDecode } from "jwt-decode";
 
+import { Mfa } from "@app/components/auth/Mfa";
 import { createNotification } from "@app/components/notifications";
 import attemptCliLogin from "@app/components/utilities/attemptCliLogin";
 import attemptLogin from "@app/components/utilities/attemptLogin";
@@ -20,7 +21,6 @@ import { fetchOrganizations } from "@app/hooks/api/organization/queries";
 import { fetchMyPrivateKey } from "@app/hooks/api/users/queries";
 
 import { navigateUserToOrg, useNavigateToSelectOrganization } from "../Login.utils";
-import { Mfa } from "@app/components/auth/Mfa";
 
 type Props = {
   providerAuthToken: string;

frontend-v2/src/routes/_authenticate/_restrict_login_signup/login/select-organization/index.tsx

@@ -8,6 +8,7 @@ import axios from "axios";
 import { addSeconds, formatISO } from "date-fns";
 import { jwtDecode } from "jwt-decode";
 
+import { Mfa } from "@app/components/auth/Mfa";
 import { createNotification } from "@app/components/notifications";
 import { IsCliLoginSuccessful } from "@app/components/utilities/attemptCliLogin";
 import SecurityClient from "@app/components/utilities/SecurityClient";
@@ -26,7 +27,6 @@ import { Organization } from "@app/hooks/api/types";
 import { AuthMethod } from "@app/hooks/api/users/types";
 
 import { navigateUserToOrg } from "../-components/Login.utils";
-import { Mfa } from "../-components/Mfa";
 
 const LoadingScreen = () => {
   return (