Merge pull request #1034 from akhilmhdh/feat/patch-dashboardv3

feat(dashboard-v3): patched dashboard copy sec bug

backend/src/controllers/v1/index.ts

@@ -16,6 +16,7 @@ import * as workspaceController from "./workspaceController";
 import * as secretScanningController from "./secretScanningController";
 import * as webhookController from "./webhookController";
 import * as secretImpsController from "./secretImpsController";
+import * as secretApprovalPolicyController from "./secretApprovalPolicyController";
 
 export {
   authController,
@@ -35,5 +36,6 @@ export {
   workspaceController,
   secretScanningController,
   webhookController,
-  secretImpsController
+  secretImpsController,
+  secretApprovalPolicyController
 };

backend/src/controllers/v1/secretApprovalPolicyController.ts

@@ -0,0 +1,109 @@
+import { ForbiddenError } from "@casl/ability";
+import { Request, Response } from "express";
+import {
+  ProjectPermissionActions,
+  ProjectPermissionSub,
+  getUserProjectPermissions
+} from "../../ee/services/ProjectRoleService";
+import { validateRequest } from "../../helpers/validation";
+import { SecretApprovalPolicy } from "../../models/secretApprovalPolicy";
+import { BadRequestError } from "../../utils/errors";
+import * as reqValidator from "../../validation/secretApproval";
+
+const ERR_SECRET_APPROVAL_NOT_FOUND = BadRequestError({ message: "secret approval not found" });
+
+export const createSecretApprovalPolicy = async (req: Request, res: Response) => {
+  const {
+    body: { approvals, secretPath, approvers, environment, workspaceId }
+  } = await validateRequest(reqValidator.CreateSecretApprovalRule, req);
+
+  const { permission } = await getUserProjectPermissions(req.user._id, workspaceId);
+  ForbiddenError.from(permission).throwUnlessCan(
+    ProjectPermissionActions.Create,
+    ProjectPermissionSub.SecretApproval
+  );
+
+  const secretApproval = new SecretApprovalPolicy({
+    workspace: workspaceId,
+    secretPath,
+    environment,
+    approvals,
+    approvers
+  });
+  await secretApproval.save();
+
+  return res.send({
+    approval: secretApproval
+  });
+};
+
+export const updateSecretApprovalPolicy = async (req: Request, res: Response) => {
+  const {
+    body: { approvals, approvers, secretPath },
+    params: { id }
+  } = await validateRequest(reqValidator.UpdateSecretApprovalRule, req);
+
+  const secretApproval = await SecretApprovalPolicy.findById(id);
+  if (!secretApproval) throw ERR_SECRET_APPROVAL_NOT_FOUND;
+
+  const { permission } = await getUserProjectPermissions(
+    req.user._id,
+    secretApproval.workspace.toString()
+  );
+  ForbiddenError.from(permission).throwUnlessCan(
+    ProjectPermissionActions.Edit,
+    ProjectPermissionSub.SecretApproval
+  );
+
+  const updatedDoc = await SecretApprovalPolicy.findByIdAndUpdate(id, {
+    approvals,
+    approvers,
+    ...(secretPath === null ? { $unset: { secretPath: 1 } } : { secretPath })
+  });
+
+  return res.send({
+    approval: updatedDoc
+  });
+};
+
+export const deleteSecretApprovalPolicy = async (req: Request, res: Response) => {
+  const {
+    params: { id }
+  } = await validateRequest(reqValidator.DeleteSecretApprovalRule, req);
+
+  const secretApproval = await SecretApprovalPolicy.findById(id);
+  if (!secretApproval) throw ERR_SECRET_APPROVAL_NOT_FOUND;
+
+  const { permission } = await getUserProjectPermissions(
+    req.user._id,
+    secretApproval.workspace.toString()
+  );
+  ForbiddenError.from(permission).throwUnlessCan(
+    ProjectPermissionActions.Delete,
+    ProjectPermissionSub.SecretApproval
+  );
+
+  const deletedDoc = await SecretApprovalPolicy.findByIdAndDelete(id);
+
+  return res.send({
+    approval: deletedDoc
+  });
+};
+
+export const getSecretApprovalPolicy = async (req: Request, res: Response) => {
+  const {
+    query: { workspaceId }
+  } = await validateRequest(reqValidator.GetSecretApprovalRuleList, req);
+
+  const { permission } = await getUserProjectPermissions(req.user._id, workspaceId);
+  ForbiddenError.from(permission).throwUnlessCan(
+    ProjectPermissionActions.Read,
+    ProjectPermissionSub.SecretApproval
+  );
+
+  const doc = await SecretApprovalPolicy.find({ workspace: workspaceId });
+
+  return res.send({
+    approvals: doc
+  });
+};

backend/src/controllers/v1/secretImpsController.ts

@@ -2,7 +2,7 @@ import { Request, Response } from "express";
 import { isValidScope } from "../../helpers";
 import { Folder, IServiceTokenData, SecretImport, ServiceTokenData } from "../../models";
 import { getAllImportedSecrets } from "../../services/SecretImportService";
-import { getFolderWithPathFromId } from "../../services/FolderService";
+import { getFolderByPath, getFolderWithPathFromId } from "../../services/FolderService";
 import {
   BadRequestError,
   ResourceNotFoundError,
@@ -95,37 +95,12 @@ export const createSecretImp = async (req: Request, res: Response) => {
   */
 
   const {
-    body: { workspaceId, environment, folderId, secretImport }
+    body: { workspaceId, environment, directory, secretImport }
   } = await validateRequest(reqValidator.CreateSecretImportV1, req);
 
-  const folders = await Folder.findOne({
-    workspace: workspaceId,
-    environment
-  }).lean();
-
-  if (!folders && folderId !== "root") {
-    throw ResourceNotFoundError({
-      message: "Failed to find folder"
-    });
-  }
-
-  let secretPath = "/";
-  if (folders) {
-    const { folderPath } = getFolderWithPathFromId(folders.nodes, folderId);
-    secretPath = folderPath;
-  }
-
   if (req.authData.authPayload instanceof ServiceTokenData) {
     // root check
-    let isValidScopeAccess = isValidScope(req.authData.authPayload, environment, secretPath);
-    if (!isValidScopeAccess) {
-      throw UnauthorizedRequestError({ message: "Folder Permission Denied" });
-    }
-    isValidScopeAccess = isValidScope(
-      req.authData.authPayload,
-      secretImport.environment,
-      secretImport.secretPath
-    );
+    const isValidScopeAccess = isValidScope(req.authData.authPayload, environment, directory);
     if (!isValidScopeAccess) {
       throw UnauthorizedRequestError({ message: "Folder Permission Denied" });
     }
@@ -133,27 +108,31 @@ export const createSecretImp = async (req: Request, res: Response) => {
     const { permission } = await getUserProjectPermissions(req.user._id, workspaceId);
     ForbiddenError.from(permission).throwUnlessCan(
       ProjectPermissionActions.Create,
-      subject(ProjectPermissionSub.Secrets, { environment, secretPath })
-    );
-    ForbiddenError.from(permission).throwUnlessCan(
-      ProjectPermissionActions.Read,
-      subject(ProjectPermissionSub.Secrets, {
-        environment: secretImport.environment,
-        secretPath: secretImport.secretPath
-      })
+      subject(ProjectPermissionSub.Secrets, { environment, secretPath: directory })
     );
   }
 
+  const folders = await Folder.findOne({
+    workspace: workspaceId,
+    environment
+  }).lean();
+
+  if (!folders && directory !== "/")
+    throw ResourceNotFoundError({ message: "Failed to find folder" });
+
+  let folderId = "root";
+  if (folders) {
+    const folder = getFolderByPath(folders.nodes, directory);
+    if (!folder) throw BadRequestError({ message: "Folder not found" });
+    folderId = folder.id;
+  }
+
   const importSecDoc = await SecretImport.findOne({
     workspace: workspaceId,
     environment,
     folderId
   });
 
-  const importToSecretPath = folders
-    ? getFolderWithPathFromId(folders.nodes, folderId).folderPath
-    : "/";
-
   if (!importSecDoc) {
     const doc = new SecretImport({
       workspace: workspaceId,
@@ -173,7 +152,7 @@ export const createSecretImp = async (req: Request, res: Response) => {
           importFromEnvironment: secretImport.environment,
           importFromSecretPath: secretImport.secretPath,
           importToEnvironment: environment,
-          importToSecretPath
+          importToSecretPath: directory
         }
       },
       {
@@ -206,7 +185,7 @@ export const createSecretImp = async (req: Request, res: Response) => {
         importFromEnvironment: secretImport.environment,
         importFromSecretPath: secretImport.secretPath,
         importToEnvironment: environment,
-        importToSecretPath
+        importToSecretPath: directory
       }
     },
     {
@@ -563,8 +542,38 @@ export const getSecretImports = async (req: Request, res: Response) => {
     }
   */
   const {
-    query: { workspaceId, environment, folderId }
+    query: { workspaceId, environment, directory }
   } = await validateRequest(reqValidator.GetSecretImportsV1, req);
+
+  if (req.authData.authPayload instanceof ServiceTokenData) {
+    const isValidScopeAccess = isValidScope(req.authData.authPayload, environment, directory);
+    if (!isValidScopeAccess) {
+      throw UnauthorizedRequestError({ message: "Folder Permission Denied" });
+    }
+  } else {
+    const { permission } = await getUserProjectPermissions(req.user._id, workspaceId);
+    ForbiddenError.from(permission).throwUnlessCan(
+      ProjectPermissionActions.Read,
+      subject(ProjectPermissionSub.Secrets, {
+        environment,
+        secretPath: directory
+      })
+    );
+  }
+
+  const folders = await Folder.findOne({
+    workspace: workspaceId,
+    environment
+  }).lean();
+  if (!folders && directory !== "/") throw BadRequestError({ message: "Folder not found" });
+
+  let folderId = "root";
+  if (folders) {
+    const folder = getFolderByPath(folders.nodes, directory);
+    if (!folder) throw BadRequestError({ message: "Folder not found" });
+    folderId = folder.id;
+  }
+
   const importSecDoc = await SecretImport.findOne({
     workspace: workspaceId,
     environment,
@@ -575,41 +584,6 @@ export const getSecretImports = async (req: Request, res: Response) => {
     return res.status(200).json({ secretImport: {} });
   }
 
-  // check for service token validity
-  const folders = await Folder.findOne({
-    workspace: importSecDoc.workspace,
-    environment: importSecDoc.environment
-  }).lean();
-
-  let secretPath = "/";
-  if (folders) {
-    const { folderPath } = getFolderWithPathFromId(folders.nodes, importSecDoc.folderId);
-    secretPath = folderPath;
-  }
-
-  if (req.authData.authPayload instanceof ServiceTokenData) {
-    const isValidScopeAccess = isValidScope(
-      req.authData.authPayload,
-      importSecDoc.environment,
-      secretPath
-    );
-    if (!isValidScopeAccess) {
-      throw UnauthorizedRequestError({ message: "Folder Permission Denied" });
-    }
-  } else {
-    const { permission } = await getUserProjectPermissions(
-      req.user._id,
-      importSecDoc.workspace.toString()
-    );
-    ForbiddenError.from(permission).throwUnlessCan(
-      ProjectPermissionActions.Read,
-      subject(ProjectPermissionSub.Secrets, {
-        environment: importSecDoc.environment,
-        secretPath
-      })
-    );
-  }
-
   return res.status(200).json({ secretImport: importSecDoc });
 };
 
@@ -621,9 +595,39 @@ export const getSecretImports = async (req: Request, res: Response) => {
  */
 export const getAllSecretsFromImport = async (req: Request, res: Response) => {
   const {
-    query: { workspaceId, environment, folderId }
+    query: { workspaceId, environment, directory }
   } = await validateRequest(reqValidator.GetAllSecretsFromImportV1, req);
 
+  if (req.authData.authPayload instanceof ServiceTokenData) {
+    // check for service token validity
+    const isValidScopeAccess = isValidScope(req.authData.authPayload, environment, directory);
+    if (!isValidScopeAccess) {
+      throw UnauthorizedRequestError({ message: "Folder Permission Denied" });
+    }
+  } else {
+    const { permission } = await getUserProjectPermissions(req.user._id, workspaceId);
+    ForbiddenError.from(permission).throwUnlessCan(
+      ProjectPermissionActions.Read,
+      subject(ProjectPermissionSub.Secrets, {
+        environment,
+        secretPath: directory
+      })
+    );
+  }
+
+  const folders = await Folder.findOne({
+    workspace: workspaceId,
+    environment
+  }).lean();
+  if (!folders && directory !== "/") throw BadRequestError({ message: "Folder not found" });
+
+  let folderId = "root";
+  if (folders) {
+    const folder = getFolderByPath(folders.nodes, directory);
+    if (!folder) throw BadRequestError({ message: "Folder not found" });
+    folderId = folder.id;
+  }
+
   const importSecDoc = await SecretImport.findOne({
     workspace: workspaceId,
     environment,
@@ -634,11 +638,6 @@ export const getAllSecretsFromImport = async (req: Request, res: Response) => {
     return res.status(200).json({ secrets: [] });
   }
 
-  const folders = await Folder.findOne({
-    workspace: importSecDoc.workspace,
-    environment: importSecDoc.environment
-  }).lean();
-
   let secretPath = "/";
   if (folders) {
     const { folderPath } = getFolderWithPathFromId(folders.nodes, importSecDoc.folderId);

backend/src/controllers/v1/secretsFolderController.ts

@@ -9,12 +9,10 @@ import { Secret, ServiceTokenData } from "../../models";
 import { Folder } from "../../models/folder";
 import {
   appendFolder,
-  deleteFolderById,
   generateFolderId,
   getAllFolderIds,
   getFolderByPath,
   getFolderWithPathFromId,
-  getParentFromFolderId,
   validateFolderName
 } from "../../services/FolderService";
 import {
@@ -25,13 +23,9 @@ import {
 import { BadRequestError, UnauthorizedRequestError } from "../../utils/errors";
 import * as reqValidator from "../../validation/folders";
 
-/**
- * Create folder with name [folderName] for workspace with id [workspaceId]
- * and environment [environment]
- * @param req
- * @param res
- * @returns
- */
+const ERR_FOLDER_NOT_FOUND = BadRequestError({ message: "The folder doesn't exist" });
+
+// verify workspace id/environment
 export const createFolder = async (req: Request, res: Response) => {
   /* 
     #swagger.summary = 'Create a folder'
@@ -107,7 +101,7 @@ export const createFolder = async (req: Request, res: Response) => {
     }
   */
   const {
-    body: { workspaceId, environment, folderName, parentFolderId }
+    body: { workspaceId, environment, folderName, directory }
   } = await validateRequest(reqValidator.CreateFolderV1, req);
 
   if (!validateFolderName(folderName)) {
@@ -116,33 +110,29 @@ export const createFolder = async (req: Request, res: Response) => {
     });
   }
 
+  if (req.authData.authPayload instanceof ServiceTokenData) {
+    // token check
+    const isValidScopeAccess = isValidScope(req.authData.authPayload, environment, directory);
+    if (!isValidScopeAccess) {
+      throw UnauthorizedRequestError({ message: "Folder Permission Denied" });
+    }
+  } else {
+    // user check
+    const { permission } = await getUserProjectPermissions(req.user._id, workspaceId);
+    ForbiddenError.from(permission).throwUnlessCan(
+      ProjectPermissionActions.Create,
+      subject(ProjectPermissionSub.Secrets, { environment, secretPath: directory })
+    );
+  }
+
   const folders = await Folder.findOne({
     workspace: workspaceId,
     environment
   }).lean();
 
-  if (req.user) {
-    const { permission } = await getUserProjectPermissions(req.user._id, workspaceId);
-    const secretPath =
-      folders && parentFolderId
-        ? getFolderWithPathFromId(folders.nodes, parentFolderId).folderPath
-        : "/";
-    ForbiddenError.from(permission).throwUnlessCan(
-      ProjectPermissionActions.Create,
-      subject(ProjectPermissionSub.Secrets, { environment, secretPath })
-    );
-  }
-
   // space has no folders initialized
-
   if (!folders) {
-    if (req.authData.authPayload instanceof ServiceTokenData) {
-      // root check
-      const isValidScopeAccess = isValidScope(req.authData.authPayload, environment, "/");
-      if (!isValidScopeAccess) {
-        throw UnauthorizedRequestError({ message: "Folder Permission Denied" });
-      }
-    }
+    if (directory !== "/") throw ERR_FOLDER_NOT_FOUND;
 
     const id = generateFolderId();
     const folder = new Folder({
@@ -186,27 +176,10 @@ export const createFolder = async (req: Request, res: Response) => {
     return res.json({ folder: { id, name: folderName } });
   }
 
-  const folder = appendFolder(folders.nodes, { folderName, parentFolderId });
-
-  await Folder.findByIdAndUpdate(folders._id, folders);
-
-  const { folder: parentFolder, folderPath: parentFolderPath } = getFolderWithPathFromId(
-    folders.nodes,
-    parentFolderId || "root"
-  );
-
-  if (req.authData.authPayload instanceof ServiceTokenData) {
-    // root check
-    const isValidScopeAccess = isValidScope(
-      req.authData.authPayload,
-      environment,
-      parentFolderPath
-    );
-    if (!isValidScopeAccess) {
-      throw UnauthorizedRequestError({ message: "Folder Permission Denied" });
-    }
-  }
+  const parentFolder = getFolderByPath(folders.nodes, directory);
+  if (!parentFolder) throw ERR_FOLDER_NOT_FOUND;
 
+  const folder = appendFolder(folders.nodes, { folderName, parentFolderId: parentFolder.id });
   await Folder.findByIdAndUpdate(folders._id, folders);
 
   const folderVersion = new FolderVersion({
@@ -219,11 +192,9 @@ export const createFolder = async (req: Request, res: Response) => {
   await EESecretService.takeSecretSnapshot({
     workspaceId: new Types.ObjectId(workspaceId),
     environment,
-    folderId: parentFolderId
+    folderId: parentFolder.id
   });
 
-  const { folderPath } = getFolderWithPathFromId(folders.nodes, folder.id);
-
   await EEAuditLogService.createAuditLog(
     req.authData,
     {
@@ -232,7 +203,7 @@ export const createFolder = async (req: Request, res: Response) => {
         environment,
         folderId: folder.id,
         folderName,
-        folderPath
+        folderPath: directory
       }
     },
     {
@@ -332,8 +303,8 @@ export const updateFolderById = async (req: Request, res: Response) => {
     }
   */
   const {
-    body: { workspaceId, environment, name },
-    params: { folderId }
+    body: { workspaceId, environment, name, directory },
+    params: { folderName }
   } = await validateRequest(reqValidator.UpdateFolderV1, req);
 
   if (!validateFolderName(name)) {
@@ -342,38 +313,31 @@ export const updateFolderById = async (req: Request, res: Response) => {
     });
   }
 
+  if (req.authData.authPayload instanceof ServiceTokenData) {
+    const isValidScopeAccess = isValidScope(req.authData.authPayload, environment, directory);
+    if (!isValidScopeAccess) {
+      throw UnauthorizedRequestError({ message: "Folder Permission Denied" });
+    }
+  } else {
+    const { permission } = await getUserProjectPermissions(req.user._id, workspaceId);
+    ForbiddenError.from(permission).throwUnlessCan(
+      ProjectPermissionActions.Edit,
+      subject(ProjectPermissionSub.Secrets, { environment, secretPath: directory })
+    );
+  }
+
   const folders = await Folder.findOne({ workspace: workspaceId, environment });
   if (!folders) {
     throw BadRequestError({ message: "The folder doesn't exist" });
   }
 
-  const parentFolder = getParentFromFolderId(folders.nodes, folderId);
+  const parentFolder = getFolderByPath(folders.nodes, directory);
   if (!parentFolder) {
     throw BadRequestError({ message: "The folder doesn't exist" });
   }
 
-  if (req.user) {
-    const { permission } = await getUserProjectPermissions(req.user._id, workspaceId);
-    const secretPath = getFolderWithPathFromId(folders.nodes, parentFolder.id).folderPath;
-    ForbiddenError.from(permission).throwUnlessCan(
-      ProjectPermissionActions.Edit,
-      subject(ProjectPermissionSub.Secrets, { environment, secretPath })
-    );
-  }
-
-  const folder = parentFolder.children.find(({ id }) => id === folderId);
-  if (!folder) {
-    throw BadRequestError({ message: "The folder doesn't exist" });
-  }
-
-  if (req.authData.authPayload instanceof ServiceTokenData) {
-    const { folderPath: secretPath } = getFolderWithPathFromId(folders.nodes, parentFolder.id);
-    // root check
-    const isValidScopeAccess = isValidScope(req.authData.authPayload, environment, secretPath);
-    if (!isValidScopeAccess) {
-      throw UnauthorizedRequestError({ message: "Folder Permission Denied" });
-    }
-  }
+  const folder = parentFolder.children.find(({ name }) => name === folderName);
+  if (!folder) throw ERR_FOLDER_NOT_FOUND;
 
   const oldFolderName = folder.name;
   parentFolder.version += 1;
@@ -505,24 +469,12 @@ export const deleteFolder = async (req: Request, res: Response) => {
     }
   */
   const {
-    params: { folderId },
-    body: { environment, workspaceId }
+    params: { folderName },
+    body: { environment, workspaceId, directory }
   } = await validateRequest(reqValidator.DeleteFolderV1, req);
 
-  const folders = await Folder.findOne({ workspace: workspaceId, environment });
-  if (!folders) {
-    throw BadRequestError({ message: "The folder doesn't exist" });
-  }
-
-  const delOp = deleteFolderById(folders.nodes, folderId);
-  if (!delOp) {
-    throw BadRequestError({ message: "The folder doesn't exist" });
-  }
-  const { deletedNode: delFolder, parent: parentFolder } = delOp;
-  const { folderPath: secretPath } = getFolderWithPathFromId(folders.nodes, parentFolder.id);
-
   if (req.authData.authPayload instanceof ServiceTokenData) {
-    const isValidScopeAccess = isValidScope(req.authData.authPayload, environment, secretPath);
+    const isValidScopeAccess = isValidScope(req.authData.authPayload, environment, directory);
     if (!isValidScopeAccess) {
       throw UnauthorizedRequestError({ message: "Folder Permission Denied" });
     }
@@ -531,12 +483,23 @@ export const deleteFolder = async (req: Request, res: Response) => {
     const { permission } = await getUserProjectPermissions(req.user._id, workspaceId);
     ForbiddenError.from(permission).throwUnlessCan(
       ProjectPermissionActions.Delete,
-      subject(ProjectPermissionSub.Secrets, { environment, secretPath })
+      subject(ProjectPermissionSub.Secrets, { environment, secretPath: directory })
     );
   }
 
+  const folders = await Folder.findOne({ workspace: workspaceId, environment });
+  if (!folders) throw ERR_FOLDER_NOT_FOUND;
+
+  const parentFolder = getFolderByPath(folders.nodes, directory);
+  if (!parentFolder) throw ERR_FOLDER_NOT_FOUND;
+
+  const index = parentFolder.children.findIndex(({ name }) => name === folderName);
+  if (index === -1) throw ERR_FOLDER_NOT_FOUND;
+
+  const deletedFolder = parentFolder.children.splice(index, 1)[0];
+
   parentFolder.version += 1;
-  const delFolderIds = getAllFolderIds(delFolder);
+  const delFolderIds = getAllFolderIds(deletedFolder);
 
   await Folder.findByIdAndUpdate(folders._id, folders);
   const folderVersion = new FolderVersion({
@@ -565,9 +528,9 @@ export const deleteFolder = async (req: Request, res: Response) => {
       type: EventType.DELETE_FOLDER,
       metadata: {
         environment,
-        folderId,
-        folderName: delFolder.name,
-        folderPath: secretPath
+        folderId: deletedFolder.id,
+        folderName: deletedFolder.name,
+        folderPath: directory
       }
     },
     {
@@ -575,7 +538,7 @@ export const deleteFolder = async (req: Request, res: Response) => {
     }
   );
 
-  res.send({ message: "successfully deleted folders", folders: delFolderIds });
+  return res.send({ message: "successfully deleted folders", folders: delFolderIds });
 };
 
 /**
@@ -677,69 +640,27 @@ export const getFolders = async (req: Request, res: Response) => {
     }
   */
   const {
-    query: { workspaceId, environment, parentFolderId, parentFolderPath }
+    query: { workspaceId, environment, directory }
   } = await validateRequest(reqValidator.GetFoldersV1, req);
 
-  const folders = await Folder.findOne({ workspace: workspaceId, environment });
-
-  if (req.user) await getUserProjectPermissions(req.user._id, workspaceId);
-
-  if (!folders) {
-    res.send({ folders: [], dir: [] });
-    return;
-  }
-
-  // if instead of parentFolderId given a path like /folder1/folder2
-  if (parentFolderPath) {
-    if (req.authData.authPayload instanceof ServiceTokenData) {
-      const isValidScopeAccess = isValidScope(
-        req.authData.authPayload,
-        environment,
-        parentFolderPath
-      );
-      if (!isValidScopeAccess) {
-        throw UnauthorizedRequestError({ message: "Folder Permission Denied" });
-      }
-    }
-    const folder = getFolderByPath(folders.nodes, parentFolderPath);
-
-    if (!folder) {
-      res.send({ folders: [], dir: [] });
-      return;
-    }
-    // dir is not needed at present as this is only used in overview section of secrets
-    res.send({
-      folders: folder.children.map(({ id, name }) => ({ id, name })),
-      dir: [{ name: folder.name, id: folder.id }]
-    });
-  }
-
-  if (!parentFolderId) {
-    if (req.authData.authPayload instanceof ServiceTokenData) {
-      const isValidScopeAccess = isValidScope(req.authData.authPayload, environment, "/");
-      if (!isValidScopeAccess) {
-        throw UnauthorizedRequestError({ message: "Folder Permission Denied" });
-      }
-    }
-
-    const rootFolders = folders.nodes.children.map(({ id, name }) => ({
-      id,
-      name
-    }));
-    res.send({ folders: rootFolders });
-    return;
-  }
-
-  const { folder, folderPath, dir } = getFolderWithPathFromId(folders.nodes, parentFolderId);
   if (req.authData.authPayload instanceof ServiceTokenData) {
-    const isValidScopeAccess = isValidScope(req.authData.authPayload, environment, folderPath);
+    const isValidScopeAccess = isValidScope(req.authData.authPayload, environment, directory);
     if (!isValidScopeAccess) {
       throw UnauthorizedRequestError({ message: "Folder Permission Denied" });
     }
+  } else {
+    // check that user is a member of the workspace
+    await getUserProjectPermissions(req.user._id, workspaceId);
   }
 
-  res.send({
-    folders: folder.children.map(({ id, name }) => ({ id, name })),
-    dir
+  const folders = await Folder.findOne({ workspace: workspaceId, environment });
+  if (!folders) {
+    return res.send({ folders: [], dir: [] });
+  }
+
+  const folder = getFolderByPath(folders.nodes, directory);
+
+  return res.send({
+    folders: folder?.children?.map(({ id, name }) => ({ id, name })) || []
   });
 };

backend/src/controllers/v2/environmentController.ts

@@ -1,6 +1,7 @@
 import { Request, Response } from "express";
 import { Types } from "mongoose";
 import {
+  Folder,
   Integration,
   Membership,
   Secret,
@@ -21,9 +22,12 @@ import {
   getUserProjectPermissions
 } from "../../ee/services/ProjectRoleService";
 import { ForbiddenError } from "@casl/ability";
+import { SecretImport } from "../../models";
+import { ServiceAccountWorkspacePermission } from "../../models";
+import { Webhook } from "../../models";
 
 /**
- * Create new workspace environment named [environmentName] 
+ * Create new workspace environment named [environmentName]
  * with slug [environmentSlug] under workspace with id
  * @param req
  * @param res
@@ -369,13 +373,38 @@ export const renameWorkspaceEnvironment = async (req: Request, res: Response) =>
     { environment: environmentSlug }
   );
   await ServiceTokenData.updateMany(
-    { workspace: workspaceId, environment: oldEnvironmentSlug },
-    { environment: environmentSlug }
+    {
+      workspace: workspaceId,
+      "scopes.environment": oldEnvironmentSlug
+    },
+    { $set: { "scopes.$[element].environment": environmentSlug } },
+    { arrayFilters: [{ "element.environment": oldEnvironmentSlug }] }
   );
   await Integration.updateMany(
     { workspace: workspaceId, environment: oldEnvironmentSlug },
     { environment: environmentSlug }
   );
+
+  await Folder.updateMany(
+    { workspace: workspaceId, environment: oldEnvironmentSlug },
+    { environment: environmentSlug }
+  );
+
+  await SecretImport.updateMany(
+    { workspace: workspaceId, environment: oldEnvironmentSlug },
+    { environment: environmentSlug }
+  );
+
+  await ServiceAccountWorkspacePermission.updateMany(
+    { workspace: workspaceId, environment: oldEnvironmentSlug },
+    { environment: environmentSlug }
+  );
+
+  await Webhook.updateMany(
+    { workspace: workspaceId, environment: oldEnvironmentSlug },
+    { environment: environmentSlug }
+  );
+
   await Membership.updateMany(
     {
       workspace: workspaceId,

backend/src/controllers/v3/secretsController.ts

@@ -196,7 +196,15 @@ export const getSecretByNameRaw = async (req: Request, res: Response) => {
 export const createSecretRaw = async (req: Request, res: Response) => {
   const {
     params: { secretName },
-    body: { secretPath, environment, workspaceId, type, secretValue, secretComment }
+    body: {
+      secretPath,
+      environment,
+      workspaceId,
+      type,
+      secretValue,
+      secretComment,
+      skipMultilineEncoding
+    }
   } = await validateRequest(reqValidator.CreateSecretRawV3, req);
 
   if (req.user?._id) {
@@ -249,7 +257,8 @@ export const createSecretRaw = async (req: Request, res: Response) => {
     secretPath,
     secretCommentCiphertext: secretCommentEncrypted.ciphertext,
     secretCommentIV: secretCommentEncrypted.iv,
-    secretCommentTag: secretCommentEncrypted.tag
+    secretCommentTag: secretCommentEncrypted.tag,
+    skipMultilineEncoding
   });
 
   await EventService.handleEvent({
@@ -279,7 +288,7 @@ export const createSecretRaw = async (req: Request, res: Response) => {
 export const updateSecretByNameRaw = async (req: Request, res: Response) => {
   const {
     params: { secretName },
-    body: { secretValue, environment, secretPath, type, workspaceId }
+    body: { secretValue, environment, secretPath, type, workspaceId, skipMultilineEncoding }
   } = await validateRequest(reqValidator.UpdateSecretByNameRawV3, req);
 
   if (req.user?._id) {
@@ -316,7 +325,8 @@ export const updateSecretByNameRaw = async (req: Request, res: Response) => {
     secretValueCiphertext: secretValueEncrypted.ciphertext,
     secretValueIV: secretValueEncrypted.iv,
     secretValueTag: secretValueEncrypted.tag,
-    secretPath
+    secretPath,
+    skipMultilineEncoding
   });
 
   await EventService.handleEvent({
@@ -540,7 +550,8 @@ export const createSecret = async (req: Request, res: Response) => {
       secretCommentTag,
       secretKeyCiphertext,
       secretValueCiphertext,
-      secretCommentCiphertext
+      secretCommentCiphertext,
+      skipMultilineEncoding
     },
     params: { secretName }
   } = await validateRequest(reqValidator.CreateSecretV3, req);
@@ -577,7 +588,8 @@ export const createSecret = async (req: Request, res: Response) => {
     secretCommentCiphertext,
     secretCommentIV,
     secretCommentTag,
-    metadata
+    metadata,
+    skipMultilineEncoding
   });
 
   await EventService.handleEvent({
@@ -610,11 +622,23 @@ export const updateSecretByName = async (req: Request, res: Response) => {
       type,
       environment,
       secretPath,
-      workspaceId
+      workspaceId,
+      tags,
+      secretCommentIV,
+      secretCommentTag,
+      secretCommentCiphertext,
+      secretName: newSecretName,
+      secretKeyIV,
+      secretKeyTag,
+      secretKeyCiphertext,
+      skipMultilineEncoding
     },
     params: { secretName }
   } = await validateRequest(reqValidator.UpdateSecretByNameV3, req);
 
+  if (newSecretName && (!secretKeyIV || !secretKeyTag || !secretKeyCiphertext))
+    throw BadRequestError({ message: "Missing encrypted key" });
+
   if (req.user?._id) {
     const { permission } = await getUserProjectPermissions(req.user._id, workspaceId);
     ForbiddenError.from(permission).throwUnlessCan(
@@ -637,10 +661,19 @@ export const updateSecretByName = async (req: Request, res: Response) => {
     environment,
     type,
     authData: req.authData,
+    newSecretName,
     secretValueCiphertext,
     secretValueIV,
     secretValueTag,
-    secretPath
+    secretPath,
+    tags,
+    secretCommentIV,
+    secretCommentTag,
+    secretCommentCiphertext,
+    skipMultilineEncoding,
+    secretKeyTag,
+    secretKeyCiphertext,
+    secretKeyIV
   });
 
   await EventService.handleEvent({
@@ -704,3 +737,105 @@ export const deleteSecretByName = async (req: Request, res: Response) => {
     secret
   });
 };
+
+export const createSecretByNameBatch = async (req: Request, res: Response) => {
+  const {
+    body: { secrets, secretPath, environment, workspaceId }
+  } = await validateRequest(reqValidator.CreateSecretByNameBatchV3, req);
+
+  if (req.user?._id) {
+    const { permission } = await getUserProjectPermissions(req.user._id, workspaceId);
+    ForbiddenError.from(permission).throwUnlessCan(
+      ProjectPermissionActions.Create,
+      subject(ProjectPermissionSub.Secrets, { environment, secretPath })
+    );
+  } else {
+    await validateServiceTokenDataClientForWorkspace({
+      serviceTokenData: req.authData.authPayload as IServiceTokenData,
+      workspaceId: new Types.ObjectId(workspaceId),
+      environment,
+      secretPath,
+      requiredPermissions: [PERMISSION_WRITE_SECRETS]
+    });
+  }
+
+  const createdSecrets = await SecretService.createSecretBatch({
+    secretPath,
+    environment,
+    workspaceId: new Types.ObjectId(workspaceId),
+    secrets,
+    authData: req.authData
+  });
+
+  return res.status(200).send({
+    secrets: createdSecrets
+  });
+};
+
+export const updateSecretByNameBatch = async (req: Request, res: Response) => {
+  const {
+    body: { secrets, secretPath, environment, workspaceId }
+  } = await validateRequest(reqValidator.UpdateSecretByNameBatchV3, req);
+
+  if (req.user?._id) {
+    const { permission } = await getUserProjectPermissions(req.user._id, workspaceId);
+    ForbiddenError.from(permission).throwUnlessCan(
+      ProjectPermissionActions.Edit,
+      subject(ProjectPermissionSub.Secrets, { environment, secretPath })
+    );
+  } else {
+    await validateServiceTokenDataClientForWorkspace({
+      serviceTokenData: req.authData.authPayload as IServiceTokenData,
+      workspaceId: new Types.ObjectId(workspaceId),
+      environment,
+      secretPath,
+      requiredPermissions: [PERMISSION_WRITE_SECRETS]
+    });
+  }
+
+  const updatedSecrets = await SecretService.updateSecretBatch({
+    secretPath,
+    environment,
+    workspaceId: new Types.ObjectId(workspaceId),
+    secrets,
+    authData: req.authData
+  });
+
+  return res.status(200).send({
+    secrets: updatedSecrets
+  });
+};
+
+export const deleteSecretByNameBatch = async (req: Request, res: Response) => {
+  const {
+    body: { secrets, secretPath, environment, workspaceId }
+  } = await validateRequest(reqValidator.DeleteSecretByNameBatchV3, req);
+
+  if (req.user?._id) {
+    const { permission } = await getUserProjectPermissions(req.user._id, workspaceId);
+    ForbiddenError.from(permission).throwUnlessCan(
+      ProjectPermissionActions.Delete,
+      subject(ProjectPermissionSub.Secrets, { environment, secretPath })
+    );
+  } else {
+    await validateServiceTokenDataClientForWorkspace({
+      serviceTokenData: req.authData.authPayload as IServiceTokenData,
+      workspaceId: new Types.ObjectId(workspaceId),
+      environment,
+      secretPath,
+      requiredPermissions: [PERMISSION_WRITE_SECRETS]
+    });
+  }
+
+  const deletedSecrets = await SecretService.deleteSecretBatch({
+    secretPath,
+    environment,
+    workspaceId: new Types.ObjectId(workspaceId),
+    secrets,
+    authData: req.authData
+  });
+
+  return res.status(200).send({
+    secrets: deletedSecrets
+  });
+};

backend/src/ee/controllers/v1/workspaceController.ts

@@ -27,7 +27,7 @@ import {
 import { EESecretService } from "../../services";
 import { getLatestSecretVersionIds } from "../../helpers/secretVersion";
 // import Folder, { TFolderSchema } from "../../../models/folder";
-import { searchByFolderId } from "../../../services/FolderService";
+import { getFolderByPath, searchByFolderId } from "../../../services/FolderService";
 import { EEAuditLogService, EELicenseService } from "../../services";
 import { extractIPDetails, isValidIpOrCidr } from "../../../utils/ip";
 import { validateRequest } from "../../../helpers/validation";
@@ -104,7 +104,7 @@ export const getWorkspaceSecretSnapshots = async (req: Request, res: Response) =
     */
   const {
     params: { workspaceId },
-    query: { environment, folderId, offset, limit }
+    query: { environment, directory, offset, limit }
   } = await validateRequest(GetWorkspaceSecretSnapshotsV1, req);
 
   const { permission } = await getUserProjectPermissions(req.user._id, workspaceId);
@@ -113,10 +113,20 @@ export const getWorkspaceSecretSnapshots = async (req: Request, res: Response) =
     ProjectPermissionSub.SecretRollback
   );
 
+  let folderId = "root";
+  const folders = await Folder.findOne({ workspace: workspaceId, environment });
+  if (!folders && directory !== "/") throw BadRequestError({ message: "Folder not found" });
+
+  if (folders) {
+    const folder = getFolderByPath(folders?.nodes, directory);
+    if (!folder) throw BadRequestError({ message: "Invalid folder id" });
+    folderId = folder.id;
+  }
+
   const secretSnapshots = await SecretSnapshot.find({
     workspace: workspaceId,
     environment,
-    folderId: folderId || "root"
+    folderId
   })
     .sort({ createdAt: -1 })
     .skip(offset)
@@ -135,7 +145,7 @@ export const getWorkspaceSecretSnapshots = async (req: Request, res: Response) =
 export const getWorkspaceSecretSnapshotsCount = async (req: Request, res: Response) => {
   const {
     params: { workspaceId },
-    query: { environment, folderId }
+    query: { environment, directory }
   } = await validateRequest(GetWorkspaceSecretSnapshotsCountV1, req);
 
   const { permission } = await getUserProjectPermissions(req.user._id, workspaceId);
@@ -144,10 +154,20 @@ export const getWorkspaceSecretSnapshotsCount = async (req: Request, res: Respon
     ProjectPermissionSub.SecretRollback
   );
 
+  let folderId = "root";
+  const folders = await Folder.findOne({ workspace: workspaceId, environment });
+  if (!folders && directory !== "/") throw BadRequestError({ message: "Folder not found" });
+
+  if (folders) {
+    const folder = getFolderByPath(folders?.nodes, directory);
+    if (!folder) throw BadRequestError({ message: "Invalid folder id" });
+    folderId = folder.id;
+  }
+
   const count = await SecretSnapshot.countDocuments({
     workspace: workspaceId,
     environment,
-    folderId: folderId || "root"
+    folderId
   });
 
   return res.status(200).send({
@@ -215,7 +235,7 @@ export const rollbackWorkspaceSecretSnapshot = async (req: Request, res: Respons
 
   const {
     params: { workspaceId },
-    body: { folderId, environment, version }
+    body: { directory, environment, version }
   } = await validateRequest(RollbackWorkspaceSecretSnapshotV1, req);
 
   const { permission } = await getUserProjectPermissions(req.user._id, workspaceId);
@@ -224,6 +244,16 @@ export const rollbackWorkspaceSecretSnapshot = async (req: Request, res: Respons
     ProjectPermissionSub.SecretRollback
   );
 
+  let folderId = "root";
+  const folders = await Folder.findOne({ workspace: workspaceId, environment });
+  if (!folders && directory !== "/") throw BadRequestError({ message: "Folder not found" });
+
+  if (folders) {
+    const folder = getFolderByPath(folders?.nodes, directory);
+    if (!folder) throw BadRequestError({ message: "Invalid folder id" });
+    folderId = folder.id;
+  }
+
   // validate secret snapshot
   const secretSnapshot = await SecretSnapshot.findOne({
     workspace: workspaceId,

backend/src/ee/models/auditLog/enums.ts

@@ -1,47 +1,50 @@
 export enum ActorType {
-    USER = "user",
-    SERVICE = "service"
+  USER = "user",
+  SERVICE = "service"
 }
 
 export enum UserAgentType {
-    WEB = "web",
-    CLI = "cli",
-    K8_OPERATOR = "k8-operator",
-    OTHER = "other"
+  WEB = "web",
+  CLI = "cli",
+  K8_OPERATOR = "k8-operator",
+  OTHER = "other"
 }
 
 export enum EventType {
-    GET_SECRETS = "get-secrets",
-    GET_SECRET = "get-secret",
-    REVEAL_SECRET = "reveal-secret",
-    CREATE_SECRET = "create-secret",
-    UPDATE_SECRET = "update-secret",
-    DELETE_SECRET = "delete-secret",
-    GET_WORKSPACE_KEY = "get-workspace-key",
-    AUTHORIZE_INTEGRATION = "authorize-integration",
-    UNAUTHORIZE_INTEGRATION = "unauthorize-integration",
-    CREATE_INTEGRATION = "create-integration",
-    DELETE_INTEGRATION = "delete-integration",
-    ADD_TRUSTED_IP = "add-trusted-ip",
-    UPDATE_TRUSTED_IP = "update-trusted-ip",
-    DELETE_TRUSTED_IP = "delete-trusted-ip",
-    CREATE_SERVICE_TOKEN = "create-service-token",
-    DELETE_SERVICE_TOKEN = "delete-service-token",
-    CREATE_ENVIRONMENT = "create-environment",
-    UPDATE_ENVIRONMENT = "update-environment",
-    DELETE_ENVIRONMENT = "delete-environment",
-    ADD_WORKSPACE_MEMBER = "add-workspace-member",
-    REMOVE_WORKSPACE_MEMBER = "remove-workspace-member",
-    CREATE_FOLDER = "create-folder",
-    UPDATE_FOLDER = "update-folder",
-    DELETE_FOLDER = "delete-folder",
-    CREATE_WEBHOOK = "create-webhook",
-    UPDATE_WEBHOOK_STATUS = "update-webhook-status",
-    DELETE_WEBHOOK = "delete-webhook",
-    GET_SECRET_IMPORTS = "get-secret-imports",
-    CREATE_SECRET_IMPORT = "create-secret-import",
-    UPDATE_SECRET_IMPORT = "update-secret-import",
-    DELETE_SECRET_IMPORT = "delete-secret-import",
-    UPDATE_USER_WORKSPACE_ROLE = "update-user-workspace-role",
-    UPDATE_USER_WORKSPACE_DENIED_PERMISSIONS = "update-user-workspace-denied-permissions"
-}
+  GET_SECRETS = "get-secrets",
+  GET_SECRET = "get-secret",
+  REVEAL_SECRET = "reveal-secret",
+  CREATE_SECRET = "create-secret",
+  CREATE_SECRETS = "create-secrets",
+  UPDATE_SECRET = "update-secret",
+  UPDATE_SECRETS = "update-secrets",
+  DELETE_SECRET = "delete-secret",
+  DELETE_SECRETS = "delete-secrets",
+  GET_WORKSPACE_KEY = "get-workspace-key",
+  AUTHORIZE_INTEGRATION = "authorize-integration",
+  UNAUTHORIZE_INTEGRATION = "unauthorize-integration",
+  CREATE_INTEGRATION = "create-integration",
+  DELETE_INTEGRATION = "delete-integration",
+  ADD_TRUSTED_IP = "add-trusted-ip",
+  UPDATE_TRUSTED_IP = "update-trusted-ip",
+  DELETE_TRUSTED_IP = "delete-trusted-ip",
+  CREATE_SERVICE_TOKEN = "create-service-token",
+  DELETE_SERVICE_TOKEN = "delete-service-token",
+  CREATE_ENVIRONMENT = "create-environment",
+  UPDATE_ENVIRONMENT = "update-environment",
+  DELETE_ENVIRONMENT = "delete-environment",
+  ADD_WORKSPACE_MEMBER = "add-workspace-member",
+  REMOVE_WORKSPACE_MEMBER = "remove-workspace-member",
+  CREATE_FOLDER = "create-folder",
+  UPDATE_FOLDER = "update-folder",
+  DELETE_FOLDER = "delete-folder",
+  CREATE_WEBHOOK = "create-webhook",
+  UPDATE_WEBHOOK_STATUS = "update-webhook-status",
+  DELETE_WEBHOOK = "delete-webhook",
+  GET_SECRET_IMPORTS = "get-secret-imports",
+  CREATE_SECRET_IMPORT = "create-secret-import",
+  UPDATE_SECRET_IMPORT = "update-secret-import",
+  DELETE_SECRET_IMPORT = "delete-secret-import",
+  UPDATE_USER_WORKSPACE_ROLE = "update-user-workspace-role",
+  UPDATE_USER_WORKSPACE_DENIED_PERMISSIONS = "update-user-workspace-denied-permissions"
+}

backend/src/ee/models/auditLog/types.ts

@@ -1,403 +1,428 @@
-import {
-    ActorType,
-    EventType
-} from "./enums";
+import { ActorType, EventType } from "./enums";
 
 interface UserActorMetadata {
-    userId: string;
-    email: string;
+  userId: string;
+  email: string;
 }
 
 interface ServiceActorMetadata {
-    serviceId: string;
-    name: string;
+  serviceId: string;
+  name: string;
 }
 
 export interface UserActor {
-    type: ActorType.USER;
-    metadata: UserActorMetadata;
+  type: ActorType.USER;
+  metadata: UserActorMetadata;
 }
 
 export interface ServiceActor {
-    type: ActorType.SERVICE;
-    metadata: ServiceActorMetadata;
+  type: ActorType.SERVICE;
+  metadata: ServiceActorMetadata;
 }
 
-export type Actor = 
-    | UserActor
-    | ServiceActor;
+export type Actor = UserActor | ServiceActor;
 
 interface GetSecretsEvent {
-    type: EventType.GET_SECRETS;
-    metadata: {
-        environment: string;
-        secretPath: string;
-        numberOfSecrets: number;
-    };
+  type: EventType.GET_SECRETS;
+  metadata: {
+    environment: string;
+    secretPath: string;
+    numberOfSecrets: number;
+  };
 }
 
 interface GetSecretEvent {
-    type: EventType.GET_SECRET;
-    metadata: {
-        environment: string;
-        secretPath: string;
-        secretId: string;
-        secretKey: string;
-        secretVersion: number;
-    };
+  type: EventType.GET_SECRET;
+  metadata: {
+    environment: string;
+    secretPath: string;
+    secretId: string;
+    secretKey: string;
+    secretVersion: number;
+  };
 }
 
 interface CreateSecretEvent {
-    type: EventType.CREATE_SECRET;
-    metadata: {
-        environment: string;
-        secretPath: string;
-        secretId: string;
-        secretKey: string;
-        secretVersion: number;
-    }
+  type: EventType.CREATE_SECRET;
+  metadata: {
+    environment: string;
+    secretPath: string;
+    secretId: string;
+    secretKey: string;
+    secretVersion: number;
+  };
+}
+
+interface CreateSecretBatchEvent {
+  type: EventType.CREATE_SECRETS;
+  metadata: {
+    environment: string;
+    secretPath: string;
+    secrets: Array<{ secretId: string; secretKey: string; secretVersion: number }>;
+  };
 }
 
 interface UpdateSecretEvent {
-    type: EventType.UPDATE_SECRET;
-    metadata: {
-        environment: string;
-        secretPath: string;
-        secretId: string;
-        secretKey: string;
-        secretVersion: number;
-    }
+  type: EventType.UPDATE_SECRET;
+  metadata: {
+    environment: string;
+    secretPath: string;
+    secretId: string;
+    secretKey: string;
+    secretVersion: number;
+  };
+}
+
+interface UpdateSecretBatchEvent {
+  type: EventType.UPDATE_SECRETS;
+  metadata: {
+    environment: string;
+    secretPath: string;
+    secrets: Array<{ secretId: string; secretKey: string; secretVersion: number }>;
+  };
 }
 
 interface DeleteSecretEvent {
-    type: EventType.DELETE_SECRET;
-    metadata: {
-        environment: string;
-        secretPath: string;
-        secretId: string;
-        secretKey: string;
-        secretVersion: number;
-    }
+  type: EventType.DELETE_SECRET;
+  metadata: {
+    environment: string;
+    secretPath: string;
+    secretId: string;
+    secretKey: string;
+    secretVersion: number;
+  };
+}
+
+interface DeleteSecretBatchEvent {
+  type: EventType.DELETE_SECRETS;
+  metadata: {
+    environment: string;
+    secretPath: string;
+    secrets: Array<{ secretId: string; secretKey: string; secretVersion: number }>;
+  };
 }
 
 interface GetWorkspaceKeyEvent {
-    type: EventType.GET_WORKSPACE_KEY,
-    metadata: {
-        keyId: string;
-    }
+  type: EventType.GET_WORKSPACE_KEY;
+  metadata: {
+    keyId: string;
+  };
 }
 
 interface AuthorizeIntegrationEvent {
-    type: EventType.AUTHORIZE_INTEGRATION;
-    metadata: {
-        integration: string;
-    }
+  type: EventType.AUTHORIZE_INTEGRATION;
+  metadata: {
+    integration: string;
+  };
 }
 
 interface UnauthorizeIntegrationEvent {
-    type: EventType.UNAUTHORIZE_INTEGRATION;
-    metadata: {
-        integration: string;
-    }
+  type: EventType.UNAUTHORIZE_INTEGRATION;
+  metadata: {
+    integration: string;
+  };
 }
 
 interface CreateIntegrationEvent {
-    type: EventType.CREATE_INTEGRATION;
-    metadata: {
-        integrationId: string;
-        integration: string; // TODO: fix type
-        environment: string;
-        secretPath: string;
-        url?: string;
-        app?: string;
-        appId?: string;
-        targetEnvironment?: string;
-        targetEnvironmentId?: string;
-        targetService?: string;
-        targetServiceId?: string;
-        path?: string;
-        region?: string;
-    }
+  type: EventType.CREATE_INTEGRATION;
+  metadata: {
+    integrationId: string;
+    integration: string; // TODO: fix type
+    environment: string;
+    secretPath: string;
+    url?: string;
+    app?: string;
+    appId?: string;
+    targetEnvironment?: string;
+    targetEnvironmentId?: string;
+    targetService?: string;
+    targetServiceId?: string;
+    path?: string;
+    region?: string;
+  };
 }
 
 interface DeleteIntegrationEvent {
-    type: EventType.DELETE_INTEGRATION;
-    metadata: {
-        integrationId: string;
-        integration: string; // TODO: fix type
-        environment: string;
-        secretPath: string;
-        url?: string;
-        app?: string;
-        appId?: string;
-        targetEnvironment?: string;
-        targetEnvironmentId?: string;
-        targetService?: string;
-        targetServiceId?: string;
-        path?: string;
-        region?: string;
-    }
+  type: EventType.DELETE_INTEGRATION;
+  metadata: {
+    integrationId: string;
+    integration: string; // TODO: fix type
+    environment: string;
+    secretPath: string;
+    url?: string;
+    app?: string;
+    appId?: string;
+    targetEnvironment?: string;
+    targetEnvironmentId?: string;
+    targetService?: string;
+    targetServiceId?: string;
+    path?: string;
+    region?: string;
+  };
 }
 
 interface AddTrustedIPEvent {
-    type: EventType.ADD_TRUSTED_IP;
-    metadata: {
-        trustedIpId: string;
-        ipAddress: string;
-        prefix?: number;
-    }
+  type: EventType.ADD_TRUSTED_IP;
+  metadata: {
+    trustedIpId: string;
+    ipAddress: string;
+    prefix?: number;
+  };
 }
 
 interface UpdateTrustedIPEvent {
-    type: EventType.UPDATE_TRUSTED_IP;
-    metadata: {
-        trustedIpId: string;
-        ipAddress: string;
-        prefix?: number;
-    }
+  type: EventType.UPDATE_TRUSTED_IP;
+  metadata: {
+    trustedIpId: string;
+    ipAddress: string;
+    prefix?: number;
+  };
 }
 
 interface DeleteTrustedIPEvent {
-    type: EventType.DELETE_TRUSTED_IP;
-    metadata: {
-        trustedIpId: string;
-        ipAddress: string;
-        prefix?: number;
-    }
+  type: EventType.DELETE_TRUSTED_IP;
+  metadata: {
+    trustedIpId: string;
+    ipAddress: string;
+    prefix?: number;
+  };
 }
 
 interface CreateServiceTokenEvent {
-    type: EventType.CREATE_SERVICE_TOKEN;
-    metadata: {
-        name: string;
-        scopes: Array<{
-            environment: string;
-            secretPath: string;
-        }>;
-    }
+  type: EventType.CREATE_SERVICE_TOKEN;
+  metadata: {
+    name: string;
+    scopes: Array<{
+      environment: string;
+      secretPath: string;
+    }>;
+  };
 }
 
 interface DeleteServiceTokenEvent {
-    type: EventType.DELETE_SERVICE_TOKEN;
-    metadata: {
-        name: string;
-        scopes: Array<{
-            environment: string;
-            secretPath: string;
-        }>;
-    }
+  type: EventType.DELETE_SERVICE_TOKEN;
+  metadata: {
+    name: string;
+    scopes: Array<{
+      environment: string;
+      secretPath: string;
+    }>;
+  };
 }
 
 interface CreateEnvironmentEvent {
-    type: EventType.CREATE_ENVIRONMENT;
-    metadata: {
-        name: string;
-        slug: string;
-    }
+  type: EventType.CREATE_ENVIRONMENT;
+  metadata: {
+    name: string;
+    slug: string;
+  };
 }
 
 interface UpdateEnvironmentEvent {
-    type: EventType.UPDATE_ENVIRONMENT;
-    metadata: {
-        oldName: string;
-        newName: string;
-        oldSlug: string;
-        newSlug: string;
-    }
+  type: EventType.UPDATE_ENVIRONMENT;
+  metadata: {
+    oldName: string;
+    newName: string;
+    oldSlug: string;
+    newSlug: string;
+  };
 }
 
 interface DeleteEnvironmentEvent {
-    type: EventType.DELETE_ENVIRONMENT;
-    metadata: {
-        name: string;
-        slug: string;
-    }
+  type: EventType.DELETE_ENVIRONMENT;
+  metadata: {
+    name: string;
+    slug: string;
+  };
 }
 
 interface AddWorkspaceMemberEvent {
-    type: EventType.ADD_WORKSPACE_MEMBER;
-    metadata: {
-        userId: string;
-        email: string;
-    }
+  type: EventType.ADD_WORKSPACE_MEMBER;
+  metadata: {
+    userId: string;
+    email: string;
+  };
 }
 
 interface RemoveWorkspaceMemberEvent {
-    type: EventType.REMOVE_WORKSPACE_MEMBER;
-    metadata: {
-        userId: string;
-        email: string;
-    }
+  type: EventType.REMOVE_WORKSPACE_MEMBER;
+  metadata: {
+    userId: string;
+    email: string;
+  };
 }
 
 interface CreateFolderEvent {
-    type: EventType.CREATE_FOLDER;
-    metadata: {
-        environment: string;
-        folderId: string;
-        folderName: string;
-        folderPath: string;
-    }
+  type: EventType.CREATE_FOLDER;
+  metadata: {
+    environment: string;
+    folderId: string;
+    folderName: string;
+    folderPath: string;
+  };
 }
 
 interface UpdateFolderEvent {
-    type: EventType.UPDATE_FOLDER;
-    metadata: {
-        environment: string;
-        folderId: string;
-        oldFolderName: string;
-        newFolderName: string;
-        folderPath: string;
-    }
+  type: EventType.UPDATE_FOLDER;
+  metadata: {
+    environment: string;
+    folderId: string;
+    oldFolderName: string;
+    newFolderName: string;
+    folderPath: string;
+  };
 }
 
 interface DeleteFolderEvent {
-    type: EventType.DELETE_FOLDER;
-    metadata: {
-        environment: string;
-        folderId: string;
-        folderName: string;
-        folderPath: string;
-    }
+  type: EventType.DELETE_FOLDER;
+  metadata: {
+    environment: string;
+    folderId: string;
+    folderName: string;
+    folderPath: string;
+  };
 }
 
 interface CreateWebhookEvent {
-    type: EventType.CREATE_WEBHOOK,
-    metadata: {
-        webhookId: string;
-        environment: string;
-        secretPath: string;
-        webhookUrl: string;
-        isDisabled: boolean;
-    }
+  type: EventType.CREATE_WEBHOOK;
+  metadata: {
+    webhookId: string;
+    environment: string;
+    secretPath: string;
+    webhookUrl: string;
+    isDisabled: boolean;
+  };
 }
 
 interface UpdateWebhookStatusEvent {
-    type: EventType.UPDATE_WEBHOOK_STATUS,
-    metadata: {
-        webhookId: string;
-        environment: string;
-        secretPath: string;
-        webhookUrl: string;
-        isDisabled: boolean;
-    }
+  type: EventType.UPDATE_WEBHOOK_STATUS;
+  metadata: {
+    webhookId: string;
+    environment: string;
+    secretPath: string;
+    webhookUrl: string;
+    isDisabled: boolean;
+  };
 }
 
 interface DeleteWebhookEvent {
-    type: EventType.DELETE_WEBHOOK,
-    metadata: {
-        webhookId: string;
-        environment: string;
-        secretPath: string;
-        webhookUrl: string;
-        isDisabled: boolean;
-    }
+  type: EventType.DELETE_WEBHOOK;
+  metadata: {
+    webhookId: string;
+    environment: string;
+    secretPath: string;
+    webhookUrl: string;
+    isDisabled: boolean;
+  };
 }
 
 interface GetSecretImportsEvent {
-    type: EventType.GET_SECRET_IMPORTS,
-    metadata: {
-        environment: string;
-        secretImportId: string;
-        folderId: string;
-        numberOfImports: number;
-    }
+  type: EventType.GET_SECRET_IMPORTS;
+  metadata: {
+    environment: string;
+    secretImportId: string;
+    folderId: string;
+    numberOfImports: number;
+  };
 }
 
 interface CreateSecretImportEvent {
-    type: EventType.CREATE_SECRET_IMPORT,
-    metadata: {
-        secretImportId: string;
-        folderId: string;
-        importFromEnvironment: string;
-        importFromSecretPath: string;
-        importToEnvironment: string;
-        importToSecretPath: string;
-    }
+  type: EventType.CREATE_SECRET_IMPORT;
+  metadata: {
+    secretImportId: string;
+    folderId: string;
+    importFromEnvironment: string;
+    importFromSecretPath: string;
+    importToEnvironment: string;
+    importToSecretPath: string;
+  };
 }
 
 interface UpdateSecretImportEvent {
-    type: EventType.UPDATE_SECRET_IMPORT,
-    metadata: {
-        secretImportId: string;
-        folderId: string;
-        importToEnvironment: string;
-        importToSecretPath: string;
-        orderBefore: {
-          environment: string;
-          secretPath: string;
-        }[],
-        orderAfter: {
-          environment: string;
-          secretPath: string;
-        }[]
-    }
+  type: EventType.UPDATE_SECRET_IMPORT;
+  metadata: {
+    secretImportId: string;
+    folderId: string;
+    importToEnvironment: string;
+    importToSecretPath: string;
+    orderBefore: {
+      environment: string;
+      secretPath: string;
+    }[];
+    orderAfter: {
+      environment: string;
+      secretPath: string;
+    }[];
+  };
 }
 
 interface DeleteSecretImportEvent {
-    type: EventType.DELETE_SECRET_IMPORT,
-    metadata: {
-        secretImportId: string;
-        folderId: string;
-        importFromEnvironment: string;
-        importFromSecretPath: string;
-        importToEnvironment: string;
-        importToSecretPath: string;
-    }
+  type: EventType.DELETE_SECRET_IMPORT;
+  metadata: {
+    secretImportId: string;
+    folderId: string;
+    importFromEnvironment: string;
+    importFromSecretPath: string;
+    importToEnvironment: string;
+    importToSecretPath: string;
+  };
 }
 
 interface UpdateUserRole {
-    type: EventType.UPDATE_USER_WORKSPACE_ROLE,
-    metadata: {
-        userId: string;
-        email: string;
-        oldRole: string;
-        newRole: string;
-    }
+  type: EventType.UPDATE_USER_WORKSPACE_ROLE;
+  metadata: {
+    userId: string;
+    email: string;
+    oldRole: string;
+    newRole: string;
+  };
 }
 
 interface UpdateUserDeniedPermissions {
-    type: EventType.UPDATE_USER_WORKSPACE_DENIED_PERMISSIONS,
-    metadata: {
-        userId: string;
-        email: string;
-        deniedPermissions: {
-            environmentSlug: string;
-            ability: string;
-        }[]
-    }
+  type: EventType.UPDATE_USER_WORKSPACE_DENIED_PERMISSIONS;
+  metadata: {
+    userId: string;
+    email: string;
+    deniedPermissions: {
+      environmentSlug: string;
+      ability: string;
+    }[];
+  };
 }
 
-export type Event = 
-    | GetSecretsEvent
-    | GetSecretEvent
-    | CreateSecretEvent
-    | UpdateSecretEvent
-    | DeleteSecretEvent
-    | GetWorkspaceKeyEvent
-    | AuthorizeIntegrationEvent
-    | UnauthorizeIntegrationEvent
-    | CreateIntegrationEvent
-    | DeleteIntegrationEvent
-    | AddTrustedIPEvent
-    | UpdateTrustedIPEvent
-    | DeleteTrustedIPEvent
-    | CreateServiceTokenEvent
-    | DeleteServiceTokenEvent
-    | CreateEnvironmentEvent
-    | UpdateEnvironmentEvent
-    | DeleteEnvironmentEvent
-    | AddWorkspaceMemberEvent
-    | RemoveWorkspaceMemberEvent
-    | CreateFolderEvent
-    | UpdateFolderEvent
-    | DeleteFolderEvent
-    | CreateWebhookEvent
-    | UpdateWebhookStatusEvent
-    | DeleteWebhookEvent
-    | GetSecretImportsEvent
-    | CreateSecretImportEvent
-    | UpdateSecretImportEvent
-    | DeleteSecretImportEvent
-    | UpdateUserRole
-    | UpdateUserDeniedPermissions;
+export type Event =
+  | GetSecretsEvent
+  | GetSecretEvent
+  | CreateSecretEvent
+  | CreateSecretBatchEvent
+  | UpdateSecretEvent
+  | UpdateSecretBatchEvent
+  | DeleteSecretEvent
+  | DeleteSecretBatchEvent
+  | GetWorkspaceKeyEvent
+  | AuthorizeIntegrationEvent
+  | UnauthorizeIntegrationEvent
+  | CreateIntegrationEvent
+  | DeleteIntegrationEvent
+  | AddTrustedIPEvent
+  | UpdateTrustedIPEvent
+  | DeleteTrustedIPEvent
+  | CreateServiceTokenEvent
+  | DeleteServiceTokenEvent
+  | CreateEnvironmentEvent
+  | UpdateEnvironmentEvent
+  | DeleteEnvironmentEvent
+  | AddWorkspaceMemberEvent
+  | RemoveWorkspaceMemberEvent
+  | CreateFolderEvent
+  | UpdateFolderEvent
+  | DeleteFolderEvent
+  | CreateWebhookEvent
+  | UpdateWebhookStatusEvent
+  | DeleteWebhookEvent
+  | GetSecretImportsEvent
+  | CreateSecretImportEvent
+  | UpdateSecretImportEvent
+  | DeleteSecretImportEvent
+  | UpdateUserRole
+  | UpdateUserDeniedPermissions;

backend/src/ee/models/secretVersion.ts

@@ -4,7 +4,7 @@ import {
   ENCODING_SCHEME_BASE64,
   ENCODING_SCHEME_UTF8,
   SECRET_PERSONAL,
-  SECRET_SHARED,
+  SECRET_SHARED
 } from "../../variables";
 
 export interface ISecretVersion {
@@ -23,6 +23,7 @@ export interface ISecretVersion {
   secretValueCiphertext: string;
   secretValueIV: string;
   secretValueTag: string;
+  skipMultilineEncoding?: boolean;
   algorithm: "aes-256-gcm";
   keyEncoding: "utf8" | "base64";
   createdAt: string;
@@ -36,95 +37,96 @@ const secretVersionSchema = new Schema<ISecretVersion>(
       // could be deleted
       type: Schema.Types.ObjectId,
       ref: "Secret",
-      required: true,
+      required: true
     },
     version: {
       type: Number,
       default: 1,
-      required: true,
+      required: true
     },
     workspace: {
       type: Schema.Types.ObjectId,
       ref: "Workspace",
-      required: true,
+      required: true
     },
     type: {
       type: String,
       enum: [SECRET_SHARED, SECRET_PERSONAL],
-      required: true,
+      required: true
     },
     user: {
       // user associated with the personal secret
       type: Schema.Types.ObjectId,
-      ref: "User",
+      ref: "User"
     },
     environment: {
       type: String,
-      required: true,
+      required: true
     },
     isDeleted: {
       // consider removing field
       type: Boolean,
       default: false,
-      required: true,
+      required: true
     },
     secretBlindIndex: {
       type: String,
-      select: false,
+      select: false
     },
     secretKeyCiphertext: {
       type: String,
-      required: true,
+      required: true
     },
     secretKeyIV: {
       type: String, // symmetric
-      required: true,
+      required: true
     },
     secretKeyTag: {
       type: String, // symmetric
-      required: true,
+      required: true
     },
     secretValueCiphertext: {
       type: String,
-      required: true,
+      required: true
     },
     secretValueIV: {
       type: String, // symmetric
-      required: true,
+      required: true
     },
     secretValueTag: {
       type: String, // symmetric
-      required: true,
+      required: true
+    },
+    skipMultilineEncoding: {
+      type: Boolean,
+      required: false
     },
     algorithm: {
       // the encryption algorithm used
       type: String,
       enum: [ALGORITHM_AES_256_GCM],
       required: true,
-      default: ALGORITHM_AES_256_GCM,
+      default: ALGORITHM_AES_256_GCM
     },
     keyEncoding: {
       type: String,
       enum: [ENCODING_SCHEME_UTF8, ENCODING_SCHEME_BASE64],
       required: true,
-      default: ENCODING_SCHEME_UTF8,
+      default: ENCODING_SCHEME_UTF8
     },
     folder: {
       type: String,
-      required: true,
+      required: true
     },
     tags: {
       ref: "Tag",
       type: [Schema.Types.ObjectId],
-      default: [],
+      default: []
     }
   },
   {
-    timestamps: true,
+    timestamps: true
   }
 );
 
-export const SecretVersion = model<ISecretVersion>(
-  "SecretVersion",
-  secretVersionSchema
-);
+export const SecretVersion = model<ISecretVersion>("SecretVersion", secretVersionSchema);

backend/src/ee/services/ProjectRoleService.ts

@@ -49,7 +49,8 @@ export enum ProjectPermissionSub {
   IpAllowList = "ip-allowlist",
   Workspace = "workspace",
   Secrets = "secrets",
-  SecretRollback = "secret-rollback"
+  SecretRollback = "secret-rollback",
+  SecretApproval = "secret-approval"
 }
 
 type SubjectFields = {
@@ -72,6 +73,7 @@ export type ProjectPermissionSet =
   | [ProjectPermissionActions, ProjectPermissionSub.IpAllowList]
   | [ProjectPermissionActions, ProjectPermissionSub.Settings]
   | [ProjectPermissionActions, ProjectPermissionSub.ServiceTokens]
+  | [ProjectPermissionActions, ProjectPermissionSub.SecretApproval]
   | [ProjectPermissionActions.Delete, ProjectPermissionSub.Workspace]
   | [ProjectPermissionActions.Edit, ProjectPermissionSub.Workspace]
   | [ProjectPermissionActions.Read, ProjectPermissionSub.SecretRollback]
@@ -85,6 +87,11 @@ const buildAdminPermission = () => {
   can(ProjectPermissionActions.Edit, ProjectPermissionSub.Secrets);
   can(ProjectPermissionActions.Delete, ProjectPermissionSub.Secrets);
 
+  can(ProjectPermissionActions.Read, ProjectPermissionSub.SecretApproval);
+  can(ProjectPermissionActions.Create, ProjectPermissionSub.SecretApproval);
+  can(ProjectPermissionActions.Edit, ProjectPermissionSub.SecretApproval);
+  can(ProjectPermissionActions.Delete, ProjectPermissionSub.SecretApproval);
+
   can(ProjectPermissionActions.Read, ProjectPermissionSub.SecretRollback);
   can(ProjectPermissionActions.Create, ProjectPermissionSub.SecretRollback);
 
@@ -154,6 +161,8 @@ const buildMemberPermission = () => {
   can(ProjectPermissionActions.Edit, ProjectPermissionSub.Secrets);
   can(ProjectPermissionActions.Delete, ProjectPermissionSub.Secrets);
 
+  can(ProjectPermissionActions.Read, ProjectPermissionSub.SecretApproval);
+
   can(ProjectPermissionActions.Read, ProjectPermissionSub.SecretRollback);
   can(ProjectPermissionActions.Create, ProjectPermissionSub.SecretRollback);
 
@@ -203,6 +212,7 @@ const buildViewerPermission = () => {
   const { can, build } = new AbilityBuilder<MongoAbility<ProjectPermissionSet>>(createMongoAbility);
 
   can(ProjectPermissionActions.Read, ProjectPermissionSub.Secrets);
+  can(ProjectPermissionActions.Read, ProjectPermissionSub.SecretApproval);
   can(ProjectPermissionActions.Read, ProjectPermissionSub.SecretRollback);
   can(ProjectPermissionActions.Read, ProjectPermissionSub.Member);
   can(ProjectPermissionActions.Read, ProjectPermissionSub.Role);

backend/src/helpers/bot.ts

@@ -103,7 +103,10 @@ export const getSecretsBotHelper = async ({
   environment: string;
   secretPath: string;
 }) => {
-  const content: Record<string, { value: string; comment?: string }> = {};
+  const content: Record<
+    string,
+    { value: string; comment?: string; skipMultilineEncoding?: boolean }
+  > = {};
   const key = await getKey({ workspaceId: workspaceId });
 
   let folderId = "root";
@@ -165,6 +168,8 @@ export const getSecretsBotHelper = async ({
         });
         content[secretKey].comment = commentValue;
       }
+
+      content[secretKey].skipMultilineEncoding = secret.skipMultilineEncoding;
     });
   });
 
@@ -194,6 +199,8 @@ export const getSecretsBotHelper = async ({
       });
       content[secretKey].comment = commentValue;
     }
+
+    content[secretKey].skipMultilineEncoding = secret.skipMultilineEncoding;
   });
 
   await expandSecrets(workspaceId.toString(), key, content);

backend/src/helpers/secrets.ts

@@ -1,9 +1,12 @@
 import { Types } from "mongoose";
 import {
+  CreateSecretBatchParams,
   CreateSecretParams,
+  DeleteSecretBatchParams,
   DeleteSecretParams,
   GetSecretParams,
   GetSecretsParams,
+  UpdateSecretBatchParams,
   UpdateSecretParams
 } from "../interfaces/services/SecretService";
 import {
@@ -71,6 +74,8 @@ export function containsGlobPatterns(secretPath: string) {
   return globChars.some((char) => normalizedPath.includes(char));
 }
 
+const ERR_FOLDER_NOT_FOUND = BadRequestError({ message: "Folder not found" });
+
 /**
  * Returns an object containing secret [secret] but with its value, key, comment decrypted.
  *
@@ -330,7 +335,8 @@ export const createSecretHelper = async ({
   secretCommentIV,
   secretCommentTag,
   secretPath = "/",
-  metadata
+  metadata,
+  skipMultilineEncoding
 }: CreateSecretParams) => {
   const secretBlindIndex = await generateSecretBlindIndexHelper({
     secretName,
@@ -394,6 +400,7 @@ export const createSecretHelper = async ({
     secretCommentCiphertext,
     secretCommentIV,
     secretCommentTag,
+    skipMultilineEncoding,
     folder: folderId,
     algorithm: ALGORITHM_AES_256_GCM,
     keyEncoding: ENCODING_SCHEME_UTF8,
@@ -416,6 +423,7 @@ export const createSecretHelper = async ({
     secretValueCiphertext,
     secretValueIV,
     secretValueTag,
+    skipMultilineEncoding,
     algorithm: ALGORITHM_AES_256_GCM,
     keyEncoding: ENCODING_SCHEME_UTF8
   });
@@ -740,24 +748,57 @@ export const updateSecretHelper = async ({
   environment,
   type,
   authData,
+  newSecretName,
+  secretKeyTag,
+  secretKeyCiphertext,
+  secretKeyIV,
   secretValueCiphertext,
   secretValueIV,
   secretValueTag,
-  secretPath
+  secretPath,
+  tags,
+  secretCommentCiphertext,
+  secretCommentIV,
+  secretCommentTag,
+  skipMultilineEncoding
 }: UpdateSecretParams) => {
-  const secretBlindIndex = await generateSecretBlindIndexHelper({
-    secretName,
+  // get secret blind index salt
+  const salt = await getSecretBlindIndexSaltHelper({
     workspaceId: new Types.ObjectId(workspaceId)
   });
 
+  const oldSecretBlindIndex = await generateSecretBlindIndexWithSaltHelper({
+    secretName,
+    salt
+  });
+
   let secret: ISecret | null = null;
   const folderId = await getFolderIdFromServiceToken(workspaceId, environment, secretPath);
 
+  let newSecretNameBlindIndex = undefined;
+  if (newSecretName) {
+    newSecretNameBlindIndex = await generateSecretBlindIndexWithSaltHelper({
+      secretName: newSecretName,
+      salt
+    });
+    const doesSecretAlreadyExist = await Secret.exists({
+      secretBlindIndex: newSecretNameBlindIndex,
+      workspace: new Types.ObjectId(workspaceId),
+      environment,
+      folder: folderId,
+      type
+    });
+
+    if (doesSecretAlreadyExist) {
+      throw BadRequestError({ message: "Secret with the provided name already exist" });
+    }
+  }
+
   if (type === SECRET_SHARED) {
     // case: update shared secret
     secret = await Secret.findOneAndUpdate(
       {
-        secretBlindIndex,
+        secretBlindIndex: oldSecretBlindIndex,
         workspace: new Types.ObjectId(workspaceId),
         environment,
         folder: folderId,
@@ -767,6 +808,15 @@ export const updateSecretHelper = async ({
         secretValueCiphertext,
         secretValueIV,
         secretValueTag,
+        secretCommentIV,
+        secretCommentTag,
+        secretCommentCiphertext,
+        skipMultilineEncoding,
+        secretBlindIndex: newSecretNameBlindIndex,
+        secretKeyIV,
+        secretKeyTag,
+        secretKeyCiphertext,
+        tags,
         $inc: { version: 1 }
       },
       {
@@ -778,7 +828,7 @@ export const updateSecretHelper = async ({
 
     secret = await Secret.findOneAndUpdate(
       {
-        secretBlindIndex,
+        secretBlindIndex: oldSecretBlindIndex,
         workspace: new Types.ObjectId(workspaceId),
         environment,
         type,
@@ -789,10 +839,13 @@ export const updateSecretHelper = async ({
         secretValueCiphertext,
         secretValueIV,
         secretValueTag,
+        secretKeyIV,
+        secretKeyTag,
+        secretKeyCiphertext,
+        tags,
+        skipMultilineEncoding,
+        secretBlindIndex: newSecretNameBlindIndex,
         $inc: { version: 1 }
-      },
-      {
-        new: true
       }
     );
   }
@@ -805,16 +858,18 @@ export const updateSecretHelper = async ({
     workspace: secret.workspace,
     folder: folderId,
     type,
+    tags,
     ...(type === SECRET_PERSONAL ? getAuthDataPayloadUserObj(authData) : {}),
     environment: secret.environment,
     isDeleted: false,
-    secretBlindIndex,
+    secretBlindIndex: newSecretName ? newSecretNameBlindIndex : oldSecretBlindIndex,
     secretKeyCiphertext: secret.secretKeyCiphertext,
     secretKeyIV: secret.secretKeyIV,
     secretKeyTag: secret.secretKeyTag,
     secretValueCiphertext,
     secretValueIV,
     secretValueTag,
+    skipMultilineEncoding,
     algorithm: ALGORITHM_AES_256_GCM,
     keyEncoding: ENCODING_SCHEME_UTF8
   });
@@ -1098,6 +1153,7 @@ const recursivelyExpandSecret = async (
 
   let interpolatedValue = interpolatedSec[key];
   if (!interpolatedValue) {
+    // eslint-disable-next-line no-console
     console.error(`Couldn't find referenced value - ${key}`);
     return "";
   }
@@ -1147,7 +1203,7 @@ const formatMultiValueEnv = (val?: string) => {
 export const expandSecrets = async (
   workspaceId: string,
   rootEncKey: string,
-  secrets: Record<string, { value: string; comment?: string }>
+  secrets: Record<string, { value: string; comment?: string; skipMultilineEncoding?: boolean }>
 ) => {
   const expandedSec: Record<string, string> = {};
   const interpolatedSec: Record<string, string> = {};
@@ -1165,7 +1221,10 @@ export const expandSecrets = async (
 
   for (const key of Object.keys(secrets)) {
     if (expandedSec?.[key]) {
-      secrets[key].value = formatMultiValueEnv(expandedSec[key]);
+      // should not do multi line encoding if user has set it to skip
+      secrets[key].value = secrets[key].skipMultilineEncoding
+        ? expandedSec[key]
+        : formatMultiValueEnv(expandedSec[key]);
       continue;
     }
 
@@ -1180,8 +1239,506 @@ export const expandSecrets = async (
       key
     );
 
-    secrets[key].value = formatMultiValueEnv(expandedVal);
+    secrets[key].value = secrets[key].skipMultilineEncoding
+      ? expandedVal
+      : formatMultiValueEnv(expandedVal);
   }
 
   return secrets;
 };
+
+export const createSecretBatchHelper = async ({
+  secrets,
+  workspaceId,
+  authData,
+  secretPath,
+  environment
+}: CreateSecretBatchParams) => {
+  let folderId = "root";
+  const folders = await Folder.findOne({
+    workspace: workspaceId,
+    environment
+  });
+
+  if (!folders && secretPath !== "/") throw ERR_FOLDER_NOT_FOUND;
+  if (folders) {
+    const folder = getFolderByPath(folders.nodes, secretPath);
+    if (!folder) throw ERR_FOLDER_NOT_FOUND;
+    folderId = folder.id;
+  }
+
+  // get secret blind index salt
+  const salt = await getSecretBlindIndexSaltHelper({
+    workspaceId: new Types.ObjectId(workspaceId)
+  });
+
+  const secretBlindIndexToKey: Record<string, string> = {}; // used at audit log point
+  const secretBlindIndexes = await Promise.all(
+    secrets.map(({ secretName }) =>
+      generateSecretBlindIndexWithSaltHelper({
+        secretName,
+        salt
+      })
+    )
+  ).then((blindIndexes) =>
+    blindIndexes.reduce<Record<string, string>>((prev, curr, i) => {
+      prev[secrets[i].secretName] = curr;
+      secretBlindIndexToKey[curr] = secrets[i].secretName;
+      return prev;
+    }, {})
+  );
+
+  const exists = await Secret.exists({
+    workspace: new Types.ObjectId(workspaceId),
+    folder: folderId,
+    environment
+  })
+    .or(
+      secrets.map(({ secretName, type }) => ({
+        secretBlindIndex: secretBlindIndexes[secretName],
+        type: type,
+        ...(type === SECRET_PERSONAL ? getAuthDataPayloadUserObj(authData) : {})
+      }))
+    )
+    .exec();
+
+  if (exists)
+    throw BadRequestError({
+      message: "Failed to create secret that already exists"
+    });
+
+  // create secret
+  const newlyCreatedSecrets: ISecret[] = await Secret.insertMany(
+    secrets.map(
+      ({
+        type,
+        secretName,
+        secretKeyIV,
+        metadata,
+        secretKeyTag,
+        secretValueIV,
+        secretValueTag,
+        secretCommentIV,
+        secretCommentTag,
+        secretKeyCiphertext,
+        secretValueCiphertext,
+        secretCommentCiphertext,
+        skipMultilineEncoding
+      }) => ({
+        version: 1,
+        workspace: new Types.ObjectId(workspaceId),
+        environment,
+        type,
+        secretKeyCiphertext,
+        secretKeyIV,
+        secretKeyTag,
+        secretValueCiphertext,
+        secretValueIV,
+        secretValueTag,
+        secretCommentCiphertext,
+        secretCommentIV,
+        secretCommentTag,
+        folder: folderId,
+        algorithm: ALGORITHM_AES_256_GCM,
+        keyEncoding: ENCODING_SCHEME_UTF8,
+        metadata,
+        skipMultilineEncoding,
+        secretBlindIndex: secretBlindIndexes[secretName],
+        ...(type === SECRET_PERSONAL ? getAuthDataPayloadUserObj(authData) : {})
+      })
+    )
+  );
+
+  await EESecretService.addSecretVersions({
+    secretVersions: newlyCreatedSecrets.map(
+      (secret) =>
+        new SecretVersion({
+          secret: secret._id,
+          version: secret.version,
+          workspace: secret.workspace,
+          type: secret.type,
+          folder: folderId,
+          skipMultilineEncoding: secret?.skipMultilineEncoding,
+          ...(secret.type === SECRET_PERSONAL ? getAuthDataPayloadUserObj(authData) : {}),
+          environment: secret.environment,
+          isDeleted: false,
+          secretBlindIndex: secret.secretBlindIndex,
+          secretKeyCiphertext: secret.secretKeyCiphertext,
+          secretKeyIV: secret.secretKeyIV,
+          secretKeyTag: secret.secretKeyTag,
+          secretValueCiphertext: secret.secretValueCiphertext,
+          secretValueIV: secret.secretValueIV,
+          secretValueTag: secret.secretValueTag,
+          algorithm: ALGORITHM_AES_256_GCM,
+          keyEncoding: ENCODING_SCHEME_UTF8
+        })
+    )
+  });
+
+  await EEAuditLogService.createAuditLog(
+    authData,
+    {
+      type: EventType.CREATE_SECRETS,
+      metadata: {
+        environment,
+        secretPath,
+        secrets: newlyCreatedSecrets.map(({ secretBlindIndex, version, _id }) => ({
+          secretId: _id.toString(),
+          secretKey: secretBlindIndexToKey[secretBlindIndex || ""],
+          secretVersion: version
+        }))
+      }
+    },
+    {
+      workspaceId
+    }
+  );
+
+  // (EE) take a secret snapshot
+  await EESecretService.takeSecretSnapshot({
+    workspaceId,
+    environment,
+    folderId
+  });
+
+  const postHogClient = await TelemetryService.getPostHogClient();
+
+  if (postHogClient) {
+    postHogClient.capture({
+      event: "secrets added",
+      distinctId: await TelemetryService.getDistinctId({
+        authData
+      }),
+      properties: {
+        numberOfSecrets: 1,
+        environment,
+        workspaceId,
+        folderId,
+        channel: authData.userAgentType,
+        userAgent: authData.userAgent
+      }
+    });
+  }
+
+  return newlyCreatedSecrets;
+};
+
+export const updateSecretBatchHelper = async ({
+  workspaceId,
+  environment,
+  authData,
+  secretPath,
+  secrets
+}: UpdateSecretBatchParams) => {
+  let folderId = "root";
+  const folders = await Folder.findOne({
+    workspace: workspaceId,
+    environment
+  });
+
+  if (!folders && secretPath !== "/") throw ERR_FOLDER_NOT_FOUND;
+  if (folders) {
+    const folder = getFolderByPath(folders.nodes, secretPath);
+    if (!folder) throw ERR_FOLDER_NOT_FOUND;
+    folderId = folder.id;
+  }
+
+  // get secret blind index salt
+  const salt = await getSecretBlindIndexSaltHelper({
+    workspaceId: new Types.ObjectId(workspaceId)
+  });
+
+  const secretBlindIndexToKey: Record<string, string> = {}; // used at audit log point
+  const secretBlindIndexes = await Promise.all(
+    secrets.map(({ secretName }) =>
+      generateSecretBlindIndexWithSaltHelper({
+        secretName,
+        salt
+      })
+    )
+  ).then((blindIndexes) =>
+    blindIndexes.reduce<Record<string, string>>((prev, curr, i) => {
+      prev[secrets[i].secretName] = curr;
+      secretBlindIndexToKey[curr] = secrets[i].secretName;
+      return prev;
+    }, {})
+  );
+
+  const secretsToBeUpdated = await Secret.find({
+    workspace: new Types.ObjectId(workspaceId),
+    folder: folderId,
+    environment
+  })
+    .select("+secretBlindIndex")
+    .or(
+      secrets.map(({ secretName, type }) => ({
+        secretBlindIndex: secretBlindIndexes[secretName],
+        type: type,
+        ...(type === SECRET_PERSONAL ? getAuthDataPayloadUserObj(authData) : {})
+      }))
+    )
+    .lean();
+
+  if (secretsToBeUpdated.length !== secrets.length)
+    throw BadRequestError({ message: "Some secrets not found" });
+
+  await Secret.bulkWrite(
+    secrets.map(
+      ({
+        type,
+        secretName,
+        tags,
+        secretValueIV,
+        secretValueTag,
+        secretCommentIV,
+        secretCommentTag,
+        secretValueCiphertext,
+        secretCommentCiphertext,
+        skipMultilineEncoding
+      }) => ({
+        updateOne: {
+          filter: {
+            workspace: new Types.ObjectId(workspaceId),
+            environment,
+            folder: folderId,
+            secretBlindIndex: secretBlindIndexes[secretName],
+            type,
+            ...(type === SECRET_PERSONAL ? getAuthDataPayloadUserObj(authData) : {})
+          },
+          update: {
+            $inc: {
+              version: 1
+            },
+            secretValueCiphertext,
+            secretValueIV,
+            secretValueTag,
+            secretCommentCiphertext,
+            secretCommentIV,
+            secretCommentTag,
+            algorithm: ALGORITHM_AES_256_GCM,
+            keyEncoding: ENCODING_SCHEME_UTF8,
+            tags,
+            skipMultilineEncoding
+          }
+        }
+      })
+    )
+  );
+
+  const secretsGroupedByBlindIndex = secretsToBeUpdated.reduce<Record<string, ISecret>>(
+    (prev, curr) => {
+      if (curr.secretBlindIndex) prev[curr.secretBlindIndex] = curr;
+      return prev;
+    },
+    {}
+  );
+
+  await EESecretService.addSecretVersions({
+    secretVersions: secrets.map((secret) => {
+      const {
+        _id,
+        version,
+        workspace,
+        type,
+        secretBlindIndex,
+        secretKeyIV,
+        secretKeyTag,
+        secretKeyCiphertext,
+        skipMultilineEncoding
+      } = secretsGroupedByBlindIndex[secretBlindIndexes[secret.secretName]];
+
+      return new SecretVersion({
+        secret: _id,
+        version: version + 1,
+        workspace: workspace,
+        type,
+        folder: folderId,
+        ...(secret.type === SECRET_PERSONAL ? getAuthDataPayloadUserObj(authData) : {}),
+        environment,
+        isDeleted: false,
+        secretBlindIndex: secretBlindIndex,
+        secretKeyCiphertext: secretKeyCiphertext,
+        secretKeyIV: secretKeyIV,
+        secretKeyTag: secretKeyTag,
+        secretValueCiphertext: secret.secretValueCiphertext,
+        secretValueIV: secret.secretValueIV,
+        secretValueTag: secret.secretValueTag,
+        algorithm: ALGORITHM_AES_256_GCM,
+        keyEncoding: ENCODING_SCHEME_UTF8,
+        skipMultilineEncoding
+      });
+    })
+  });
+
+  await EEAuditLogService.createAuditLog(
+    authData,
+    {
+      type: EventType.UPDATE_SECRETS,
+      metadata: {
+        environment,
+        secretPath,
+        secrets: secretsToBeUpdated.map(({ _id, version, secretBlindIndex }) => ({
+          secretId: _id.toString(),
+          secretKey: secretBlindIndexToKey[secretBlindIndex || ""],
+          secretVersion: version + 1
+        }))
+      }
+    },
+    {
+      workspaceId
+    }
+  );
+
+  // (EE) take a secret snapshot
+  await EESecretService.takeSecretSnapshot({
+    workspaceId,
+    environment,
+    folderId
+  });
+
+  const postHogClient = await TelemetryService.getPostHogClient();
+
+  if (postHogClient) {
+    postHogClient.capture({
+      event: "secrets modified",
+      distinctId: await TelemetryService.getDistinctId({
+        authData
+      }),
+      properties: {
+        numberOfSecrets: 1,
+        environment,
+        workspaceId,
+        folderId,
+        channel: authData.userAgentType,
+        userAgent: authData.userAgent
+      }
+    });
+  }
+
+  return;
+};
+
+export const deleteSecretBatchHelper = async ({
+  workspaceId,
+  environment,
+  authData,
+  secretPath = "/",
+  secrets
+}: DeleteSecretBatchParams) => {
+  let folderId = "root";
+  const folders = await Folder.findOne({
+    workspace: workspaceId,
+    environment
+  });
+
+  if (!folders && secretPath !== "/") throw ERR_FOLDER_NOT_FOUND;
+  if (folders) {
+    const folder = getFolderByPath(folders.nodes, secretPath);
+    if (!folder) throw ERR_FOLDER_NOT_FOUND;
+    folderId = folder.id;
+  }
+
+  // get secret blind index salt
+  const salt = await getSecretBlindIndexSaltHelper({
+    workspaceId: new Types.ObjectId(workspaceId)
+  });
+
+  const secretBlindIndexToKey: Record<string, string> = {}; // used at audit log point
+  const secretBlindIndexes = await Promise.all(
+    secrets.map(({ secretName }) =>
+      generateSecretBlindIndexWithSaltHelper({
+        secretName,
+        salt
+      })
+    )
+  ).then((blindIndexes) =>
+    blindIndexes.reduce<Record<string, string>>((prev, curr, i) => {
+      prev[secrets[i].secretName] = curr;
+      secretBlindIndexToKey[curr] = secrets[i].secretName;
+      return prev;
+    }, {})
+  );
+
+  const deletedSecrets = await Secret.find({
+    workspace: new Types.ObjectId(workspaceId),
+    folder: folderId,
+    environment
+  })
+    .or(
+      secrets.map(({ secretName, type }) => ({
+        secretBlindIndex: secretBlindIndexes[secretName],
+        type: type === "shared" ? { $in: ["shared", "personal"] } : type,
+        ...(type === SECRET_PERSONAL ? getAuthDataPayloadUserObj(authData) : {})
+      }))
+    )
+    .select({ secretBlindIndexes: 1 })
+    .lean()
+    .exec();
+
+  await Secret.deleteMany({
+    workspace: new Types.ObjectId(workspaceId),
+    folder: folderId,
+    environment
+  })
+    .or(
+      secrets.map(({ secretName, type }) => ({
+        secretBlindIndex: secretBlindIndexes[secretName],
+        type: type === "shared" ? { $in: ["shared", "personal"] } : type,
+        ...(type === SECRET_PERSONAL ? getAuthDataPayloadUserObj(authData) : {})
+      }))
+    )
+    .exec();
+
+  await EESecretService.markDeletedSecretVersions({
+    secretIds: deletedSecrets.map((secret) => secret._id)
+  });
+
+  await EEAuditLogService.createAuditLog(
+    authData,
+    {
+      type: EventType.DELETE_SECRETS,
+      metadata: {
+        environment,
+        secretPath,
+        secrets: deletedSecrets.map(({ _id, version, secretBlindIndex }) => ({
+          secretId: _id.toString(),
+          secretKey: secretBlindIndexToKey[secretBlindIndex || ""],
+          secretVersion: version
+        }))
+      }
+    },
+    {
+      workspaceId
+    }
+  );
+
+  // (EE) take a secret snapshot
+  await EESecretService.takeSecretSnapshot({
+    workspaceId,
+    environment,
+    folderId
+  });
+
+  const postHogClient = await TelemetryService.getPostHogClient();
+
+  if (postHogClient) {
+    postHogClient.capture({
+      event: "secrets deleted",
+      distinctId: await TelemetryService.getDistinctId({
+        authData
+      }),
+      properties: {
+        numberOfSecrets: secrets.length,
+        environment,
+        workspaceId,
+        folderId,
+        channel: authData.userAgentType,
+        userAgent: authData.userAgent
+      }
+    });
+  }
+
+  return {
+    secrets: deletedSecrets
+  };
+};

backend/src/index.ts

@@ -38,6 +38,7 @@ import {
   membership as v1MembershipRouter,
   organization as v1OrganizationRouter,
   password as v1PasswordRouter,
+  secretApprovalPolicy as v1SecretApprovalPolicy,
   secretImps as v1SecretImpsRouter,
   secret as v1SecretRouter,
   secretsFolder as v1SecretsFolder,
@@ -176,6 +177,7 @@ const main = async () => {
   app.use("/api/v1/webhooks", v1WebhooksRouter);
   app.use("/api/v1/secret-imports", v1SecretImpsRouter);
   app.use("/api/v1/roles", v1RoleRouter);
+  app.use("/api/v1/secret-approvals", v1SecretApprovalPolicy);
 
   // v2 routes (improvements)
   app.use("/api/v2/signup", v2SignupRouter);

backend/src/integrations/sync.ts

@@ -65,10 +65,10 @@ import sodium from "libsodium-wrappers";
 import { standardRequest } from "../config/request";
 
 const getSecretKeyValuePair = (
-  secrets: Record<string, { value: string; comment?: string } | null>
+  secrets: Record<string, { value: string | null; comment?: string } | null>
 ) =>
-  Object.keys(secrets).reduce<Record<string, string>>((prev, key) => {
-    if (secrets[key]) prev[key] = secrets[key]?.value || "";
+  Object.keys(secrets).reduce<Record<string, string | null | undefined>>((prev, key) => {
+    prev[key] = secrets?.[key] === null ? null : secrets?.[key]?.value;
     return prev;
   }, {});
 
@@ -325,40 +325,42 @@ const syncSecretsGCPSecretManager = async ({
     name: string;
     createTime: string;
   }
-  
+
   interface GCPSMListSecretsRes {
     secrets?: GCPSecret[];
     totalSize?: number;
     nextPageToken?: string;
   }
-  
+
   let gcpSecrets: GCPSecret[] = [];
-  
+
   const pageSize = 100;
   let pageToken: string | undefined;
   let hasMorePages = true;
 
-  const filterParam = integration.metadata.secretGCPLabel 
-    ? `?filter=labels.${integration.metadata.secretGCPLabel.labelName}=${integration.metadata.secretGCPLabel.labelValue}` 
+  const filterParam = integration.metadata.secretGCPLabel
+    ? `?filter=labels.${integration.metadata.secretGCPLabel.labelName}=${integration.metadata.secretGCPLabel.labelValue}`
     : "";
-  
+
   while (hasMorePages) {
     const params = new URLSearchParams({
       pageSize: String(pageSize),
       ...(pageToken ? { pageToken } : {})
     });
 
-    const res: GCPSMListSecretsRes = (await standardRequest.get(
-      `${INTEGRATION_GCP_SECRET_MANAGER_URL}/v1/projects/${integration.appId}/secrets${filterParam}`,
-      {
-        params,
-        headers: {
-          "Authorization": `Bearer ${accessToken}`,
-          "Accept-Encoding": "application/json"
+    const res: GCPSMListSecretsRes = (
+      await standardRequest.get(
+        `${INTEGRATION_GCP_SECRET_MANAGER_URL}/v1/projects/${integration.appId}/secrets${filterParam}`,
+        {
+          params,
+          headers: {
+            Authorization: `Bearer ${accessToken}`,
+            "Accept-Encoding": "application/json"
+          }
         }
-      }
-    )).data;
-    
+      )
+    ).data;
+
     if (res.secrets) {
       const filteredSecrets = res.secrets?.filter((gcpSecret) => {
         const arr = gcpSecret.name.split("/");
@@ -366,54 +368,58 @@ const syncSecretsGCPSecretManager = async ({
 
         let isValid = true;
 
-        if (integration.metadata.secretPrefix && !key.startsWith(integration.metadata.secretPrefix)) {
+        if (
+          integration.metadata.secretPrefix &&
+          !key.startsWith(integration.metadata.secretPrefix)
+        ) {
           isValid = false;
         }
 
         if (integration.metadata.secretSuffix && !key.endsWith(integration.metadata.secretSuffix)) {
           isValid = false;
         }
-        
+
         return isValid;
       });
 
       gcpSecrets = gcpSecrets.concat(filteredSecrets);
     }
-    
+
     if (!res.nextPageToken) {
       hasMorePages = false;
     }
-    
+
     pageToken = res.nextPageToken;
   }
-  
-  const res: { [key: string]: string; } = {};
-  
+
+  const res: { [key: string]: string } = {};
+
   interface GCPLatestSecretVersionAccess {
     name: string;
     payload: {
       data: string;
-    }
+    };
   }
-  
+
   for await (const gcpSecret of gcpSecrets) {
     const arr = gcpSecret.name.split("/");
     const key = arr[arr.length - 1];
 
-    const secretLatest: GCPLatestSecretVersionAccess = (await standardRequest.get(
-      `${INTEGRATION_GCP_SECRET_MANAGER_URL}/v1/projects/${integration.appId}/secrets/${key}/versions/latest:access`,
-      {
-        headers: {
-          Authorization: `Bearer ${accessToken}`,
-          "Accept-Encoding": "application/json"
+    const secretLatest: GCPLatestSecretVersionAccess = (
+      await standardRequest.get(
+        `${INTEGRATION_GCP_SECRET_MANAGER_URL}/v1/projects/${integration.appId}/secrets/${key}/versions/latest:access`,
+        {
+          headers: {
+            Authorization: `Bearer ${accessToken}`,
+            "Accept-Encoding": "application/json"
+          }
         }
-      }
-    )).data;
+      )
+    ).data;
 
-    
     res[key] = Buffer.from(secretLatest.payload.data, "base64").toString("utf-8");
   }
-  
+
   for await (const key of Object.keys(secrets)) {
     if (!(key in res)) {
       // case: create secret
@@ -423,11 +429,14 @@ const syncSecretsGCPSecretManager = async ({
           replication: {
             automatic: {}
           },
-          ...(integration.metadata.secretGCPLabel ? {
-            labels: {
-              [integration.metadata.secretGCPLabel.labelName]: integration.metadata.secretGCPLabel.labelValue
-            }
-          } : {})
+          ...(integration.metadata.secretGCPLabel
+            ? {
+                labels: {
+                  [integration.metadata.secretGCPLabel.labelName]:
+                    integration.metadata.secretGCPLabel.labelValue
+                }
+              }
+            : {})
         },
         {
           params: {
@@ -439,7 +448,7 @@ const syncSecretsGCPSecretManager = async ({
           }
         }
       );
-      
+
       await standardRequest.post(
         `${INTEGRATION_GCP_SECRET_MANAGER_URL}/v1/projects/${integration.appId}/secrets/${key}:addVersion`,
         {
@@ -456,7 +465,7 @@ const syncSecretsGCPSecretManager = async ({
       );
     }
   }
-  
+
   for await (const key of Object.keys(res)) {
     if (!(key in secrets)) {
       // case: delete secret
@@ -489,7 +498,7 @@ const syncSecretsGCPSecretManager = async ({
       }
     }
   }
-}
+};
 
 /**
  * Sync/push [secrets] to Azure Key Vault with vault URI [integration.app]
@@ -729,15 +738,12 @@ const syncSecretsAWSParameterStore = async ({
   } = {};
 
   if (parameterList) {
-    awsParameterStoreSecretsObj = parameterList.reduce(
-      (obj: any, secret: any) => {
-        return ({
-          ...obj,
-          [secret.Name.substring(integration.path.length)]: secret
-        });
-      },
-      {}
-    );
+    awsParameterStoreSecretsObj = parameterList.reduce((obj: any, secret: any) => {
+      return {
+        ...obj,
+        [secret.Name.substring(integration.path.length)]: secret
+      };
+    }, {});
   }
 
   // Identify secrets to create
@@ -1869,8 +1875,10 @@ const syncSecretsGitLab = async ({
     value: string;
     environment_scope: string;
   }
-  
-  const gitLabApiUrl = integrationAuth.url ? `${integrationAuth.url}/api` : INTEGRATION_GITLAB_API_URL;
+
+  const gitLabApiUrl = integrationAuth.url
+    ? `${integrationAuth.url}/api`
+    : INTEGRATION_GITLAB_API_URL;
 
   const getAllEnvVariables = async (integrationAppId: string, accessToken: string) => {
     const headers = {
@@ -1880,7 +1888,9 @@ const syncSecretsGitLab = async ({
     };
 
     let allEnvVariables: GitLabSecret[] = [];
-    let url: string | null = `${gitLabApiUrl}/v4/projects/${integrationAppId}/variables?per_page=100`;
+    let url:
+      | string
+      | null = `${gitLabApiUrl}/v4/projects/${integrationAppId}/variables?per_page=100`;
 
     while (url) {
       const response: any = await standardRequest.get(url, { headers });
@@ -1901,23 +1911,27 @@ const syncSecretsGitLab = async ({
 
   const allEnvVariables = await getAllEnvVariables(integration?.appId, accessToken);
   const getSecretsRes: GitLabSecret[] = allEnvVariables
-    .filter(
-      (secret: GitLabSecret) => secret.environment_scope === integration.targetEnvironment
-    )
+    .filter((secret: GitLabSecret) => secret.environment_scope === integration.targetEnvironment)
     .filter((gitLabSecret) => {
       let isValid = true;
 
-      if (integration.metadata.secretPrefix && !gitLabSecret.key.startsWith(integration.metadata.secretPrefix)) {
+      if (
+        integration.metadata.secretPrefix &&
+        !gitLabSecret.key.startsWith(integration.metadata.secretPrefix)
+      ) {
         isValid = false;
       }
 
-      if (integration.metadata.secretSuffix && !gitLabSecret.key.endsWith(integration.metadata.secretSuffix)) {
+      if (
+        integration.metadata.secretSuffix &&
+        !gitLabSecret.key.endsWith(integration.metadata.secretSuffix)
+      ) {
         isValid = false;
       }
-      
+
       return isValid;
     });
-  
+
   for await (const key of Object.keys(secrets)) {
     const existingSecret = getSecretsRes.find((s: any) => s.key == key);
     if (!existingSecret) {
@@ -2371,41 +2385,43 @@ const syncSecretsTeamCity = async ({
 
   if (integration.targetEnvironment && integration.targetEnvironmentId) {
     // case: sync to specific build-config in TeamCity project
-    const res = (await standardRequest.get<GetTeamCityBuildConfigParametersRes>(
-      `${integrationAuth.url}/app/rest/buildTypes/${integration.targetEnvironmentId}/parameters`, 
-      {
-        headers: {
-          Authorization: `Bearer ${accessToken}`,
-          Accept: "application/json",
-        },
-      }
-    ))
-    .data
-    .property
-    .filter((parameter) => !parameter.inherited)
-    .reduce((obj: any, secret: TeamCitySecret) => {
-      const secretName = secret.name.replace(/^env\./, "");
-      return {
-        ...obj,
-        [secretName]: secret.value
-      };
-    }, {});
-      
+    const res = (
+      await standardRequest.get<GetTeamCityBuildConfigParametersRes>(
+        `${integrationAuth.url}/app/rest/buildTypes/${integration.targetEnvironmentId}/parameters`,
+        {
+          headers: {
+            Authorization: `Bearer ${accessToken}`,
+            Accept: "application/json"
+          }
+        }
+      )
+    ).data.property
+      .filter((parameter) => !parameter.inherited)
+      .reduce((obj: any, secret: TeamCitySecret) => {
+        const secretName = secret.name.replace(/^env\./, "");
+        return {
+          ...obj,
+          [secretName]: secret.value
+        };
+      }, {});
+
     for await (const key of Object.keys(secrets)) {
       if (!(key in res) || (key in res && secrets[key].value !== res[key])) {
         // case: secret does not exist in TeamCity or secret value has changed
         // -> create/update secret
-        await standardRequest.post(`${integrationAuth.url}/app/rest/buildTypes/${integration.targetEnvironmentId}/parameters`,
-        {
-          name:`env.${key}`,
-          value: secrets[key].value
-        },
-        {
-          headers: {
-            Authorization: `Bearer ${accessToken}`,
-            Accept: "application/json",
+        await standardRequest.post(
+          `${integrationAuth.url}/app/rest/buildTypes/${integration.targetEnvironmentId}/parameters`,
+          {
+            name: `env.${key}`,
+            value: secrets[key].value
           },
-        });
+          {
+            headers: {
+              Authorization: `Bearer ${accessToken}`,
+              Accept: "application/json"
+            }
+          }
+        );
       }
     }
 
@@ -3034,4 +3050,4 @@ const syncSecretsNorthflank = async ({
   );
 };
 
-export { syncSecrets };
+export { syncSecrets };

backend/src/interfaces/services/SecretService/index.ts

@@ -16,6 +16,7 @@ export interface CreateSecretParams {
   secretCommentCiphertext?: string;
   secretCommentIV?: string;
   secretCommentTag?: string;
+  skipMultilineEncoding?: boolean;
   secretPath: string;
   metadata?: {
     source?: string;
@@ -42,6 +43,10 @@ export interface GetSecretParams {
 
 export interface UpdateSecretParams {
   secretName: string;
+  newSecretName?: string;
+  secretKeyCiphertext?: string;
+  secretKeyIV?: string;
+  secretKeyTag?: string;
   workspaceId: Types.ObjectId;
   environment: string;
   type: "shared" | "personal";
@@ -50,6 +55,11 @@ export interface UpdateSecretParams {
   secretValueIV: string;
   secretValueTag: string;
   secretPath: string;
+  secretCommentCiphertext?: string;
+  secretCommentIV?: string;
+  secretCommentTag?: string;
+  skipMultilineEncoding?: boolean;
+  tags?: string[];
 }
 
 export interface DeleteSecretParams {
@@ -60,3 +70,57 @@ export interface DeleteSecretParams {
   authData: AuthData;
   secretPath: string;
 }
+
+export interface CreateSecretBatchParams {
+  workspaceId: Types.ObjectId;
+  environment: string;
+  authData: AuthData;
+  secretPath: string;
+  secrets: Array<{
+    secretName: string;
+    type: "shared" | "personal";
+    secretKeyCiphertext: string;
+    secretKeyIV: string;
+    secretKeyTag: string;
+    secretValueCiphertext: string;
+    secretValueIV: string;
+    secretValueTag: string;
+    secretCommentCiphertext?: string;
+    secretCommentIV?: string;
+    secretCommentTag?: string;
+    skipMultilineEncoding?: boolean;
+    metadata?: {
+      source?: string;
+    };
+  }>;
+}
+
+export interface UpdateSecretBatchParams {
+  workspaceId: Types.ObjectId;
+  environment: string;
+  authData: AuthData;
+  secretPath: string;
+  secrets: Array<{
+    secretName: string;
+    type: "shared" | "personal";
+    secretValueCiphertext: string;
+    secretValueIV: string;
+    secretValueTag: string;
+    secretCommentCiphertext?: string;
+    secretCommentIV?: string;
+    secretCommentTag?: string;
+    skipMultilineEncoding?: boolean;
+    tags?: string[];
+  }>;
+}
+
+export interface DeleteSecretBatchParams {
+  workspaceId: Types.ObjectId;
+  environment: string;
+  authData: AuthData;
+  secretPath: string;
+  secrets: Array<{
+    secretName: string;
+    type: "shared" | "personal";
+  }>;
+}

backend/src/models/secret.ts

@@ -4,7 +4,7 @@ import {
   ENCODING_SCHEME_BASE64,
   ENCODING_SCHEME_UTF8,
   SECRET_PERSONAL,
-  SECRET_SHARED,
+  SECRET_SHARED
 } from "../variables";
 
 export interface ISecret {
@@ -12,7 +12,7 @@ export interface ISecret {
   version: number;
   workspace: Types.ObjectId;
   type: string;
-  user: Types.ObjectId;
+  user?: Types.ObjectId;
   environment: string;
   secretBlindIndex?: string;
   secretKeyCiphertext: string;
@@ -27,13 +27,14 @@ export interface ISecret {
   secretCommentIV?: string;
   secretCommentTag?: string;
   secretCommentHash?: string;
+  skipMultilineEncoding?: boolean;
   algorithm: "aes-256-gcm";
   keyEncoding: "utf8" | "base64";
   tags?: string[];
   folder?: string;
   metadata?: {
     [key: string]: string;
-  }
+  };
 }
 
 const secretSchema = new Schema<ISecret>(
@@ -41,108 +42,112 @@ const secretSchema = new Schema<ISecret>(
     version: {
       type: Number,
       required: true,
-      default: 1,
+      default: 1
     },
     workspace: {
       type: Schema.Types.ObjectId,
       ref: "Workspace",
-      required: true,
+      required: true
     },
     type: {
       type: String,
       enum: [SECRET_SHARED, SECRET_PERSONAL],
-      required: true,
+      required: true
     },
     user: {
       // user associated with the personal secret
       type: Schema.Types.ObjectId,
-      ref: "User",
+      ref: "User"
     },
     tags: {
       ref: "Tag",
       type: [Schema.Types.ObjectId],
-      default: [],
+      default: []
     },
     environment: {
       type: String,
-      required: true,
+      required: true
     },
     secretBlindIndex: {
       type: String,
-      select: false,
+      select: false
     },
     secretKeyCiphertext: {
       type: String,
-      required: true,
+      required: true
     },
     secretKeyIV: {
       type: String, // symmetric
-      required: true,
+      required: true
     },
     secretKeyTag: {
       type: String, // symmetric
-      required: true,
+      required: true
     },
     secretKeyHash: {
-      type: String,
+      type: String
     },
     secretValueCiphertext: {
       type: String,
-      required: true,
+      required: true
     },
     secretValueIV: {
       type: String, // symmetric
-      required: true,
+      required: true
     },
     secretValueTag: {
       type: String, // symmetric
-      required: true,
+      required: true
     },
     secretValueHash: {
-      type: String,
+      type: String
     },
     secretCommentCiphertext: {
       type: String,
-      required: false,
+      required: false
     },
     secretCommentIV: {
       type: String, // symmetric
-      required: false,
+      required: false
     },
     secretCommentTag: {
       type: String, // symmetric
-      required: false,
+      required: false
     },
     secretCommentHash: {
       type: String,
-      required: false,
+      required: false
+    },
+    skipMultilineEncoding: {
+      type: Boolean,
+      required: false
     },
     algorithm: {
       // the encryption algorithm used
       type: String,
       enum: [ALGORITHM_AES_256_GCM],
       required: true,
-      default: ALGORITHM_AES_256_GCM,
+      default: ALGORITHM_AES_256_GCM
     },
     keyEncoding: {
       type: String,
       enum: [ENCODING_SCHEME_UTF8, ENCODING_SCHEME_BASE64],
       required: true,
-      default: ENCODING_SCHEME_UTF8,
+      default: ENCODING_SCHEME_UTF8
     },
     folder: {
       type: String,
-      default: "root",
+      default: "root"
     },
     metadata: {
       type: Schema.Types.Mixed
     }
   },
   {
-    timestamps: true,
+    timestamps: true
   }
 );
 
 secretSchema.index({ tags: 1 }, { background: true });
 
-export const Secret = model<ISecret>("Secret", secretSchema);
+export const Secret = model<ISecret>("Secret", secretSchema);

backend/src/models/secretApprovalPolicy.ts

@@ -0,0 +1,47 @@
+import { Schema, Types, model } from "mongoose";
+
+export interface ISecretApprovalPolicy {
+  _id: Types.ObjectId;
+  workspace: Types.ObjectId;
+  environment: string;
+  secretPath?: string;
+  approvers: Types.ObjectId[];
+  approvals: number;
+}
+
+const secretApprovalPolicySchema = new Schema<ISecretApprovalPolicy>(
+  {
+    workspace: {
+      type: Schema.Types.ObjectId,
+      ref: "Workspace",
+      required: true
+    },
+    approvers: [
+      {
+        // user associated with the personal secret
+        type: Schema.Types.ObjectId,
+        ref: "Membership"
+      }
+    ],
+    environment: {
+      type: String,
+      required: true
+    },
+    secretPath: {
+      type: String,
+      required: false
+    },
+    approvals: {
+      type: Number,
+      default: 1
+    }
+  },
+  {
+    timestamps: true
+  }
+);
+
+export const SecretApprovalPolicy = model<ISecretApprovalPolicy>(
+  "SecretApprovalPolicy",
+  secretApprovalPolicySchema
+);

backend/src/models/secretApprovalRequest.ts

@@ -1,81 +1,68 @@
-import mongoose, { Schema, model } from "mongoose";
-import { ISecret, Secret } from "./secret";
+import { Schema, Types, model } from "mongoose";
+import { ISecretVersion, SecretVersion } from "../ee/models/secretVersion";
 
-interface ISecretApprovalRequest {
-	secret: mongoose.Types.ObjectId;
-	requestedChanges: ISecret;
-	requestedBy: mongoose.Types.ObjectId;
-	approvers: IApprover[];
-	status: ApprovalStatus;
-	timestamp: Date;
-	requestType: RequestType;
-	requestId: string;
+enum ApprovalStatus {
+  PENDING = "pending",
+  APPROVED = "approved",
+  REJECTED = "rejected"
 }
 
-interface IApprover {
-	userId: mongoose.Types.ObjectId;
-	status: ApprovalStatus;
+enum CommitType {
+  DELETE = "delete",
+  UPDATE = "update",
+  CREATE = "create"
 }
 
-export enum ApprovalStatus {
-	PENDING = "pending",
-	APPROVED = "approved",
-	REJECTED = "rejected"
+export interface ISecretApprovalRequest {
+  _id: Types.ObjectId;
+  committer: Types.ObjectId;
+  approvers: {
+    member: Types.ObjectId;
+    status: ApprovalStatus;
+  }[];
+  approvals: number;
+  hasMerged: boolean;
+  status: ApprovalStatus;
+  commits: {
+    secretVersion: Types.ObjectId;
+    newVersion: ISecretVersion;
+    op: CommitType;
+  }[];
 }
 
-export enum RequestType {
-	UPDATE = "update",
-	DELETE = "delete",
-	CREATE = "create"
-}
-
-const approverSchema = new mongoose.Schema({
-	user: {
-		type: mongoose.Schema.Types.ObjectId,
-		ref: "User",
-		required: true,
-	},
-	status: {
-		type: String,
-		enum: [ApprovalStatus],
-		default: ApprovalStatus.PENDING,
-	},
-});
-
 const secretApprovalRequestSchema = new Schema<ISecretApprovalRequest>(
-	{
-		secret: {
-			type: mongoose.Schema.Types.ObjectId,
-			ref: "Secret",
-		},
-		requestedChanges: Secret,
-		requestedBy: {
-			type: mongoose.Schema.Types.ObjectId,
-			ref: "User",
-		},
-		approvers: [approverSchema],
-		status: {
-			type: String,
-			enum: ApprovalStatus,
-			default: ApprovalStatus.PENDING,
-		},
-		timestamp: {
-			type: Date,
-			default: Date.now,
-		},
-		requestType: {
-			type: String,
-			enum: RequestType,
-			required: true,
-		},
-		requestId: {
-			type: String,
-			required: false,
-		},
-	},
-	{
-		timestamps: true,
-	}
+  {
+    approvers: [
+      {
+        member: {
+          // user associated with the personal secret
+          type: Schema.Types.ObjectId,
+          ref: "Membership"
+        },
+        status: { type: String, enum: ApprovalStatus, default: ApprovalStatus.PENDING }
+      }
+    ],
+    approvals: {
+      type: Number,
+      required: true
+    },
+    hasMerged: { type: Boolean, default: false },
+    status: { type: String, enum: ApprovalStatus, default: ApprovalStatus.PENDING },
+    committer: { type: Schema.Types.ObjectId, ref: "Membership" },
+    commits: [
+      {
+        secretVersion: { type: Types.ObjectId, ref: "SecretVersion" },
+        newVersion: SecretVersion,
+        op: { type: String, enum: [CommitType], required: true }
+      }
+    ]
+  },
+  {
+    timestamps: true
+  }
 );
 
-export const SecretApprovalRequest = model<ISecretApprovalRequest>("SecretApprovalRequest", secretApprovalRequestSchema);
+export const SecretApprovalRequest = model<ISecretApprovalRequest>(
+  "SecretApprovalRequest",
+  secretApprovalRequestSchema
+);

backend/src/queues/secret-scanning/githubScanFullRepository.ts

@@ -13,7 +13,7 @@ export const githubFullRepositorySecretScan = new Queue("github-full-repository-
 
 type TScanPushEventQueueDetails = {
   organizationId: string,
-  installationId: number,
+  installationId: string,
   repository: {
     id: number,
     fullName: string,
@@ -30,7 +30,8 @@ githubFullRepositorySecretScan.process(async (job: Job, done: Queue.DoneCallback
         installationId: installationId
       },
     });
-    const findings: SecretMatch[] = await scanFullRepoContentAndGetFindings(octokit, installationId, repository.fullName)
+
+    const findings: SecretMatch[] = await scanFullRepoContentAndGetFindings(octokit, installationId as any, repository.fullName)
     for (const finding of findings) {
       await GitRisks.findOneAndUpdate({ fingerprint: finding.Fingerprint },
         {

backend/src/routes/v1/index.ts

@@ -17,6 +17,7 @@ import integrationAuth from "./integrationAuth";
 import secretsFolder from "./secretsFolder";
 import webhooks from "./webhook";
 import secretImps from "./secretImps";
+import secretApprovalPolicy from "./secretApprovalPolicy";
 
 export {
   signup,
@@ -37,5 +38,6 @@ export {
   integrationAuth,
   secretsFolder,
   webhooks,
-  secretImps
+  secretImps,
+  secretApprovalPolicy
 };

backend/src/routes/v1/secretApprovalPolicy.ts

@@ -0,0 +1,39 @@
+import express from "express";
+const router = express.Router();
+import { requireAuth } from "../../middleware";
+import { secretApprovalPolicyController } from "../../controllers/v1";
+import { AuthMode } from "../../variables";
+
+router.get(
+  "/",
+  requireAuth({
+    acceptedAuthModes: [AuthMode.JWT]
+  }),
+  secretApprovalPolicyController.getSecretApprovalPolicy
+);
+
+router.post(
+  "/",
+  requireAuth({
+    acceptedAuthModes: [AuthMode.JWT]
+  }),
+  secretApprovalPolicyController.createSecretApprovalPolicy
+);
+
+router.patch(
+  "/:id",
+  requireAuth({
+    acceptedAuthModes: [AuthMode.JWT]
+  }),
+  secretApprovalPolicyController.updateSecretApprovalPolicy
+);
+
+router.delete(
+  "/:id",
+  requireAuth({
+    acceptedAuthModes: [AuthMode.JWT]
+  }),
+  secretApprovalPolicyController.deleteSecretApprovalPolicy
+);
+
+export default router;

backend/src/routes/v1/secretsFolder.ts

@@ -18,7 +18,7 @@ router.post(
 );
 
 router.patch(
-  "/:folderId",
+  "/:folderName",
   requireAuth({
     acceptedAuthModes: [AuthMode.JWT, AuthMode.SERVICE_TOKEN]
   }),
@@ -26,7 +26,7 @@ router.patch(
 );
 
 router.delete(
-  "/:folderId",
+  "/:folderName",
   requireAuth({
     acceptedAuthModes: [AuthMode.JWT, AuthMode.SERVICE_TOKEN]
   }),

backend/src/routes/v3/secrets.ts

@@ -1,14 +1,8 @@
 import express from "express";
 const router = express.Router();
-import {
-  requireAuth,
-  requireBlindIndicesEnabled,
-  requireE2EEOff
-} from "../../middleware";
+import { requireAuth, requireBlindIndicesEnabled, requireE2EEOff } from "../../middleware";
 import { secretsController } from "../../controllers/v3";
-import {
-  AuthMode
-} from "../../variables";
+import { AuthMode } from "../../variables";
 
 router.get(
   "/raw",
@@ -85,6 +79,40 @@ router.get(
   secretsController.getSecrets
 );
 
+// akhilmhdh: dont put batch router below the individual operation as those have arbitory name as params
+router.post(
+  "/batch",
+  requireAuth({
+    acceptedAuthModes: [AuthMode.JWT, AuthMode.API_KEY, AuthMode.SERVICE_TOKEN]
+  }),
+  requireBlindIndicesEnabled({
+    locationWorkspaceId: "body"
+  }),
+  secretsController.createSecretByNameBatch
+);
+
+router.patch(
+  "/batch",
+  requireAuth({
+    acceptedAuthModes: [AuthMode.JWT, AuthMode.API_KEY, AuthMode.SERVICE_TOKEN]
+  }),
+  requireBlindIndicesEnabled({
+    locationWorkspaceId: "body"
+  }),
+  secretsController.updateSecretByNameBatch
+);
+
+router.delete(
+  "/batch",
+  requireAuth({
+    acceptedAuthModes: [AuthMode.JWT, AuthMode.API_KEY, AuthMode.SERVICE_TOKEN]
+  }),
+  requireBlindIndicesEnabled({
+    locationWorkspaceId: "body"
+  }),
+  secretsController.deleteSecretByNameBatch
+);
+
 router.post(
   "/:secretName",
   requireAuth({

backend/src/services/SecretImportService.ts

@@ -108,14 +108,6 @@ export const getAllImportedSecrets = async (
         type: "shared"
       }
     },
-    {
-      $lookup: {
-        from: "tags", // note this is the name of the collection in the database, not the Mongoose model name
-        localField: "tags",
-        foreignField: "_id",
-        as: "tags"
-      }
-    },
     {
       $group: {
         _id: {

backend/src/services/SecretService.ts

@@ -1,21 +1,27 @@
 import { Types } from "mongoose";
 import {
-    CreateSecretParams,
-    DeleteSecretParams,
-    GetSecretParams,
-    GetSecretsParams,
-    UpdateSecretParams,
+  CreateSecretBatchParams,
+  CreateSecretParams,
+  DeleteSecretBatchParams,
+  DeleteSecretParams,
+  GetSecretParams,
+  GetSecretsParams,
+  UpdateSecretBatchParams,
+  UpdateSecretParams
 } from "../interfaces/services/SecretService";
-import { 
-    createSecretBlindIndexDataHelper,
-    createSecretHelper,
-    deleteSecretHelper,
-    generateSecretBlindIndexHelper,
-    generateSecretBlindIndexWithSaltHelper,
-    getSecretBlindIndexSaltHelper,
-    getSecretHelper,
-    getSecretsHelper,
-    updateSecretHelper,
+import {
+  createSecretBatchHelper,
+  createSecretBlindIndexDataHelper,
+  createSecretHelper,
+  deleteSecretBatchHelper,
+  deleteSecretHelper,
+  generateSecretBlindIndexHelper,
+  generateSecretBlindIndexWithSaltHelper,
+  getSecretBlindIndexSaltHelper,
+  getSecretHelper,
+  getSecretsHelper,
+  updateSecretBatchHelper,
+  updateSecretHelper
 } from "../helpers/secrets";
 
 class SecretService {
@@ -26,13 +32,9 @@ class SecretService {
    * @param {Buffer} obj.salt - 16-byte random salt
    * @param {Types.ObjectId} obj.workspaceId
    */
-  static async createSecretBlindIndexData({
-    workspaceId,
-  }: {
-    workspaceId: Types.ObjectId;
-  }) {
+  static async createSecretBlindIndexData({ workspaceId }: { workspaceId: Types.ObjectId }) {
     return await createSecretBlindIndexDataHelper({
-      workspaceId,
+      workspaceId
     });
   }
 
@@ -42,13 +44,9 @@ class SecretService {
    * @param {Types.ObjectId} obj.workspaceId - id of workspace to get salt for
    * @returns
    */
-  static async getSecretBlindIndexSalt({
-    workspaceId,
-  }: {
-    workspaceId: Types.ObjectId;
-  }) {
+  static async getSecretBlindIndexSalt({ workspaceId }: { workspaceId: Types.ObjectId }) {
     return await getSecretBlindIndexSaltHelper({
-      workspaceId,
+      workspaceId
     });
   }
 
@@ -61,14 +59,14 @@ class SecretService {
    */
   static async generateSecretBlindIndexWithSalt({
     secretName,
-    salt,
+    salt
   }: {
     secretName: string;
     salt: string;
   }) {
     return await generateSecretBlindIndexWithSaltHelper({
       secretName,
-      salt,
+      salt
     });
   }
 
@@ -81,14 +79,14 @@ class SecretService {
    */
   static async generateSecretBlindIndex({
     secretName,
-    workspaceId,
+    workspaceId
   }: {
     secretName: string;
     workspaceId: Types.ObjectId;
   }) {
     return await generateSecretBlindIndexHelper({
       secretName,
-      workspaceId,
+      workspaceId
     });
   }
 
@@ -163,6 +161,18 @@ class SecretService {
   static async deleteSecret(deleteSecretParams: DeleteSecretParams) {
     return await deleteSecretHelper(deleteSecretParams);
   }
+
+  static async createSecretBatch(createSecretParams: CreateSecretBatchParams) {
+    return await createSecretBatchHelper(createSecretParams);
+  }
+
+  static async updateSecretBatch(updateSecretParams: UpdateSecretBatchParams) {
+    return await updateSecretBatchHelper(updateSecretParams);
+  }
+
+  static async deleteSecretBatch(deleteSecretParams: DeleteSecretBatchParams) {
+    return await deleteSecretBatchHelper(deleteSecretParams);
+  }
 }
 
 export default SecretService;

backend/src/validation/folders.ts

@@ -5,28 +5,30 @@ export const CreateFolderV1 = z.object({
     workspaceId: z.string().trim(),
     environment: z.string().trim(),
     folderName: z.string().trim(),
-    parentFolderId: z.string().trim().optional()
+    directory: z.string().trim().default("/")
   })
 });
 
 export const UpdateFolderV1 = z.object({
   params: z.object({
-    folderId: z.string().trim()
+    folderName: z.string().trim()
   }),
   body: z.object({
     workspaceId: z.string().trim(),
     environment: z.string().trim(),
-    name: z.string().trim()
+    name: z.string().trim(),
+    directory: z.string().trim().default("/")
   })
 });
 
 export const DeleteFolderV1 = z.object({
   params: z.object({
-    folderId: z.string().trim()
+    folderName: z.string().trim()
   }),
   body: z.object({
     workspaceId: z.string().trim(),
-    environment: z.string().trim()
+    environment: z.string().trim(),
+    directory: z.string().trim().default("/")
   })
 });
 
@@ -34,7 +36,6 @@ export const GetFoldersV1 = z.object({
   query: z.object({
     workspaceId: z.string().trim(),
     environment: z.string().trim(),
-    parentFolderId: z.string().trim().optional(),
-    parentFolderPath: z.string().trim().optional()
+    directory: z.string().trim().default("/")
   })
 });

backend/src/validation/index.ts

@@ -1,3 +1,4 @@
+export * from "./secretApproval";
 export * from "./user";
 export * from "./workspace";
 export * from "./bot";

backend/src/validation/secretApproval.ts

@@ -0,0 +1,34 @@
+import { z } from "zod";
+
+export const GetSecretApprovalRuleList = z.object({
+  query: z.object({
+    workspaceId: z.string()
+  })
+});
+
+export const CreateSecretApprovalRule = z.object({
+  body: z.object({
+    workspaceId: z.string(),
+    environment: z.string(),
+    secretPath: z.string().optional().nullable(),
+    approvers: z.string().array().optional(),
+    approvals: z.number().min(1).default(1)
+  })
+});
+
+export const UpdateSecretApprovalRule = z.object({
+  params: z.object({
+    id: z.string()
+  }),
+  body: z.object({
+    approvers: z.string().array().optional(),
+    approvals: z.number().min(1).optional(),
+    secretPath: z.string().optional().nullable()
+  })
+});
+
+export const DeleteSecretApprovalRule = z.object({
+  params: z.object({
+    id: z.string()
+  })
+});

backend/src/validation/secretImports.ts

@@ -4,7 +4,7 @@ export const CreateSecretImportV1 = z.object({
   body: z.object({
     workspaceId: z.string().trim(),
     environment: z.string().trim(),
-    folderId: z.string().trim().default("root"),
+    directory: z.string().trim().default("/"),
     secretImport: z.object({
       environment: z.string().trim(),
       secretPath: z.string().trim()
@@ -40,7 +40,7 @@ export const GetSecretImportsV1 = z.object({
   query: z.object({
     workspaceId: z.string().trim(),
     environment: z.string().trim(),
-    folderId: z.string().trim().default("root")
+    directory: z.string().trim().default("/")
   })
 });
 
@@ -48,6 +48,6 @@ export const GetAllSecretsFromImportV1 = z.object({
   query: z.object({
     workspaceId: z.string().trim(),
     environment: z.string().trim(),
-    folderId: z.string().trim().default("root")
+    directory: z.string().trim().default("/")
   })
 });

backend/src/validation/secretScanning.ts

@@ -6,7 +6,7 @@ export const CreateInstalLSessionv1 = z.object({
 
 export const LinkInstallationToOrgv1 = z.object({
   body: z.object({
-    installationId: z.number(),
+    installationId: z.string(),
     sessionId: z.string().trim()
   })
 });

backend/src/validation/secrets.ts

@@ -257,8 +257,11 @@ export const CreateSecretRawV3 = z.object({
     workspaceId: z.string().trim(),
     environment: z.string().trim(),
     secretPath: z.string().trim().default("/"),
-    secretValue: z.string().trim(),
+    secretValue: z
+      .string()
+      .transform((val) => (val.at(-1) === "\n" ? `${val.trim()}\n` : val.trim())),
     secretComment: z.string().trim(),
+    skipMultilineEncoding: z.boolean().optional(),
     type: z.enum([SECRET_SHARED, SECRET_PERSONAL])
   }),
   params: z.object({
@@ -273,8 +276,11 @@ export const UpdateSecretByNameRawV3 = z.object({
   body: z.object({
     workspaceId: z.string().trim(),
     environment: z.string().trim(),
-    secretValue: z.string().trim(),
+    secretValue: z
+      .string()
+      .transform((val) => (val.at(-1) === "\n" ? `${val.trim()}\n` : val.trim())),
     secretPath: z.string().trim().default("/"),
+    skipMultilineEncoding: z.boolean().optional(),
     type: z.enum([SECRET_SHARED, SECRET_PERSONAL]).default(SECRET_SHARED)
   })
 });
@@ -335,7 +341,8 @@ export const CreateSecretV3 = z.object({
     secretCommentCiphertext: z.string().trim().optional(),
     secretCommentIV: z.string().trim().optional(),
     secretCommentTag: z.string().trim().optional(),
-    metadata: z.record(z.string()).optional()
+    metadata: z.record(z.string()).optional(),
+    skipMultilineEncoding: z.boolean().optional()
   }),
   params: z.object({
     secretName: z.string().trim()
@@ -350,7 +357,17 @@ export const UpdateSecretByNameV3 = z.object({
     secretPath: z.string().trim().default("/"),
     secretValueCiphertext: z.string().trim(),
     secretValueIV: z.string().trim(),
-    secretValueTag: z.string().trim()
+    secretValueTag: z.string().trim(),
+    secretCommentCiphertext: z.string().trim().optional(),
+    secretCommentIV: z.string().trim().optional(),
+    secretCommentTag: z.string().trim().optional(),
+    tags: z.string().array().optional(),
+    skipMultilineEncoding: z.boolean().optional(),
+    // to update secret name
+    secretName: z.string().trim().optional(),
+    secretKeyIV: z.string().trim().optional(),
+    secretKeyTag: z.string().trim().optional(),
+    secretKeyCiphertext: z.string().trim().optional()
   }),
   params: z.object({
     secretName: z.string()
@@ -368,3 +385,67 @@ export const DeleteSecretByNameV3 = z.object({
     secretName: z.string()
   })
 });
+
+export const CreateSecretByNameBatchV3 = z.object({
+  body: z.object({
+    workspaceId: z.string().trim(),
+    environment: z.string().trim(),
+    secretPath: z.string().trim().default("/"),
+    secrets: z
+      .object({
+        secretName: z.string().trim(),
+        type: z.enum([SECRET_SHARED, SECRET_PERSONAL]),
+        secretKeyCiphertext: z.string().trim(),
+        secretKeyIV: z.string().trim(),
+        secretKeyTag: z.string().trim(),
+        secretValueCiphertext: z.string().trim(),
+        secretValueIV: z.string().trim(),
+        secretValueTag: z.string().trim(),
+        secretCommentCiphertext: z.string().trim().optional(),
+        secretCommentIV: z.string().trim().optional(),
+        secretCommentTag: z.string().trim().optional(),
+        metadata: z.record(z.string()).optional(),
+        skipMultilineEncoding: z.boolean().optional()
+      })
+      .array()
+      .min(1)
+  })
+});
+
+export const UpdateSecretByNameBatchV3 = z.object({
+  body: z.object({
+    workspaceId: z.string().trim(),
+    environment: z.string().trim(),
+    secretPath: z.string().trim().default("/"),
+    secrets: z
+      .object({
+        secretName: z.string().trim(),
+        type: z.enum([SECRET_SHARED, SECRET_PERSONAL]),
+        secretValueCiphertext: z.string().trim(),
+        secretValueIV: z.string().trim(),
+        secretValueTag: z.string().trim(),
+        secretCommentCiphertext: z.string().trim().optional(),
+        secretCommentIV: z.string().trim().optional(),
+        secretCommentTag: z.string().trim().optional(),
+        skipMultilineEncoding: z.boolean().optional(),
+        tags: z.string().array().optional()
+      })
+      .array()
+      .min(1)
+  })
+});
+
+export const DeleteSecretByNameBatchV3 = z.object({
+  body: z.object({
+    workspaceId: z.string().trim(),
+    environment: z.string().trim(),
+    secretPath: z.string().trim().default("/"),
+    secrets: z
+      .object({
+        secretName: z.string().trim(),
+        type: z.enum([SECRET_SHARED, SECRET_PERSONAL])
+      })
+      .array()
+      .min(1)
+  })
+});

backend/src/validation/workspace.ts

@@ -33,9 +33,10 @@ export const validateClientForWorkspace = async ({
 }) => {
   const workspace = await Workspace.findById(workspaceId);
 
-  if (!workspace) throw WorkspaceNotFoundError({
-    message: "Failed to find workspace"
-  });
+  if (!workspace)
+    throw WorkspaceNotFoundError({
+      message: "Failed to find workspace"
+    });
 
   let membership;
   switch (authData.actor.type) {
@@ -67,7 +68,7 @@ export const GetWorkspaceSecretSnapshotsV1 = z.object({
   }),
   query: z.object({
     environment: z.string().trim(),
-    folderId: z.string().trim().default("root"),
+    directory: z.string().trim().default("/"),
     offset: z.coerce.number(),
     limit: z.coerce.number()
   })
@@ -79,7 +80,7 @@ export const GetWorkspaceSecretSnapshotsCountV1 = z.object({
   }),
   query: z.object({
     environment: z.string().trim(),
-    folderId: z.string().trim().default("root")
+    directory: z.string().trim().default("/")
   })
 });
 
@@ -89,7 +90,7 @@ export const RollbackWorkspaceSecretSnapshotV1 = z.object({
   }),
   body: z.object({
     environment: z.string().trim(),
-    folderId: z.string().trim().default("root"),
+    directory: z.string().trim().default("/"),
     version: z.number()
   })
 });

backend/src/variables/secret.ts

@@ -1,3 +1,3 @@
 // secrets
 export const SECRET_SHARED = "shared";
-export const SECRET_PERSONAL = "personal";
+export const SECRET_PERSONAL = "personal";

cli/packages/cmd/tokens.go

@@ -41,7 +41,11 @@ var tokensCreateCmd = &cobra.Command{
 	},
 	Run: func(cmd *cobra.Command, args []string) {
 		// get plain text workspace key
-		loggedInUserDetails, _ := util.GetCurrentLoggedInUserDetails()
+		loggedInUserDetails, err := util.GetCurrentLoggedInUserDetails()
+
+		if err != nil {
+			util.HandleError(err, "Unable to retrieve your logged in your details. Please login in then try again")
+		}
 
 		if loggedInUserDetails.LoginExpired {
 			util.PrintErrorMessageAndExit("Your login session has expired, please run [infisical login] and try again")
@@ -70,6 +74,11 @@ var tokensCreateCmd = &cobra.Command{
 			util.HandleError(err, "Unable to parse flag")
 		}
 
+		expireSeconds, err := cmd.Flags().GetInt("expiry-seconds")
+		if err != nil {
+			util.HandleError(err, "Unable to parse flag")
+		}
+
 		scopes, err := cmd.Flags().GetStringSlice("scope")
 		if err != nil {
 			util.HandleError(err, "Unable to parse flag")
@@ -109,22 +118,21 @@ var tokensCreateCmd = &cobra.Command{
 
 		workspaceKey, err := util.GetPlainTextWorkspaceKey(loggedInUserDetails.UserCredentials.JTWToken, loggedInUserDetails.UserCredentials.PrivateKey, workspaceId)
 		if err != nil {
-			fmt.Println(err)
+			util.HandleError(err, "Unable to get workspace key needed to create service token")
 		}
 
 		newWorkspaceEncryptionKey := make([]byte, 16)
 		_, err = rand.Read(newWorkspaceEncryptionKey)
 		if err != nil {
-			fmt.Println("Error generating random bytes:", err)
-			return
+			util.HandleError(err)
 		}
 
 		newWorkspaceEncryptionKeyHexFormat := hex.EncodeToString(newWorkspaceEncryptionKey)
 
 		// encrypt the workspace key symmetrically
-		encryptedDetails, err := crypto.EncryptSymmetric(workspaceKey, newWorkspaceEncryptionKey)
+		encryptedDetails, err := crypto.EncryptSymmetric(workspaceKey, []byte(newWorkspaceEncryptionKeyHexFormat))
 		if err != nil {
-			fmt.Println(err)
+			util.HandleError(err)
 		}
 
 		// make a call to the api to save the encrypted symmetric key details
@@ -136,8 +144,8 @@ var tokensCreateCmd = &cobra.Command{
 			Name:         serviceTokenName,
 			WorkspaceId:  workspaceId,
 			Scopes:       permissions,
-			ExpiresIn:    0,
-			EncryptedKey: string(workspaceKey),
+			ExpiresIn:    expireSeconds,
+			EncryptedKey: base64.StdEncoding.EncodeToString(encryptedDetails.CipherText),
 			Iv:           base64.StdEncoding.EncodeToString(encryptedDetails.Nonce),
 			Tag:          base64.StdEncoding.EncodeToString(encryptedDetails.AuthTag),
 			RandomBytes:  newWorkspaceEncryptionKeyHexFormat,
@@ -145,7 +153,7 @@ var tokensCreateCmd = &cobra.Command{
 		})
 
 		if err != nil {
-			fmt.Println(err)
+			util.HandleError(err, "Unable to create service token")
 		}
 
 		serviceToken := createServiceTokenResponse.ServiceToken + "." + newWorkspaceEncryptionKeyHexFormat
@@ -174,6 +182,7 @@ func init() {
 	tokensCreateCmd.Flags().StringP("name", "n", "Service token generated via CLI", "Service token name")
 	tokensCreateCmd.Flags().StringSliceP("access-level", "a", []string{}, "The type of access the service token should have. Can be 'read' and or 'write'")
 	tokensCreateCmd.Flags().Bool("token-only", false, "When true, only the service token will be printed")
+	tokensCreateCmd.Flags().IntP("expiry-seconds", "e", 86400, "Set the service token's expiration time in seconds from now. To never expire set to zero. Default: 1 day ")
 
 	tokensCmd.AddCommand(tokensCreateCmd)
 

docs/cli/commands/service-token.mdx

@@ -9,7 +9,7 @@ infisical service-token create --scope=dev:/global --scope=dev:/backend --access
 
 ## Description
 The Infisical `service-token` command allows you to manage service tokens for a given Infisical project. 
-With this command can create, view and delete service tokens.
+With this command, you can create, view, and delete service tokens.
 
 <Accordion title="service-token create" defaultOpen="true">
   Use this command to create a service token
@@ -53,6 +53,15 @@ With this command can create, view and delete service tokens.
 
     Default: `Service token generated via CLI`
   </Accordion>
+  <Accordion title="--expiry-seconds">
+    ```bash
+    infisical service-token create --scope=dev:/global --access-level=read --expiry-seconds 120
+    ```
+
+    Set the service token's expiration time in seconds from now. To never expire set to zero.
+
+    Default: `1 day`
+  </Accordion>
   <Accordion title="--access-level">
     ```bash
     infisical service-token create --scope=dev:/global --access-level=read --access-level=write
@@ -69,5 +78,4 @@ With this command can create, view and delete service tokens.
 
     Default: `false`
   </Accordion>
-
-</Accordion>
+</Accordion>

frontend/package-lock.json

@@ -51,6 +51,7 @@
         "cookies": "^0.8.0",
         "cva": "npm:class-variance-authority@^0.4.0",
         "date-fns": "^2.30.0",
+        "file-saver": "^2.0.5",
         "framer-motion": "^6.2.3",
         "fs": "^0.0.2",
         "gray-matter": "^4.0.3",
@@ -92,7 +93,8 @@
         "uuidv4": "^6.2.13",
         "yaml": "^2.2.2",
         "yup": "^0.32.11",
-        "zod": "^3.22.0"
+        "zod": "^3.22.0",
+        "zustand": "^4.4.1"
       },
       "devDependencies": {
         "@storybook/addon-essentials": "^7.0.23",
@@ -105,6 +107,7 @@
         "@storybook/react": "^7.0.23",
         "@storybook/testing-library": "^0.2.0",
         "@tailwindcss/typography": "^0.5.4",
+        "@types/file-saver": "^2.0.5",
         "@types/jsrp": "^0.2.4",
         "@types/node": "^18.11.9",
         "@types/picomatch": "^2.3.0",
@@ -8208,6 +8211,12 @@
         "@types/send": "*"
       }
     },
+    "node_modules/@types/file-saver": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/@types/file-saver/-/file-saver-2.0.5.tgz",
+      "integrity": "sha512-zv9kNf3keYegP5oThGLaPk8E081DFDuwfqjtiTzm6PoxChdJ1raSuADf2YGCVIyrSynLrgc8JWv296s7Q7pQSQ==",
+      "dev": true
+    },
     "node_modules/@types/find-cache-dir": {
       "version": "3.2.1",
       "resolved": "https://registry.npmjs.org/@types/find-cache-dir/-/find-cache-dir-3.2.1.tgz",
@@ -13444,6 +13453,11 @@
         "node": "^10.12.0 || >=12.0.0"
       }
     },
+    "node_modules/file-saver": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.5.tgz",
+      "integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA=="
+    },
     "node_modules/file-system-cache": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/file-system-cache/-/file-system-cache-2.3.0.tgz",
@@ -23640,6 +23654,33 @@
       "funding": {
         "url": "https://github.com/sponsors/colinhacks"
       }
+    },
+    "node_modules/zustand": {
+      "version": "4.4.1",
+      "resolved": "https://registry.npmjs.org/zustand/-/zustand-4.4.1.tgz",
+      "integrity": "sha512-QCPfstAS4EBiTQzlaGP1gmorkh/UL1Leaj2tdj+zZCZ/9bm0WS7sI2wnfD5lpOszFqWJ1DcPnGoY8RDL61uokw==",
+      "dependencies": {
+        "use-sync-external-store": "1.2.0"
+      },
+      "engines": {
+        "node": ">=12.7.0"
+      },
+      "peerDependencies": {
+        "@types/react": ">=16.8",
+        "immer": ">=9.0",
+        "react": ">=16.8"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        },
+        "immer": {
+          "optional": true
+        },
+        "react": {
+          "optional": true
+        }
+      }
     }
   },
   "dependencies": {
@@ -29227,6 +29268,12 @@
         "@types/send": "*"
       }
     },
+    "@types/file-saver": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/@types/file-saver/-/file-saver-2.0.5.tgz",
+      "integrity": "sha512-zv9kNf3keYegP5oThGLaPk8E081DFDuwfqjtiTzm6PoxChdJ1raSuADf2YGCVIyrSynLrgc8JWv296s7Q7pQSQ==",
+      "dev": true
+    },
     "@types/find-cache-dir": {
       "version": "3.2.1",
       "resolved": "https://registry.npmjs.org/@types/find-cache-dir/-/find-cache-dir-3.2.1.tgz",
@@ -33358,6 +33405,11 @@
         "flat-cache": "^3.0.4"
       }
     },
+    "file-saver": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/file-saver/-/file-saver-2.0.5.tgz",
+      "integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA=="
+    },
     "file-system-cache": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/file-system-cache/-/file-system-cache-2.3.0.tgz",
@@ -40768,6 +40820,14 @@
       "version": "3.22.0",
       "resolved": "https://registry.npmjs.org/zod/-/zod-3.22.0.tgz",
       "integrity": "sha512-y5KZY/ssf5n7hCGDGGtcJO/EBJEm5Pa+QQvFBeyMOtnFYOSflalxIFFvdaYevPhePcmcKC4aTbFkCcXN7D0O8Q=="
+    },
+    "zustand": {
+      "version": "4.4.1",
+      "resolved": "https://registry.npmjs.org/zustand/-/zustand-4.4.1.tgz",
+      "integrity": "sha512-QCPfstAS4EBiTQzlaGP1gmorkh/UL1Leaj2tdj+zZCZ/9bm0WS7sI2wnfD5lpOszFqWJ1DcPnGoY8RDL61uokw==",
+      "requires": {
+        "use-sync-external-store": "1.2.0"
+      }
     }
   }
 }

frontend/package.json

@@ -59,6 +59,7 @@
     "cookies": "^0.8.0",
     "cva": "npm:class-variance-authority@^0.4.0",
     "date-fns": "^2.30.0",
+    "file-saver": "^2.0.5",
     "framer-motion": "^6.2.3",
     "fs": "^0.0.2",
     "gray-matter": "^4.0.3",
@@ -100,7 +101,8 @@
     "uuidv4": "^6.2.13",
     "yaml": "^2.2.2",
     "yup": "^0.32.11",
-    "zod": "^3.22.0"
+    "zod": "^3.22.0",
+    "zustand": "^4.4.1"
   },
   "devDependencies": {
     "@storybook/addon-essentials": "^7.0.23",
@@ -113,6 +115,7 @@
     "@storybook/react": "^7.0.23",
     "@storybook/testing-library": "^0.2.0",
     "@tailwindcss/typography": "^0.5.4",
+    "@types/file-saver": "^2.0.5",
     "@types/jsrp": "^0.2.4",
     "@types/node": "^18.11.9",
     "@types/picomatch": "^2.3.0",

frontend/public/locales/en/translations.json

@@ -107,6 +107,11 @@
       }
     }
   },
+  "approval": {
+    "title": "Admin Panel",
+    "og-title": "Manage your secret change management",
+    "og-description": "Infisical a simple end-to-end encrypted platform that enables teams to sync and manage their .env files."
+  },
   "integrations": {
     "title": "Project Integrations",
     "description": "Manage your integrations of Infisical with third-party services.",

frontend/src/components/navigation/NavHeader.tsx

@@ -1,4 +1,3 @@
-import { useMemo } from "react";
 import Link from "next/link";
 import { useRouter } from "next/router";
 import { faAngleRight } from "@fortawesome/free-solid-svg-icons";
@@ -15,7 +14,7 @@ type Props = {
   currentEnv?: string;
   userAvailableEnvs?: any[];
   onEnvChange?: (slug: string) => void;
-  folders?: Array<{ id: string; name: string }>;
+  secretPath?: string;
   isFolderMode?: boolean;
 };
 
@@ -42,19 +41,14 @@ export default function NavHeader({
   currentEnv,
   userAvailableEnvs = [],
   onEnvChange,
-  folders = [],
-  isFolderMode
+  isFolderMode,
+  secretPath = "/"
 }: Props): JSX.Element {
   const { currentWorkspace } = useWorkspace();
   const { currentOrg } = useOrganization();
   const router = useRouter();
 
-  const isInRootFolder = isFolderMode && folders.length <= 1;
-
-  const selectedEnv = useMemo(
-    () => userAvailableEnvs?.find((uae) => uae.name === currentEnv),
-    [userAvailableEnvs, currentEnv]
-  );
+  const secretPathSegments = secretPath.split("/").filter(Boolean);
 
   return (
     <div className="flex flex-row items-center pt-6">
@@ -90,13 +84,13 @@ export default function NavHeader({
       ) : (
         <div className="text-sm text-gray-400">{pageName}</div>
       )}
-      {currentEnv && isInRootFolder && (
+      {currentEnv && secretPath === "/" && (
         <>
           <FontAwesomeIcon icon={faAngleRight} className="ml-3 mr-1.5 text-xs text-gray-400" />
           <div className="rounded-md pl-3 hover:bg-bunker-100/10">
             <Tooltip content="Select environment">
               <Select
-                value={selectedEnv?.slug}
+                value={currentEnv}
                 onValueChange={(value) => {
                   if (value && onEnvChange) onEnvChange(value);
                 }}
@@ -113,16 +107,36 @@ export default function NavHeader({
           </div>
         </>
       )}
+      {isFolderMode && Boolean(secretPathSegments.length) && (
+        <div className="flex items-center space-x-3">
+          <FontAwesomeIcon icon={faAngleRight} className="ml-3 mr-1.5 text-xs text-gray-400" />
+          <Link
+            passHref
+            legacyBehavior
+            href={{
+              pathname: "/project/[id]/secrets/v2/[env]",
+              query: { id: router.query.id, env: router.query.env }
+            }}
+          >
+            <a className="text-sm font-semibold text-primary/80 hover:text-primary">
+              {userAvailableEnvs?.find(({ slug }) => slug === currentEnv)?.name}
+            </a>
+          </Link>
+        </div>
+      )}
       {isFolderMode &&
-        folders?.map(({ id, name }, index) => {
+        secretPathSegments?.map((folderName, index) => {
           const query = { ...router.query };
-          if (name !== "root") query.folderId = id;
-          else delete query.folderId;
+          query.secretPath = secretPathSegments.slice(0, index + 1);
+
           return (
-            <div className="flex items-center space-x-3" key={`breadcrumb-folder-${id}`}>
+            <div
+              className="flex items-center space-x-3"
+              key={`breadcrumb-secret-path-${folderName}`}
+            >
               <FontAwesomeIcon icon={faAngleRight} className="ml-3 mr-1.5 text-xs text-gray-400" />
-              {index + 1 === folders?.length ? (
-                <span className="text-sm font-semibold text-bunker-300">{name}</span>
+              {index + 1 === secretPathSegments?.length ? (
+                <span className="text-sm font-semibold text-bunker-300">{folderName}</span>
               ) : (
                 <Link
                   passHref
@@ -130,7 +144,7 @@ export default function NavHeader({
                   href={{ pathname: "/project/[id]/secrets/[env]", query }}
                 >
                   <a className="text-sm font-semibold text-primary/80 hover:text-primary">
-                    {name === "root" ? selectedEnv?.name : name}
+                    folderName
                   </a>
                 </Link>
               )}

frontend/src/components/tags/CreateTagModal/CreateTagModal.tsx

@@ -0,0 +1,266 @@
+import { useEffect, useState } from "react";
+import { Controller, useForm } from "react-hook-form";
+import { faCheck } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { z } from "zod";
+
+import { useNotificationContext } from "@app/components/context/Notifications/NotificationProvider";
+import {
+  Button,
+  FormControl,
+  Input,
+  Modal,
+  ModalClose,
+  ModalContent,
+  Tooltip
+} from "@app/components/v2";
+import { useWorkspace } from "@app/context";
+import { useCreateWsTag } from "@app/hooks/api";
+
+export const secretTagsColors = [
+  {
+    id: 1,
+    hex: "#bec2c8",
+    rgba: "rgb(128,128,128, 0.8)",
+    name: "Grey"
+  },
+  {
+    id: 2,
+    hex: "#95a2b3",
+    rgba: "rgb(0,0,255, 0.8)",
+    name: "blue"
+  },
+  {
+    id: 3,
+    hex: "#5e6ad2",
+    rgba: "rgb(128,0,128, 0.8)",
+    name: "Purple"
+  },
+  {
+    id: 4,
+    hex: "#26b5ce",
+    rgba: "rgb(0,128,128, 0.8)",
+    name: "Teal"
+  },
+  {
+    id: 5,
+    hex: "#4cb782",
+    rgba: "rgb(0,128,0, 0.8)",
+    name: "Green"
+  },
+  {
+    id: 6,
+    hex: "#f2c94c",
+    rgba: "rgb(255,255,0, 0.8)",
+    name: "Yellow"
+  },
+  {
+    id: 7,
+    hex: "#f2994a",
+    rgba: "rgb(128,128,0, 0.8)",
+    name: "Orange"
+  },
+  {
+    id: 8,
+    hex: "#f7c8c1",
+    rgba: "rgb(128,0,0, 0.8)",
+    name: "Pink"
+  },
+  {
+    id: 9,
+    hex: "#eb5757",
+    rgba: "rgb(255,0,0, 0.8)",
+    name: "Red"
+  }
+];
+
+const isValidHexColor = (hexColor: string) => {
+  const hexColorPattern = /^#?([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6})$/;
+
+  return hexColorPattern.test(hexColor);
+};
+
+type Props = {
+  isOpen?: boolean;
+  onToggle: (isOpen: boolean) => void;
+};
+
+const createTagSchema = z.object({
+  name: z.string().trim(),
+  color: z.string().trim()
+});
+
+type FormData = z.infer<typeof createTagSchema>;
+type TagColor = {
+  id: number;
+  hex: string;
+  rgba: string;
+  name: string;
+};
+
+export const CreateTagModal = ({ isOpen, onToggle }: Props): JSX.Element => {
+  const {
+    control,
+    reset,
+    watch,
+    setValue,
+    formState: { isSubmitting },
+    handleSubmit
+  } = useForm<FormData>({
+    resolver: zodResolver(createTagSchema)
+  });
+  const { createNotification } = useNotificationContext();
+  const { currentWorkspace } = useWorkspace();
+  const workspaceId = currentWorkspace?._id || "";
+
+  const { mutateAsync: createWsTag } = useCreateWsTag();
+
+  const [showHexInput, setShowHexInput] = useState<boolean>(false);
+  const selectedTagColor = watch("color", secretTagsColors[0].hex);
+
+  useEffect(()=>{
+    if(!isOpen) reset(); 
+  },[isOpen])
+
+  const onFormSubmit = async ({ name, color }: FormData) => {
+    try {
+      await createWsTag({
+        workspaceID: workspaceId,
+        tagName: name,
+        tagColor: color,
+        tagSlug: name.replace(" ", "_")
+      });
+      onToggle(false);
+      reset();
+      createNotification({
+        text: "Successfully created a tag",
+        type: "success"
+      });
+    } catch (error) {
+      console.error(error);
+      createNotification({
+        text: "Failed to create a tag",
+        type: "error"
+      });
+    }
+  };
+
+  return (
+    <Modal isOpen={isOpen} onOpenChange={onToggle}>
+      <ModalContent
+        title="Create tag"
+        subTitle="Specify your tag name, and the slug will be created automatically."
+      >
+        <form onSubmit={handleSubmit(onFormSubmit)}>
+          <Controller
+            control={control}
+            name="name"
+            defaultValue=""
+            render={({ field, fieldState: { error } }) => (
+              <FormControl label="Tag Name" isError={Boolean(error)} errorText={error?.message}>
+                <Input {...field} placeholder="Type your tag name" />
+              </FormControl>
+            )}
+          />
+          <div className="mt-2">
+            <div className="mb-0.5 ml-1 block text-sm font-normal text-mineshaft-400">
+              Tag Color
+            </div>
+            <div className="flex space-x-2">
+              <div className="p-2 rounded flex items-center justify-center border border-mineshaft-500 bg-mineshaft-900 ">
+                <div
+                  className="w-6 h-6 rounded-full"
+                  style={{ background: `${selectedTagColor}` }}
+                />
+              </div>
+              <div className="flex-grow flex items-center rounded border-mineshaft-500 bg-mineshaft-900 px-1 pr-2">
+                {!showHexInput ? (
+                  <div className="inline-flex gap-3 items-center pl-3">
+                    {secretTagsColors.map(($tagColor: TagColor) => {
+                      return (
+                        <div key={`tag-color-${$tagColor.id}`}>
+                          <Tooltip content={`${$tagColor.name}`}>
+                            <div
+                              className=" flex items-center justify-center w-[26px] h-[26px] hover:ring-offset-2 hover:ring-2 bg-[#bec2c8] border-2 p-2 hover:shadow-lg border-transparent hover:border-black rounded-full"
+                              key={`tag-${$tagColor.id}`}
+                              style={{ backgroundColor: `${$tagColor.hex}` }}
+                              onClick={() => setValue("color", $tagColor.hex)}
+                              tabIndex={0}
+                              role="button"
+                              onKeyDown={() => {}}
+                            >
+                              {$tagColor.hex === selectedTagColor && (
+                                <FontAwesomeIcon icon={faCheck} style={{ color: "#00000070" }} />
+                              )}
+                            </div>
+                          </Tooltip>
+                        </div>
+                      );
+                    })}
+                  </div>
+                ) : (
+                  <div className="flex flex-grow items-center px-2 tags-hex-wrapper">
+                    <div className="flex items-center relative rounded-md ">
+                      {isValidHexColor(selectedTagColor) && (
+                        <div
+                          className="w-7 h-7 rounded-full flex items-center justify-center"
+                          style={{ background: `${selectedTagColor}` }}
+                        >
+                          <FontAwesomeIcon icon={faCheck} style={{ color: "#00000070" }} />
+                        </div>
+                      )}
+                      {!isValidHexColor(selectedTagColor) && (
+                        <div className="border-dashed border bg-blue rounded-full w-7 h-7 border-mineshaft-500" />
+                      )}
+                    </div>
+                    <div className="flex-grow">
+                      <Input
+                        variant="plain"
+                        value={selectedTagColor}
+                        onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
+                          setValue("color", e.target.value)
+                        }
+                      />
+                    </div>
+                  </div>
+                )}
+                <div className="border-mineshaft-500 border h-8 mx-4" />
+                <div className="w-7 h-7 flex items-center justify-center">
+                  <div
+                    className={`flex items-center justify-center w-7 h-7  bg-transparent cursor-pointer hover:ring-offset-1 hover:ring-2 border-mineshaft-500 border bg-mineshaft-900 rounded-sm  p-2 ${
+                      showHexInput ? "tags-conic-bg rounded-full" : ""
+                    }`}
+                    onClick={() => setShowHexInput((prev) => !prev)}
+                    style={{ border: "1px solid rgba(220, 216, 254, 0.376)" }}
+                    tabIndex={0}
+                    role="button"
+                    onKeyDown={() => {}}
+                  >
+                    {!showHexInput && <span>#</span>}
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+
+          <div className="mt-8 flex items-center">
+            <Button
+              className="mr-4"
+              type="submit"
+              isDisabled={isSubmitting}
+              isLoading={isSubmitting}
+            >
+              Create
+            </Button>
+            <ModalClose asChild>
+              <Button variant="plain" colorSchema="secondary">
+                Cancel
+              </Button>
+            </ModalClose>
+          </div>
+        </form>
+      </ModalContent>
+    </Modal>
+  );
+};

frontend/src/components/tags/CreateTagModal/index.tsx

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

frontend/src/components/v2/Checkbox/Checkbox.tsx

@@ -30,9 +30,10 @@ export const Checkbox = ({
     <div className="flex items-center font-inter text-bunker-300">
       <CheckboxPrimitive.Root
         className={twMerge(
-          "flex items-center justify-center w-4 h-4 mr-3 transition-all rounded shadow border border-mineshaft-400 hover:bg-mineshaft-500 bg-mineshaft-600",
+          "flex items-center justify-center w-4 h-4 transition-all rounded shadow border border-mineshaft-400 hover:bg-mineshaft-500 bg-mineshaft-600",
           isDisabled && "bg-bunker-400 hover:bg-bunker-400",
           isChecked && "bg-primary hover:bg-primary",
+          Boolean(children) && "mr-3",
           className
         )}
         required={isRequired}

frontend/src/components/v2/ContentLoader/ContentLoader.tsx

@@ -0,0 +1,46 @@
+// this will show a loading animation with text below
+// if you pass array it will say it one by one giving user clear instruction on what's happening
+
+import { useEffect, useState } from "react";
+import { AnimatePresence, motion } from "framer-motion";
+
+type Props = {
+  text?: string | string[];
+  frequency?: number;
+};
+
+export const ContentLoader = ({ text, frequency = 2000 }: Props) => {
+  const [pos, setPos] = useState(0);
+  const isTextArray = Array.isArray(text);
+  useEffect(() => {
+    let interval: NodeJS.Timer;
+    if (isTextArray) {
+      interval = setInterval(() => {
+        setPos((state) => (state + 1) % text.length);
+      }, frequency);
+    }
+    return () => clearInterval(interval);
+  }, []);
+
+  return (
+    <div className="container mx-auto flex relative flex-col h-1/2 w-full items-center justify-center px-8 text-mineshaft-50 dark:[color-scheme:dark] space-y-8">
+      <div>
+        <img src="/images/loading/loading.gif" height={210} width={240} alt="loading animation" />
+      </div>
+      {text && isTextArray && (
+        <AnimatePresence exitBeforeEnter>
+          <motion.div
+            className="text-primary"
+            key={`content-loader-${pos}`}
+            initial={{ opacity: 0, translateY: 20 }}
+            animate={{ opacity: 1, translateY: 0 }}
+            exit={{ opacity: 0, translateY: -20 }}
+          >
+            {text[pos]}
+          </motion.div>
+        </AnimatePresence>
+      )}
+      {text && !isTextArray && <div className="text-primary text-sm">{text}</div>}
+    </div>
+  );
+};

frontend/src/components/v2/ContentLoader/index.tsx

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

frontend/src/components/v2/Dropdown/Dropdown.tsx

@@ -6,6 +6,9 @@ import { twMerge } from "tailwind-merge";
 export type DropdownMenuProps = DropdownMenuPrimitive.DropdownMenuProps;
 export const DropdownMenu = DropdownMenuPrimitive.Root;
 
+export type DropdownSubMenuProps = DropdownMenuPrimitive.DropdownMenuSubProps;
+export const DropdownSubMenu = DropdownMenuPrimitive.Sub;
+
 // trigger
 export type DropdownMenuTriggerProps = DropdownMenuPrimitive.DropdownMenuTriggerProps;
 export const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
@@ -34,6 +37,30 @@ export const DropdownMenuContent = forwardRef<HTMLDivElement, DropdownMenuConten
 
 DropdownMenuContent.displayName = "DropdownMenuContent";
 
+// item container
+export type DropdownSubMenuContentProps = DropdownMenuPrimitive.MenuSubContentProps;
+export const DropdownSubMenuContent = forwardRef<HTMLDivElement, DropdownSubMenuContentProps>(
+  ({ children, className, ...props }, forwardedRef) => {
+    return (
+      <DropdownMenuPrimitive.Portal>
+        <DropdownMenuPrimitive.SubContent
+          sideOffset={2}
+          {...props}
+          ref={forwardedRef}
+          className={twMerge(
+            "min-w-[220px] z-30 bg-mineshaft-900 border border-mineshaft-600 will-change-auto text-bunker-300 rounded-md shadow data-[side=top]:animate-slideDownAndFade data-[side=left]:animate-slideRightAndFade data-[side=right]:animate-slideLeftAndFade data-[side=bottom]:animate-slideUpAndFade",
+            className
+          )}
+        >
+          {children}
+        </DropdownMenuPrimitive.SubContent>
+      </DropdownMenuPrimitive.Portal>
+    );
+  }
+);
+
+DropdownSubMenuContent.displayName = "DropdownMenuContent";
+
 // item label component
 export type DropdownLabelProps = DropdownMenuPrimitive.MenuLabelProps;
 export const DropdownMenuLabel = ({ className, ...props }: DropdownLabelProps) => (
@@ -76,11 +103,50 @@ export const DropdownMenuItem = <T extends ElementType = "button">({
   </DropdownMenuPrimitive.Item>
 );
 
+// trigger
+export type DropdownSubMenuTriggerProps<T extends ElementType> =
+  DropdownMenuPrimitive.DropdownMenuSubTriggerProps & {
+    icon?: ReactNode;
+    as?: T;
+    inputRef?: Ref<T>;
+    iconPos?: "left" | "right";
+  };
+
+export const DropdownSubMenuTrigger = <T extends ElementType = "button">({
+  children,
+  inputRef,
+  className,
+  icon,
+  as: Item = "button",
+  iconPos = "left",
+  ...props
+}: DropdownMenuItemProps<T> & ComponentPropsWithRef<T>) => (
+  <DropdownMenuPrimitive.SubTrigger
+    {...props}
+    className={twMerge(
+      "text-xs text-mineshaft-200 block font-inter px-4 py-2 data-[highlighted]:bg-mineshaft-700 rounded-sm outline-none cursor-pointer",
+      className
+    )}
+  >
+    <Item type="button" role="menuitem" className="flex w-full items-center" ref={inputRef}>
+      {icon && iconPos === "left" && <span className="flex items-center mr-2">{icon}</span>}
+      <span className="flex-grow text-left">{children}</span>
+      {icon && iconPos === "right" && <span className="flex items-center ml-2">{icon}</span>}
+    </Item>
+  </DropdownMenuPrimitive.SubTrigger>
+);
+
 // grouping items into 1
 export type DropdownMenuGroupProps = DropdownMenuPrimitive.DropdownMenuGroupProps;
 
 export const DropdownMenuGroup = forwardRef<HTMLDivElement, DropdownMenuGroupProps>(
-  ({ ...props }, ref) => <DropdownMenuPrimitive.Group {...props} ref={ref} />
+  ({ ...props }, ref) => (
+    <DropdownMenuPrimitive.Group
+      {...props}
+      className={twMerge("text-xs py-2 pl-3", props.className)}
+      ref={ref}
+    />
+  )
 );
 
 DropdownMenuGroup.displayName = "DropdownMenuGroup";
@@ -98,3 +164,5 @@ export const DropdownMenuSeparator = forwardRef<
 ));
 
 DropdownMenuSeparator.displayName = "DropdownMenuSeperator";
+
+DropdownMenuSeparator.displayName = "DropdownMenuSeperator";

frontend/src/components/v2/Dropdown/index.tsx

@@ -4,7 +4,10 @@ export type {
   DropdownMenuGroupProps,
   DropdownMenuItemProps,
   DropdownMenuProps,
-  DropdownMenuTriggerProps
+  DropdownMenuTriggerProps,
+  DropdownSubMenuContentProps,
+  DropdownSubMenuProps,
+  DropdownSubMenuTriggerProps
 } from "./Dropdown";
 export {
   DropdownMenu,
@@ -13,5 +16,8 @@ export {
   DropdownMenuItem,
   DropdownMenuLabel,
   DropdownMenuSeparator,
-  DropdownMenuTrigger
+  DropdownMenuTrigger,
+  DropdownSubMenu,
+  DropdownSubMenuContent,
+  DropdownSubMenuTrigger
 } from "./Dropdown";

frontend/src/components/v2/Menu/Menu.tsx

@@ -2,8 +2,8 @@
 /* eslint-disable import/no-extraneous-dependencies */
 /* eslint-disable global-require */
 import { ComponentPropsWithRef, ElementType, ReactNode, Ref, useRef } from "react";
-import { motion } from "framer-motion"
-import Lottie from "lottie-react"
+import { motion } from "framer-motion";
+import Lottie from "lottie-react";
 import { twMerge } from "tailwind-merge";
 
 export type MenuProps = {
@@ -39,13 +39,10 @@ export const MenuItem = <T extends ElementType = "button">({
   inputRef,
   ...props
 }: MenuItemProps<T> & ComponentPropsWithRef<T>): JSX.Element => {
-  const iconRef = useRef()
+  const iconRef = useRef();
 
-  return( 
-    <a 
-      onMouseEnter={() => iconRef.current?.play()}
-      onMouseLeave={() => iconRef.current?.stop()} 
-    >
+  return (
+    <a onMouseEnter={() => iconRef.current?.play()} onMouseLeave={() => iconRef.current?.stop()}>
       <li
         className={twMerge(
           "group px-1 py-2 mt-0.5 font-inter flex flex-col text-sm text-bunker-100 transition-all rounded cursor-pointer hover:bg-mineshaft-700 duration-50",
@@ -55,25 +52,37 @@ export const MenuItem = <T extends ElementType = "button">({
         )}
       >
         <motion.span className="w-full flex flex-row items-center justify-start rounded-sm">
-          <Item type="button" role="menuitem" className="flex items-center relative" ref={inputRef} {...props}>
-            <div className={`${isSelected ? "visisble" : "invisible"} -left-[0.28rem] absolute w-[0.07rem] rounded-md h-5 bg-primary`}/>
-            {/* {icon && <span className="mr-3 ml-4 w-5 block group-hover:hidden">{icon}</span>} */}
-            <Lottie
-              lottieRef={iconRef}
-              style={{ width: 22, height: 22 }}
-              // eslint-disable-next-line import/no-dynamic-require
-              animationData={require(`../../../../public/lotties/${icon}.json`)}
-              loop={false}
-              autoplay={false}
-              className="my-auto ml-[0.1rem] mr-3"
+          <Item
+            type="button"
+            role="menuitem"
+            className="flex items-center relative"
+            ref={inputRef}
+            {...props}
+          >
+            <div
+              className={`${
+                isSelected ? "visisble" : "invisible"
+              } -left-[0.28rem] absolute w-[0.07rem] rounded-md h-5 bg-primary`}
             />
+            {/* {icon && <span className="mr-3 ml-4 w-5 block group-hover:hidden">{icon}</span>} */}
+            {icon && (
+              <Lottie
+                lottieRef={iconRef}
+                style={{ width: 22, height: 22 }}
+                // eslint-disable-next-line import/no-dynamic-require
+                animationData={require(`../../../../public/lotties/${icon}.json`)}
+                loop={false}
+                autoplay={false}
+                className="my-auto ml-[0.1rem] mr-3"
+              />
+            )}
             <span className="flex-grow text-left">{children}</span>
           </Item>
           {description && <span className="mt-2 text-xs">{description}</span>}
         </motion.span>
       </li>
     </a>
-  )
+  );
 };
 
 export const SubMenuItem = <T extends ElementType = "button">({
@@ -88,13 +97,10 @@ export const SubMenuItem = <T extends ElementType = "button">({
   inputRef,
   ...props
 }: MenuItemProps<T> & ComponentPropsWithRef<T>): JSX.Element => {
-  const iconRef = useRef()
+  const iconRef = useRef();
 
-  return( 
-    <a 
-      onMouseEnter={() => iconRef.current?.play()}
-      onMouseLeave={() => iconRef.current?.stop()} 
-    >
+  return (
+    <a onMouseEnter={() => iconRef.current?.play()} onMouseLeave={() => iconRef.current?.stop()}>
       <li
         className={twMerge(
           "group px-1 py-1 mt-0.5 font-inter flex flex-col text-sm text-mineshaft-300 hover:text-mineshaft-100 transition-all rounded cursor-pointer hover:bg-mineshaft-700 duration-50",
@@ -103,7 +109,13 @@ export const SubMenuItem = <T extends ElementType = "button">({
         )}
       >
         <motion.span className="w-full flex flex-row items-center justify-start rounded-sm pl-6">
-          <Item type="button" role="menuitem" className="flex items-center relative" ref={inputRef} {...props}>
+          <Item
+            type="button"
+            role="menuitem"
+            className="flex items-center relative"
+            ref={inputRef}
+            {...props}
+          >
             <Lottie
               lottieRef={iconRef}
               style={{ width: 16, height: 16 }}
@@ -119,10 +131,9 @@ export const SubMenuItem = <T extends ElementType = "button">({
         </motion.span>
       </li>
     </a>
-  )
+  );
 };
 
-
 MenuItem.displayName = "MenuItem";
 
 export type MenuGroupProps = {

frontend/src/components/v2/Modal/Modal.tsx

@@ -22,14 +22,14 @@ export const ModalContent = forwardRef<HTMLDivElement, ModalContentProps>(
   ) => (
     <DialogPrimitive.Portal>
       <DialogPrimitive.Overlay
-        className={twMerge("fixed inset-0 z-[70] h-full w-full animate-fadeIn", overlayClassName)}
+        className={twMerge("fixed inset-0 z-30 h-full w-full animate-fadeIn", overlayClassName)}
         style={{ backgroundColor: "rgba(0, 0, 0, 0.7)" }}
       />
       <DialogPrimitive.Content {...props} ref={forwardedRef}>
         <Card
           isRounded
           className={twMerge(
-            "fixed top-1/2 left-1/2 z-[90] dark:[color-scheme:dark] max-h-screen overflow-y-auto thin-scrollbar max-w-lg -translate-y-2/4 -translate-x-2/4 animate-popIn border border-mineshaft-600 drop-shadow-2xl",
+            "fixed top-1/2 left-1/2 z-30 dark:[color-scheme:dark] max-h-screen thin-scrollbar max-w-lg -translate-y-2/4 -translate-x-2/4 animate-popIn border border-mineshaft-600 drop-shadow-2xl",
             className
           )}
         >

frontend/src/components/v2/SecretInput/SecretInput.tsx

@@ -1,6 +1,7 @@
 /* eslint-disable react/no-danger */
-import { forwardRef, HTMLAttributes } from "react";
+import { forwardRef, TextareaHTMLAttributes } from "react";
 import sanitizeHtml, { DisallowedTagsModes } from "sanitize-html";
+import { twMerge } from "tailwind-merge";
 
 import { useToggle } from "@app/hooks";
 
@@ -39,20 +40,28 @@ const syntaxHighlight = (content?: string | null, isVisible?: boolean) => {
   return `${newContent}<br/>`;
 };
 
-type Props = HTMLAttributes<HTMLTextAreaElement> & {
+type Props = TextareaHTMLAttributes<HTMLTextAreaElement> & {
   value?: string | null;
   isVisible?: boolean;
+  isReadOnly?: boolean;
   isDisabled?: boolean;
+  containerClassName?: string;
 };
 
 const commonClassName = "font-mono text-sm caret-white border-none outline-none w-full break-all";
 
 export const SecretInput = forwardRef<HTMLTextAreaElement, Props>(
-  ({ value, isVisible, onBlur, isDisabled, onFocus, ...props }, ref) => {
+  (
+    { value, isVisible, containerClassName, onBlur, isDisabled, isReadOnly, onFocus, ...props },
+    ref
+  ) => {
     const [isSecretFocused, setIsSecretFocused] = useToggle();
 
     return (
-      <div className="overflow-auto w-full" style={{ maxHeight: `${21 * 7}px` }}>
+      <div
+        className={twMerge("overflow-auto w-full no-scrollbar rounded-md", containerClassName)}
+        style={{ maxHeight: `${21 * 7}px` }}
+      >
         <div className="relative overflow-hidden">
           <pre aria-hidden className="m-0 ">
             <code className={`inline-block w-full  ${commonClassName}`}>
@@ -78,6 +87,7 @@ export const SecretInput = forwardRef<HTMLTextAreaElement, Props>(
             }}
             value={value || ""}
             {...props}
+            readOnly={isReadOnly}
           />
         </div>
       </div>

frontend/src/components/v2/Spinner/Spinner.tsx

@@ -20,7 +20,7 @@ export const Spinner = ({ className, size = "md" }: Props): JSX.Element => {
       <svg
         aria-hidden="true"
         className={twMerge(
-          " text-gray-200 animate-spin dark:text-gray-600 fill-primary m-1",
+          "text-gray-200 animate-spin dark:text-gray-600 fill-primary m-1",
           sizeChart[size],
           className
         )}

frontend/src/components/v2/Tag/Tag.tsx

@@ -1,14 +1,17 @@
 import { ReactNode } from "react";
+import { faClose } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { cva, VariantProps } from "cva";
 import { twMerge } from "tailwind-merge";
 
 type Props = {
   children: ReactNode;
   className?: string;
+  onClose?: () => void;
 } & VariantProps<typeof tagVariants>;
 
 const tagVariants = cva(
-  "inline-flex items-center whitespace-nowrap text-sm rounded-sm mr-1.5 text-bunker-200 rounded-[30px] text-gray-400 ",
+  "inline-flex items-center whitespace-nowrap text-sm rounded mr-1.5 text-bunker-200 text-gray-400 ",
   {
     variants: {
       colorSchema: {
@@ -23,14 +26,13 @@ const tagVariants = cva(
   }
 );
 
-export const Tag = ({
-  children,
-  className,
-  colorSchema = "gray",
-  size = "sm" }: Props) => (
-  <div
-    className={twMerge(tagVariants({ colorSchema, className, size }))}
-  >
+export const Tag = ({ children, className, colorSchema = "gray", size = "sm", onClose }: Props) => (
+  <div className={twMerge(tagVariants({ colorSchema, className, size }))}>
     {children}
+    {onClose && (
+      <button type="button" onClick={onClose} className="ml-2 flex items-center justify-center">
+        <FontAwesomeIcon icon={faClose} />
+      </button>
+    )}
   </div>
 );

frontend/src/components/v2/index.tsx

@@ -2,6 +2,7 @@ export * from "./Accordion";
 export * from "./Button";
 export * from "./Card";
 export * from "./Checkbox";
+export * from "./ContentLoader";
 export * from "./DatePicker";
 export * from "./DeleteActionModal";
 export * from "./Drawer";

frontend/src/helpers/project.ts

@@ -3,77 +3,75 @@ import crypto from "crypto";
 import { encryptAssymmetric } from "@app/components/utilities/cryptography/crypto";
 import encryptSecrets from "@app/components/utilities/secrets/encryptSecrets";
 import { uploadWsKey } from "@app/hooks/api/keys/queries";
-import { createSecret } from "@app/hooks/api/secrets/queries";
+import { createSecret } from "@app/hooks/api/secrets/mutations";
 import { fetchUserDetails } from "@app/hooks/api/users/queries";
 import { createWorkspace } from "@app/hooks/api/workspace/queries";
 
 const secretsToBeAdded = [
-    {
-      pos: 0,
-      key: "DATABASE_URL",
-      // eslint-disable-next-line no-template-curly-in-string
-      value: "mongodb+srv://${DB_USERNAME}:${DB_PASSWORD}@mongodb.net",
-      valueOverride: undefined,
-      comment: "Secret referencing example",
-      id: "",
-      tags: []
-    },
-    {
-      pos: 1,
-      key: "DB_USERNAME",
-      value: "OVERRIDE_THIS",
-      valueOverride: undefined,
-      comment:
-        "Override secrets with personal value",
-      id: "",
-      tags: []
-    },
-    {
-      pos: 2,
-      key: "DB_PASSWORD",
-      value: "OVERRIDE_THIS",
-      valueOverride: undefined,
-      comment:
-        "Another secret override",
-      id: "",
-      tags: []
-    },
-    {
-      pos: 3,
-      key: "DB_USERNAME",
-      value: "user1234",
-      valueOverride: "user1234",
-      comment: "",
-      id: "",
-      tags: []
-    },
-    {
-      pos: 4,
-      key: "DB_PASSWORD",
-      value: "example_password",
-      valueOverride: "example_password",
-      comment: "",
-      id: "",
-      tags: []
-    },
-    {
-      pos: 5,
-      key: "TWILIO_AUTH_TOKEN",
-      value: "example_twillio_token",
-      valueOverride: undefined,
-      comment: "",
-      id: "",
-      tags: []
-    },
-    {
-      pos: 6,
-      key: "WEBSITE_URL",
-      value: "http://localhost:3000",
-      valueOverride: undefined,
-      comment: "",
-      id: "",
-      tags: []
-    }
+  {
+    pos: 0,
+    key: "DATABASE_URL",
+    // eslint-disable-next-line no-template-curly-in-string
+    value: "mongodb+srv://${DB_USERNAME}:${DB_PASSWORD}@mongodb.net",
+    valueOverride: undefined,
+    comment: "Secret referencing example",
+    id: "",
+    tags: []
+  },
+  {
+    pos: 1,
+    key: "DB_USERNAME",
+    value: "OVERRIDE_THIS",
+    valueOverride: undefined,
+    comment: "Override secrets with personal value",
+    id: "",
+    tags: []
+  },
+  {
+    pos: 2,
+    key: "DB_PASSWORD",
+    value: "OVERRIDE_THIS",
+    valueOverride: undefined,
+    comment: "Another secret override",
+    id: "",
+    tags: []
+  },
+  {
+    pos: 3,
+    key: "DB_USERNAME",
+    value: "user1234",
+    valueOverride: "user1234",
+    comment: "",
+    id: "",
+    tags: []
+  },
+  {
+    pos: 4,
+    key: "DB_PASSWORD",
+    value: "example_password",
+    valueOverride: "example_password",
+    comment: "",
+    id: "",
+    tags: []
+  },
+  {
+    pos: 5,
+    key: "TWILIO_AUTH_TOKEN",
+    value: "example_twillio_token",
+    valueOverride: undefined,
+    comment: "",
+    id: "",
+    tags: []
+  },
+  {
+    pos: 6,
+    key: "WEBSITE_URL",
+    value: "http://localhost:3000",
+    valueOverride: undefined,
+    comment: "",
+    id: "",
+    tags: []
+  }
 ];
 
 /**
@@ -85,30 +83,32 @@ const secretsToBeAdded = [
  * @returns {Project} project - new project
  */
 const initProjectHelper = async ({
-    organizationId,
-    projectName
+  organizationId,
+  projectName
 }: {
-    organizationId: string;
-    projectName: string;
+  organizationId: string;
+  projectName: string;
 }) => {
   // create new project
-  const { data: { workspace } } = await createWorkspace({
-      workspaceName: projectName,
-      organizationId
+  const {
+    data: { workspace }
+  } = await createWorkspace({
+    workspaceName: projectName,
+    organizationId
   });
-  
+
   // create and upload new (encrypted) project key
   const randomBytes = crypto.randomBytes(16).toString("hex");
   const PRIVATE_KEY = localStorage.getItem("PRIVATE_KEY");
-  
+
   if (!PRIVATE_KEY) throw new Error("Failed to find private key");
 
   const user = await fetchUserDetails();
 
   const { ciphertext, nonce } = encryptAssymmetric({
-      plaintext: randomBytes,
-      publicKey: user.publicKey,
-      privateKey: PRIVATE_KEY
+    plaintext: randomBytes,
+    publicKey: user.publicKey,
+    privateKey: PRIVATE_KEY
   });
 
   await uploadWsKey({
@@ -120,11 +120,11 @@ const initProjectHelper = async ({
 
   // encrypt and upload secrets to new project
   const secrets = await encryptSecrets({
-      secretsToEncrypt: secretsToBeAdded,
-      workspaceId: workspace._id,
-      env: "dev"
+    secretsToEncrypt: secretsToBeAdded,
+    workspaceId: workspace._id,
+    env: "dev"
   });
-  
+
   secrets?.forEach((secret) => {
     createSecret({
       workspaceId: workspace._id,
@@ -146,10 +146,8 @@ const initProjectHelper = async ({
       }
     });
   });
-  
-  return workspace;
-}
 
-export {
-    initProjectHelper
-}
+  return workspace;
+};
+
+export { initProjectHelper };

frontend/src/hooks/api/index.tsx

@@ -7,6 +7,7 @@ export * from "./integrations";
 export * from "./keys";
 export * from "./organization";
 export * from "./roles";
+export * from "./secretApproval";
 export * from "./secretFolders";
 export * from "./secretImports";
 export * from "./secrets";

frontend/src/hooks/api/secretApproval/index.tsx

@@ -0,0 +1,6 @@
+export {
+  useCreateSecretApprovalPolicy,
+  useDeleteSecretApprovalPolicy,
+  useUpdateSecretApprovalPolicy
+} from "./mutation";
+export { useGetSecretApprovalPolicies } from "./queries";

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

@@ -0,0 +1,58 @@
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+
+import { apiRequest } from "@app/config/request";
+
+import { secretApprovalKeys } from "./queries";
+import { TCreateSecretPolicyDTO, TDeleteSecretPolicyDTO, TUpdateSecretPolicyDTO } from "./types";
+
+export const useCreateSecretApprovalPolicy = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation<{}, {}, TCreateSecretPolicyDTO>({
+    mutationFn: async ({ environment, workspaceId, approvals, approvers, secretPath }) => {
+      const { data } = await apiRequest.post("/api/v1/secret-approvals", {
+        environment,
+        workspaceId,
+        approvals,
+        approvers,
+        secretPath
+      });
+      return data;
+    },
+    onSuccess: (_, { workspaceId }) => {
+      queryClient.invalidateQueries(secretApprovalKeys.getApprovalPolicies(workspaceId));
+    }
+  });
+};
+
+export const useUpdateSecretApprovalPolicy = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation<{}, {}, TUpdateSecretPolicyDTO>({
+    mutationFn: async ({ id, approvers, approvals, secretPath }) => {
+      const { data } = await apiRequest.patch(`/api/v1/secret-approvals/${id}`, {
+        approvals,
+        approvers,
+        secretPath
+      });
+      return data;
+    },
+    onSuccess: (_, { workspaceId }) => {
+      queryClient.invalidateQueries(secretApprovalKeys.getApprovalPolicies(workspaceId));
+    }
+  });
+};
+
+export const useDeleteSecretApprovalPolicy = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation<{}, {}, TDeleteSecretPolicyDTO>({
+    mutationFn: async ({ id }) => {
+      const { data } = await apiRequest.delete(`/api/v1/secret-approvals/${id}`);
+      return data;
+    },
+    onSuccess: (_, { workspaceId }) => {
+      queryClient.invalidateQueries(secretApprovalKeys.getApprovalPolicies(workspaceId));
+    }
+  });
+};

frontend/src/hooks/api/secretApproval/queries.tsx

@@ -0,0 +1,36 @@
+import { useQuery, UseQueryOptions } from "@tanstack/react-query";
+
+import { apiRequest } from "@app/config/request";
+
+import { TSecretApprovalPolicy } from "./types";
+
+export const secretApprovalKeys = {
+  getApprovalPolicies: (workspaceId: string) =>
+    [{ workspaceId }, "secret-approval-policies"] as const
+};
+
+const fetchApprovalPolicies = async (workspaceId: string) => {
+  const { data } = await apiRequest.get<{ approvals: TSecretApprovalPolicy[] }>(
+    "/api/v1/secret-approvals",
+    { params: { workspaceId } }
+  );
+  return data.approvals;
+};
+
+export const useGetSecretApprovalPolicies = ({
+  workspaceId,
+  options = {}
+}: { workspaceId: string } & {
+  options?: UseQueryOptions<
+    TSecretApprovalPolicy[],
+    unknown,
+    TSecretApprovalPolicy[],
+    ReturnType<typeof secretApprovalKeys.getApprovalPolicies>
+  >;
+}) =>
+  useQuery({
+    queryKey: secretApprovalKeys.getApprovalPolicies(workspaceId),
+    queryFn: () => fetchApprovalPolicies(workspaceId),
+    ...options,
+    enabled: Boolean(workspaceId) && (options?.enabled ?? true)
+  });

frontend/src/hooks/api/secretApproval/types.ts

@@ -0,0 +1,31 @@
+export type TSecretApprovalPolicy = {
+  _id: string;
+  workspace: string;
+  environment: string;
+  secretPath?: string;
+  approvers: string[];
+  approvals: number;
+};
+
+export type TCreateSecretPolicyDTO = {
+  workspaceId: string;
+  environment: string;
+  secretPath?: string | null;
+  approvers?: string[];
+  approvals?: number;
+};
+
+export type TUpdateSecretPolicyDTO = {
+  id: string;
+  approvers?: string[];
+  secretPath?: string | null;
+  approvals?: number;
+  // for invalidating list
+  workspaceId: string;
+};
+
+export type TDeleteSecretPolicyDTO = {
+  id: string;
+  // for invalidating list
+  workspaceId: string;
+};

frontend/src/hooks/api/secretFolders/index.tsx

@@ -3,6 +3,5 @@ export {
   useDeleteFolder,
   useGetFoldersByEnv,
   useGetProjectFolders,
-  useGetProjectFoldersBatch,
   useUpdateFolder
 } from "./queries";

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

@@ -1,86 +1,80 @@
 import { useCallback, useMemo } from "react";
-import { useMutation, useQueries, useQuery, useQueryClient } from "@tanstack/react-query";
+import {
+  useMutation,
+  useQueries,
+  useQuery,
+  useQueryClient,
+  UseQueryOptions
+} from "@tanstack/react-query";
 
 import { apiRequest } from "@app/config/request";
 
 import { secretSnapshotKeys } from "../secretSnapshots/queries";
 import {
-  CreateFolderDTO,
-  DeleteFolderDTO,
-  GetProjectFoldersBatchDTO,
-  GetProjectFoldersDTO,
+  TCreateFolderDTO,
+  TDeleteFolderDTO,
   TGetFoldersByEnvDTO,
+  TGetProjectFoldersDTO,
   TSecretFolder,
-  UpdateFolderDTO
+  TUpdateFolderDTO
 } from "./types";
 
 const queryKeys = {
-  getSecretFolders: (workspaceId: string, environment: string, parentFolderId?: string) =>
-    ["secret-folders", { workspaceId, environment, parentFolderId }] as const
+  getSecretFolders: ({ workspaceId, environment, directory }: TGetProjectFoldersDTO) =>
+    ["secret-folders", { workspaceId, environment, directory }] as const
 };
 
-const fetchProjectFolders = async (
-  workspaceId: string,
-  environment: string,
-  parentFolderId?: string,
-  parentFolderPath?: string
-) => {
-  const { data } = await apiRequest.get<{ folders: TSecretFolder[]; dir: TSecretFolder[] }>(
-    "/api/v1/folders",
-    {
-      params: {
-        workspaceId,
-        environment,
-        parentFolderId,
-        parentFolderPath
-      }
+const fetchProjectFolders = async (workspaceId: string, environment: string, directory = "/") => {
+  const { data } = await apiRequest.get<{ folders: TSecretFolder[] }>("/api/v1/folders", {
+    params: {
+      workspaceId,
+      environment,
+      directory
     }
-  );
-  return data;
+  });
+  return data.folders;
 };
 
 export const useGetProjectFolders = ({
   workspaceId,
-  parentFolderId,
   environment,
-  isPaused,
-  sortDir
-}: GetProjectFoldersDTO) =>
+  directory = "/",
+  options = {}
+}: TGetProjectFoldersDTO & {
+  options?: Omit<
+    UseQueryOptions<
+      TSecretFolder[],
+      unknown,
+      TSecretFolder[],
+      ReturnType<typeof queryKeys.getSecretFolders>
+    >,
+    "queryKey" | "queryFn"
+  >;
+}) =>
   useQuery({
-    queryKey: queryKeys.getSecretFolders(workspaceId, environment, parentFolderId),
-    enabled: Boolean(workspaceId) && Boolean(environment) && !isPaused,
-    queryFn: async () => fetchProjectFolders(workspaceId, environment, parentFolderId),
-    select: useCallback(
-      ({ folders, dir }: { folders: TSecretFolder[]; dir: TSecretFolder[] }) => ({
-        dir,
-        folders: folders.sort((a, b) =>
-          sortDir === "asc"
-            ? a?.name?.localeCompare(b?.name || "")
-            : b?.name?.localeCompare(a?.name || "")
-        )
-      }),
-      [sortDir]
-    )
+    ...options,
+    queryKey: queryKeys.getSecretFolders({ workspaceId, environment, directory }),
+    enabled: Boolean(workspaceId) && Boolean(environment) && (options?.enabled ?? true),
+    queryFn: async () => fetchProjectFolders(workspaceId, environment, directory)
   });
 
 export const useGetFoldersByEnv = ({
-  parentFolderPath,
+  directory = "/",
   workspaceId,
-  environments,
-  parentFolderId
+  environments
 }: TGetFoldersByEnvDTO) => {
   const folders = useQueries({
-    queries: environments.map((env) => ({
-      queryKey: queryKeys.getSecretFolders(workspaceId, env, parentFolderPath || parentFolderId),
-      queryFn: async () => fetchProjectFolders(workspaceId, env, parentFolderId, parentFolderPath),
-      enabled: Boolean(workspaceId) && Boolean(env)
+    queries: environments.map((environment) => ({
+      queryKey: queryKeys.getSecretFolders({ workspaceId, environment, directory }),
+      queryFn: async () => fetchProjectFolders(workspaceId, environment, directory),
+      enabled: Boolean(workspaceId) && Boolean(environment)
     }))
   });
 
   const folderNames = useMemo(() => {
     const names = new Set<string>();
     folders?.forEach(({ data }) => {
-      data?.folders.forEach(({ name }) => {
+      data?.forEach(({ name }) => {
         names.add(name);
       });
     });
@@ -92,9 +86,7 @@ export const useGetFoldersByEnv = ({
       const selectedEnvIndex = environments.indexOf(env);
       if (selectedEnvIndex !== -1) {
         return Boolean(
-          folders?.[selectedEnvIndex]?.data?.folders?.find(
-            ({ name: folderName }) => folderName === name
-          )
+          folders?.[selectedEnvIndex]?.data?.find(({ name: folderName }) => folderName === name)
         );
       }
       return false;
@@ -105,95 +97,78 @@ export const useGetFoldersByEnv = ({
   return { folders, folderNames, isFolderPresentInEnv };
 };
 
-export const useGetProjectFoldersBatch = ({
-  folders = [],
-  isPaused,
-  parentFolderPath
-}: GetProjectFoldersBatchDTO) =>
-  useQueries({
-    queries: folders.map(({ workspaceId, environment, parentFolderId }) => ({
-      queryKey: queryKeys.getSecretFolders(workspaceId, environment, parentFolderPath),
-      queryFn: async () =>
-        fetchProjectFolders(workspaceId, environment, parentFolderId, parentFolderPath),
-      enabled: Boolean(workspaceId) && Boolean(environment) && !isPaused,
-      select: (data: { folders: TSecretFolder[]; dir: TSecretFolder[] }) => ({
-        environment,
-        folders: data.folders,
-        dir: data.dir
-      })
-    }))
-  });
-
 export const useCreateFolder = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, CreateFolderDTO>({
+  return useMutation<{}, {}, TCreateFolderDTO>({
     mutationFn: async (dto) => {
       const { data } = await apiRequest.post("/api/v1/folders", dto);
       return data;
     },
-    onSuccess: (_, { workspaceId, environment, parentFolderId }) => {
+    onSuccess: (_, { workspaceId, environment, directory }) => {
       queryClient.invalidateQueries(
-        queryKeys.getSecretFolders(workspaceId, environment, parentFolderId)
+        queryKeys.getSecretFolders({ workspaceId, environment, directory })
       );
       queryClient.invalidateQueries(
-        secretSnapshotKeys.count(workspaceId, environment, parentFolderId)
+        secretSnapshotKeys.list({ workspaceId, environment, directory })
       );
       queryClient.invalidateQueries(
-        secretSnapshotKeys.list(workspaceId, environment, parentFolderId)
+        secretSnapshotKeys.count({ workspaceId, environment, directory })
       );
     }
   });
 };
 
-export const useUpdateFolder = (parentFolderId: string) => {
+export const useUpdateFolder = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, UpdateFolderDTO>({
-    mutationFn: async ({ folderId, name, environment, workspaceId }) => {
-      const { data } = await apiRequest.patch(`/api/v1/folders/${folderId}`, {
+  return useMutation<{}, {}, TUpdateFolderDTO>({
+    mutationFn: async ({ directory = "/", folderName, name, environment, workspaceId }) => {
+      const { data } = await apiRequest.patch(`/api/v1/folders/${folderName}`, {
         name,
         environment,
-        workspaceId
+        workspaceId,
+        directory
       });
       return data;
     },
-    onSuccess: (_, { workspaceId, environment }) => {
+    onSuccess: (_, { workspaceId, environment, directory }) => {
       queryClient.invalidateQueries(
-        queryKeys.getSecretFolders(workspaceId, environment, parentFolderId)
+        queryKeys.getSecretFolders({ workspaceId, environment, directory })
       );
       queryClient.invalidateQueries(
-        secretSnapshotKeys.count(workspaceId, environment, parentFolderId)
+        secretSnapshotKeys.list({ workspaceId, environment, directory })
       );
       queryClient.invalidateQueries(
-        secretSnapshotKeys.list(workspaceId, environment, parentFolderId)
+        secretSnapshotKeys.count({ workspaceId, environment, directory })
       );
     }
   });
 };
 
-export const useDeleteFolder = (parentFolderId: string) => {
+export const useDeleteFolder = () => {
   const queryClient = useQueryClient();
 
-  return useMutation<{}, {}, DeleteFolderDTO>({
-    mutationFn: async ({ folderId, environment, workspaceId }) => {
-      const { data } = await apiRequest.delete(`/api/v1/folders/${folderId}`, {
+  return useMutation<{}, {}, TDeleteFolderDTO>({
+    mutationFn: async ({ directory = "/", folderName, environment, workspaceId }) => {
+      const { data } = await apiRequest.delete(`/api/v1/folders/${folderName}`, {
         data: {
           environment,
-          workspaceId
+          workspaceId,
+          directory
         }
       });
       return data;
     },
-    onSuccess: (_, { workspaceId, environment }) => {
+    onSuccess: (_, { directory = "/", workspaceId, environment }) => {
       queryClient.invalidateQueries(
-        queryKeys.getSecretFolders(workspaceId, environment, parentFolderId)
+        queryKeys.getSecretFolders({ workspaceId, environment, directory })
       );
       queryClient.invalidateQueries(
-        secretSnapshotKeys.count(workspaceId, environment, parentFolderId)
+        secretSnapshotKeys.list({ workspaceId, environment, directory })
       );
       queryClient.invalidateQueries(
-        secretSnapshotKeys.list(workspaceId, environment, parentFolderId)
+        secretSnapshotKeys.count({ workspaceId, environment, directory })
       );
     }
   });

frontend/src/hooks/api/secretFolders/types.ts

@@ -3,43 +3,36 @@ export type TSecretFolder = {
   name: string;
 };
 
-export type GetProjectFoldersDTO = {
+export type TGetProjectFoldersDTO = {
   workspaceId: string;
   environment: string;
-  parentFolderId?: string;
-  isPaused?: boolean;
-  sortDir?: "asc" | "desc";
-};
-
-export type GetProjectFoldersBatchDTO = {
-  folders: Omit<GetProjectFoldersDTO, "isPaused" | "sortDir">[];
-  isPaused?: boolean;
-  parentFolderPath?: string;
+  directory?: string;
 };
 
 export type TGetFoldersByEnvDTO = {
   environments: string[];
   workspaceId: string;
-  parentFolderPath?: string;
-  parentFolderId?: string;
+  directory?: string;
 };
 
-export type CreateFolderDTO = {
+export type TCreateFolderDTO = {
   workspaceId: string;
   environment: string;
   folderName: string;
-  parentFolderId?: string;
+  directory?: string;
 };
 
-export type UpdateFolderDTO = {
+export type TUpdateFolderDTO = {
   workspaceId: string;
   environment: string;
   name: string;
-  folderId: string;
+  folderName: string;
+  directory?: string;
 };
 
-export type DeleteFolderDTO = {
+export type TDeleteFolderDTO = {
   workspaceId: string;
   environment: string;
-  folderId: string;
+  folderName: string;
+  directory?: string;
 };

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

@@ -9,21 +9,21 @@ export const useCreateSecretImport = () => {
   const queryClient = useQueryClient();
 
   return useMutation<{}, {}, TCreateSecretImportDTO>({
-    mutationFn: async ({ secretImport, environment, workspaceId, folderId }) => {
+    mutationFn: async ({ secretImport, environment, workspaceId, directory }) => {
       const { data } = await apiRequest.post("/api/v1/secret-imports", {
         secretImport,
         environment,
         workspaceId,
-        folderId
+        directory
       });
       return data;
     },
-    onSuccess: (_, { workspaceId, environment, folderId }) => {
+    onSuccess: (_, { workspaceId, environment, directory }) => {
       queryClient.invalidateQueries(
-        secretImportKeys.getProjectSecretImports(workspaceId, environment, folderId)
+        secretImportKeys.getProjectSecretImports({ workspaceId, environment, directory })
       );
       queryClient.invalidateQueries(
-        secretImportKeys.getSecretImportSecrets(workspaceId, environment, folderId)
+        secretImportKeys.getSecretImportSecrets({ workspaceId, environment, directory })
       );
     }
   });
@@ -33,21 +33,21 @@ export const useUpdateSecretImport = () => {
   const queryClient = useQueryClient();
 
   return useMutation<{}, {}, TUpdateSecretImportDTO>({
-    mutationFn: async ({ environment, workspaceId, folderId, secretImports, id }) => {
+    mutationFn: async ({ environment, workspaceId, directory, secretImports, id }) => {
       const { data } = await apiRequest.put(`/api/v1/secret-imports/${id}`, {
         secretImports,
         environment,
         workspaceId,
-        folderId
+        directory
       });
       return data;
     },
-    onSuccess: (_, { workspaceId, environment, folderId }) => {
+    onSuccess: (_, { workspaceId, environment, directory }) => {
       queryClient.invalidateQueries(
-        secretImportKeys.getProjectSecretImports(workspaceId, environment, folderId)
+        secretImportKeys.getProjectSecretImports({ workspaceId, environment, directory })
       );
       queryClient.invalidateQueries(
-        secretImportKeys.getSecretImportSecrets(workspaceId, environment, folderId)
+        secretImportKeys.getSecretImportSecrets({ workspaceId, environment, directory })
       );
     }
   });
@@ -66,12 +66,12 @@ export const useDeleteSecretImport = () => {
       });
       return data;
     },
-    onSuccess: (_, { workspaceId, environment, folderId }) => {
+    onSuccess: (_, { workspaceId, environment, directory }) => {
       queryClient.invalidateQueries(
-        secretImportKeys.getProjectSecretImports(workspaceId, environment, folderId)
+        secretImportKeys.getProjectSecretImports({ workspaceId, environment, directory })
       );
       queryClient.invalidateQueries(
-        secretImportKeys.getSecretImportSecrets(workspaceId, environment, folderId)
+        secretImportKeys.getSecretImportSecrets({ workspaceId, environment, directory })
       );
     }
   });

frontend/src/hooks/api/secretImports/queries.tsx

@@ -1,5 +1,5 @@
 import { useCallback } from "react";
-import { useQuery } from "@tanstack/react-query";
+import { useQuery, UseQueryOptions } from "@tanstack/react-query";
 
 import {
   decryptAssymmetric,
@@ -7,52 +7,68 @@ import {
 } from "@app/components/utilities/cryptography/crypto";
 import { apiRequest } from "@app/config/request";
 
-import { TGetImportedSecrets, TImportedSecrets, TSecretImports } from "./types";
+import { TGetImportedSecrets, TGetSecretImports, TImportedSecrets, TSecretImports } from "./types";
 
 export const secretImportKeys = {
-  getProjectSecretImports: (workspaceId: string, env: string | string[], folderId?: string) => [
-    { workspaceId, env, folderId },
-    "secrets-imports"
-  ],
-  getSecretImportSecrets: (workspaceId: string, env: string | string[], folderId?: string) => [
-    { workspaceId, env, folderId },
-    "secrets-import-sec"
-  ]
+  getProjectSecretImports: ({ environment, workspaceId, directory }: TGetSecretImports) =>
+    [{ workspaceId, directory, environment }, "secrets-imports"] as const,
+  getSecretImportSecrets: ({
+    workspaceId,
+    environment,
+    directory
+  }: Omit<TGetImportedSecrets, "decryptFileKey">) =>
+    [{ workspaceId, environment, directory }, "secrets-import-sec"] as const
 };
 
-const fetchSecretImport = async (workspaceId: string, environment: string, folderId?: string) => {
+const fetchSecretImport = async ({ workspaceId, environment, directory }: TGetSecretImports) => {
   const { data } = await apiRequest.get<{ secretImport: TSecretImports }>(
     "/api/v1/secret-imports",
     {
       params: {
         workspaceId,
         environment,
-        folderId
+        directory
       }
     }
   );
   return data.secretImport;
 };
 
-export const useGetSecretImports = (workspaceId: string, env: string, folderId?: string) =>
+export const useGetSecretImports = ({
+  workspaceId,
+  environment,
+  directory = "/",
+  options = {}
+}: TGetSecretImports & {
+  options?: Omit<
+    UseQueryOptions<
+      TSecretImports,
+      unknown,
+      TSecretImports,
+      ReturnType<typeof secretImportKeys.getProjectSecretImports>
+    >,
+    "queryKey" | "queryFn"
+  >;
+}) =>
   useQuery({
-    enabled: Boolean(workspaceId) && Boolean(env),
-    queryKey: secretImportKeys.getProjectSecretImports(workspaceId, env, folderId),
-    queryFn: () => fetchSecretImport(workspaceId, env, folderId)
+    ...options,
+    queryKey: secretImportKeys.getProjectSecretImports({ workspaceId, environment, directory }),
+    enabled: Boolean(workspaceId) && Boolean(environment) && (options?.enabled ?? true),
+    queryFn: () => fetchSecretImport({ workspaceId, environment, directory })
   });
 
 const fetchImportedSecrets = async (
   workspaceId: string,
   environment: string,
-  folderId?: string
+  directory?: string
 ) => {
-  const { data } = await apiRequest.get<{ secrets: TImportedSecrets }>(
+  const { data } = await apiRequest.get<{ secrets: TImportedSecrets[] }>(
     "/api/v1/secret-imports/secrets",
     {
       params: {
         workspaceId,
         environment,
-        folderId
+        directory
       }
     }
   );
@@ -62,15 +78,34 @@ const fetchImportedSecrets = async (
 export const useGetImportedSecrets = ({
   workspaceId,
   environment,
-  folderId,
-  decryptFileKey
-}: TGetImportedSecrets) =>
+  decryptFileKey,
+  directory,
+  options = {}
+}: TGetImportedSecrets & {
+  options?: Omit<
+    UseQueryOptions<
+      TImportedSecrets[],
+      unknown,
+      TImportedSecrets[],
+      ReturnType<typeof secretImportKeys.getSecretImportSecrets>
+    >,
+    "queryKey" | "queryFn"
+  >;
+}) =>
   useQuery({
-    enabled: Boolean(workspaceId) && Boolean(environment) && Boolean(decryptFileKey),
-    queryKey: secretImportKeys.getSecretImportSecrets(workspaceId, environment, folderId),
-    queryFn: () => fetchImportedSecrets(workspaceId, environment, folderId),
+    enabled:
+      Boolean(workspaceId) &&
+      Boolean(environment) &&
+      Boolean(decryptFileKey) &&
+      (options?.enabled ?? true),
+    queryKey: secretImportKeys.getSecretImportSecrets({
+      workspaceId,
+      environment,
+      directory
+    }),
+    queryFn: () => fetchImportedSecrets(workspaceId, environment, directory),
     select: useCallback(
-      (data: TImportedSecrets) => {
+      (data: TImportedSecrets[]) => {
         const PRIVATE_KEY = localStorage.getItem("PRIVATE_KEY") as string;
         const latestKey = decryptFileKey;
         const key = decryptAssymmetric({
@@ -114,7 +149,8 @@ export const useGetImportedSecrets = ({
               tags: encSecret.tags,
               comment: secretComment,
               createdAt: encSecret.createdAt,
-              updatedAt: encSecret.updatedAt
+              updatedAt: encSecret.updatedAt,
+              version: encSecret.version
             };
           })
         }));

frontend/src/hooks/api/secretImports/types.ts

@@ -1,5 +1,5 @@
+import { UserWsKeyPair } from "../keys/types";
 import { EncryptedSecret } from "../secrets/types";
-import { UserWsKeyPair } from "../types";
 
 export type TSecretImports = {
   _id: string;
@@ -16,19 +16,25 @@ export type TImportedSecrets = {
   secretPath: string;
   folderId: string;
   secrets: EncryptedSecret[];
-}[];
+};
+
+export type TGetSecretImports = {
+  workspaceId: string;
+  environment: string;
+  directory?: string;
+};
 
 export type TGetImportedSecrets = {
   workspaceId: string;
   environment: string;
-  folderId?: string;
+  directory?: string;
   decryptFileKey: UserWsKeyPair;
 };
 
 export type TCreateSecretImportDTO = {
   workspaceId: string;
   environment: string;
-  folderId?: string;
+  directory?: string;
   secretImport: {
     environment: string;
     secretPath: string;
@@ -39,7 +45,7 @@ export type TUpdateSecretImportDTO = {
   id: string;
   workspaceId: string;
   environment: string;
-  folderId?: string;
+  directory?: string;
   secretImports: Array<{
     environment: string;
     secretPath: string;
@@ -50,7 +56,7 @@ export type TDeleteSecretImportDTO = {
   id: string;
   workspaceId: string;
   environment: string;
-  folderId?: string;
+  directory?: string;
   secretImportPath: string;
   secretImportEnv: string;
 };

frontend/src/hooks/api/secretSnapshots/index.tsx

@@ -1,6 +1,6 @@
 export {
   useGetSnapshotSecrets,
-  useGetWorkspaceSecretSnapshots,
+  useGetWorkspaceSnapshotList,
   useGetWsSnapshotCount,
   usePerformSecretRollback
 } from "./queries";

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

@@ -9,39 +9,39 @@ import { apiRequest } from "@app/config/request";
 
 import { DecryptedSecret } from "../secrets/types";
 import {
-  GetWorkspaceSecretSnapshotsDTO,
+  TGetSecretSnapshotsDTO,
   TSecretRollbackDTO,
-  TSnapshotSecret,
-  TSnapshotSecretProps,
-  TWorkspaceSecretSnapshot
+  TSecretSnapshot,
+  TSnapshotData,
+  TSnapshotDataProps
 } from "./types";
 
 export const secretSnapshotKeys = {
-  list: (workspaceId: string, env: string, folderId?: string) =>
-    [{ workspaceId, env, folderId }, "secret-snapshot"] as const,
-  snapshotSecrets: (snapshotId: string) => [{ snapshotId }, "secret-snapshot"] as const,
-  count: (workspaceId: string, env: string, folderId?: string) => [
-    { workspaceId, env, folderId },
+  list: ({ workspaceId, environment, directory }: Omit<TGetSecretSnapshotsDTO, "limit">) =>
+    [{ workspaceId, environment, directory }, "secret-snapshot"] as const,
+  snapshotData: (snapshotId: string) => [{ snapshotId }, "secret-snapshot"] as const,
+  count: ({ environment, workspaceId, directory }: Omit<TGetSecretSnapshotsDTO, "limit">) => [
+    { workspaceId, environment, directory },
     "count",
     "secret-snapshot"
   ]
 };
 
-const fetchWorkspaceSecretSnaphots = async (
-  workspaceId: string,
-  environment: string,
-  folderId?: string,
+const fetchWorkspaceSnaphots = async ({
+  workspaceId,
+  environment,
+  directory = "/",
   limit = 10,
   offset = 0
-) => {
-  const res = await apiRequest.get<{ secretSnapshots: TWorkspaceSecretSnapshot[] }>(
+}: TGetSecretSnapshotsDTO & { offset: number }) => {
+  const res = await apiRequest.get<{ secretSnapshots: TSecretSnapshot[] }>(
     `/api/v1/workspace/${workspaceId}/secret-snapshots`,
     {
       params: {
         limit,
         offset,
         environment,
-        folderId
+        directory
       }
     }
   );
@@ -49,32 +49,25 @@ const fetchWorkspaceSecretSnaphots = async (
   return res.data.secretSnapshots;
 };
 
-export const useGetWorkspaceSecretSnapshots = (dto: GetWorkspaceSecretSnapshotsDTO) =>
+export const useGetWorkspaceSnapshotList = (dto: TGetSecretSnapshotsDTO & { isPaused?: boolean }) =>
   useInfiniteQuery({
-    enabled: Boolean(dto.workspaceId && dto.environment),
-    queryKey: secretSnapshotKeys.list(dto.workspaceId, dto.environment, dto?.folder),
-    queryFn: ({ pageParam }) =>
-      fetchWorkspaceSecretSnaphots(
-        dto.workspaceId,
-        dto.environment,
-        dto?.folder,
-        dto.limit,
-        pageParam
-      ),
+    enabled: Boolean(dto.workspaceId && dto.environment) && !dto.isPaused,
+    queryKey: secretSnapshotKeys.list({ ...dto }),
+    queryFn: ({ pageParam }) => fetchWorkspaceSnaphots({ ...dto, offset: pageParam }),
     getNextPageParam: (lastPage, pages) =>
       lastPage.length !== 0 ? pages.length * dto.limit : undefined
   });
 
 const fetchSnapshotEncSecrets = async (snapshotId: string) => {
-  const res = await apiRequest.get<{ secretSnapshot: TSnapshotSecret }>(
+  const res = await apiRequest.get<{ secretSnapshot: TSnapshotData }>(
     `/api/v1/secret-snapshot/${snapshotId}`
   );
   return res.data.secretSnapshot;
 };
 
-export const useGetSnapshotSecrets = ({ decryptFileKey, env, snapshotId }: TSnapshotSecretProps) =>
+export const useGetSnapshotSecrets = ({ decryptFileKey, env, snapshotId }: TSnapshotDataProps) =>
   useQuery({
-    queryKey: secretSnapshotKeys.snapshotSecrets(snapshotId),
+    queryKey: secretSnapshotKeys.snapshotData(snapshotId),
     enabled: Boolean(snapshotId && decryptFileKey),
     queryFn: () => fetchSnapshotEncSecrets(snapshotId),
     select: (data) => {
@@ -117,7 +110,8 @@ export const useGetSnapshotSecrets = ({ decryptFileKey, env, snapshotId }: TSnap
             comment: secretComment,
             createdAt: encSecret.createdAt,
             updatedAt: encSecret.updatedAt,
-            type: "modified"
+            type: "modified",
+            version: encSecret.version
           };
 
           if (encSecret.type === "personal") {
@@ -147,25 +141,30 @@ export const useGetSnapshotSecrets = ({ decryptFileKey, env, snapshotId }: TSnap
 const fetchWorkspaceSecretSnaphotCount = async (
   workspaceId: string,
   environment: string,
-  folderId?: string
+  directory = "/"
 ) => {
   const res = await apiRequest.get<{ count: number }>(
     `/api/v1/workspace/${workspaceId}/secret-snapshots/count`,
     {
       params: {
         environment,
-        folderId
+        directory
       }
     }
   );
   return res.data.count;
 };
 
-export const useGetWsSnapshotCount = (workspaceId: string, env: string, folderId?: string) =>
+export const useGetWsSnapshotCount = ({
+  workspaceId,
+  environment,
+  directory,
+  isPaused
+}: Omit<TGetSecretSnapshotsDTO, "limit"> & { isPaused?: boolean }) =>
   useQuery({
-    enabled: Boolean(workspaceId && env),
-    queryKey: secretSnapshotKeys.count(workspaceId, env, folderId),
-    queryFn: () => fetchWorkspaceSecretSnaphotCount(workspaceId, env, folderId)
+    enabled: Boolean(workspaceId && environment) && !isPaused,
+    queryKey: secretSnapshotKeys.count({ workspaceId, environment, directory }),
+    queryFn: () => fetchWorkspaceSecretSnaphotCount(workspaceId, environment, directory)
   });
 
 export const usePerformSecretRollback = () => {
@@ -179,10 +178,17 @@ export const usePerformSecretRollback = () => {
       );
       return data;
     },
-    onSuccess: (_, { workspaceId, environment, folderId }) => {
-      queryClient.invalidateQueries([{ workspaceId, environment }, "secrets"]);
-      queryClient.invalidateQueries(secretSnapshotKeys.list(workspaceId, environment, folderId));
-      queryClient.invalidateQueries(secretSnapshotKeys.count(workspaceId, environment, folderId));
+    onSuccess: (_, { workspaceId, environment, directory }) => {
+      queryClient.invalidateQueries([
+        { workspaceId, environment, secretPath: directory },
+        "secrets"
+      ]);
+      queryClient.invalidateQueries(
+        secretSnapshotKeys.list({ workspaceId, environment, directory })
+      );
+      queryClient.invalidateQueries(
+        secretSnapshotKeys.count({ workspaceId, environment, directory })
+      );
     }
   });
 };

frontend/src/hooks/api/secretSnapshots/types.ts

@@ -1,7 +1,7 @@
 import { UserWsKeyPair } from "../keys/types";
 import { EncryptedSecretVersion } from "../secrets/types";
 
-export type TWorkspaceSecretSnapshot = {
+export type TSecretSnapshot = {
   _id: string;
   workspace: string;
   version: number;
@@ -11,27 +11,27 @@ export type TWorkspaceSecretSnapshot = {
   __v: number;
 };
 
-export type TSnapshotSecret = Omit<TWorkspaceSecretSnapshot, "secretVersions"> & {
+export type TSnapshotData = Omit<TSecretSnapshot, "secretVersions"> & {
   secretVersions: EncryptedSecretVersion[];
   folderVersion: Array<{ name: string; id: string }>;
 };
 
-export type TSnapshotSecretProps = {
+export type TSnapshotDataProps = {
   snapshotId: string;
   env: string;
   decryptFileKey: UserWsKeyPair;
 };
 
-export type GetWorkspaceSecretSnapshotsDTO = {
+export type TGetSecretSnapshotsDTO = {
   workspaceId: string;
   limit: number;
   environment: string;
-  folder?: string;
+  directory?: string;
 };
 
 export type TSecretRollbackDTO = {
   workspaceId: string;
   version: number;
   environment: string;
-  folderId?: string;
+  directory?: string;
 };

frontend/src/hooks/api/secrets/index.ts

@@ -1,7 +1,9 @@
-export { useCreateSecretV3, useDeleteSecretV3, useUpdateSecretV3 } from "./mutations";
 export {
-  useBatchSecretsOp,
-  useGetProjectSecrets,
-  useGetProjectSecretsAllEnv,
-  useGetSecretVersion
-} from "./queries";
+  useCreateSecretBatch,
+  useCreateSecretV3,
+  useDeleteSecretBatch,
+  useDeleteSecretV3,
+  useUpdateSecretBatch,
+  useUpdateSecretV3
+} from "./mutations";
+export { useGetProjectSecrets, useGetProjectSecretsAllEnv, useGetSecretVersion } from "./queries";

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

@@ -1,6 +1,6 @@
 import crypto from "crypto";
 
-import { useMutation, useQueryClient } from "@tanstack/react-query";
+import { MutationOptions, useMutation, useQueryClient } from "@tanstack/react-query";
 
 import {
   decryptAssymmetric,
@@ -8,8 +8,17 @@ import {
 } from "@app/components/utilities/cryptography/crypto";
 import { apiRequest } from "@app/config/request";
 
+import { secretSnapshotKeys } from "../secretSnapshots/queries";
 import { secretKeys } from "./queries";
-import { TCreateSecretsV3DTO, TDeleteSecretsV3DTO, TUpdateSecretsV3DTO } from "./types";
+import {
+  CreateSecretDTO,
+  TCreateSecretBatchDTO,
+  TCreateSecretsV3DTO,
+  TDeleteSecretBatchDTO,
+  TDeleteSecretsV3DTO,
+  TUpdateSecretBatchDTO,
+  TUpdateSecretsV3DTO
+} from "./types";
 
 const encryptSecret = (randomBytes: string, key: string, value?: string, comment?: string) => {
   // encrypt key
@@ -55,7 +64,11 @@ const encryptSecret = (randomBytes: string, key: string, value?: string, comment
   };
 };
 
-export const useCreateSecretV3 = () => {
+export const useCreateSecretV3 = ({
+  options
+}: {
+  options?: Omit<MutationOptions<{}, {}, TCreateSecretsV3DTO>, "mutationFn">;
+} = {}) => {
   const queryClient = useQueryClient();
   return useMutation<{}, {}, TCreateSecretsV3DTO>({
     mutationFn: async ({
@@ -66,7 +79,8 @@ export const useCreateSecretV3 = () => {
       secretName,
       secretValue,
       latestFileKey,
-      secretComment
+      secretComment,
+      skipMultilineEncoding
     }) => {
       const PRIVATE_KEY = localStorage.getItem("PRIVATE_KEY") as string;
 
@@ -84,20 +98,32 @@ export const useCreateSecretV3 = () => {
         environment,
         type,
         secretPath,
-        ...encryptSecret(randomBytes, secretName, secretValue, secretComment)
+        ...encryptSecret(randomBytes, secretName, secretValue, secretComment),
+        skipMultilineEncoding
       };
       const { data } = await apiRequest.post(`/api/v3/secrets/${secretName}`, reqBody);
       return data;
     },
     onSuccess: (_, { workspaceId, environment, secretPath }) => {
       queryClient.invalidateQueries(
-        secretKeys.getProjectSecret(workspaceId, environment, secretPath)
+        secretKeys.getProjectSecret({ workspaceId, environment, secretPath })
       );
-    }
+      queryClient.invalidateQueries(
+        secretSnapshotKeys.list({ environment, workspaceId, directory: secretPath })
+      );
+      queryClient.invalidateQueries(
+        secretSnapshotKeys.count({ environment, workspaceId, directory: secretPath })
+      );
+    },
+    ...options
   });
 };
 
-export const useUpdateSecretV3 = () => {
+export const useUpdateSecretV3 = ({
+  options
+}: {
+  options?: Omit<MutationOptions<{}, {}, TUpdateSecretsV3DTO>, "mutationFn">;
+} = {}) => {
   const queryClient = useQueryClient();
   return useMutation<{}, {}, TUpdateSecretsV3DTO>({
     mutationFn: async ({
@@ -107,7 +133,11 @@ export const useUpdateSecretV3 = () => {
       workspaceId,
       secretName,
       secretValue,
-      latestFileKey
+      latestFileKey,
+      tags,
+      secretComment,
+      newSecretName,
+      skipMultilineEncoding
     }) => {
       const PRIVATE_KEY = localStorage.getItem("PRIVATE_KEY") as string;
 
@@ -119,34 +149,40 @@ export const useUpdateSecretV3 = () => {
             privateKey: PRIVATE_KEY
           })
         : crypto.randomBytes(16).toString("hex");
-      const { secretValueIV, secretValueTag, secretValueCiphertext } = encryptSecret(
-        randomBytes,
-        secretName,
-        secretValue,
-        ""
-      );
 
       const reqBody = {
         workspaceId,
         environment,
         type,
         secretPath,
-        secretValueIV,
-        secretValueTag,
-        secretValueCiphertext
+        ...encryptSecret(randomBytes, newSecretName ?? secretName, secretValue, secretComment),
+        tags,
+        skipMultilineEncoding,
+        secretName: newSecretName
       };
       const { data } = await apiRequest.patch(`/api/v3/secrets/${secretName}`, reqBody);
       return data;
     },
     onSuccess: (_, { workspaceId, environment, secretPath }) => {
       queryClient.invalidateQueries(
-        secretKeys.getProjectSecret(workspaceId, environment, secretPath)
+        secretKeys.getProjectSecret({ workspaceId, environment, secretPath })
       );
-    }
+      queryClient.invalidateQueries(
+        secretSnapshotKeys.list({ environment, workspaceId, directory: secretPath })
+      );
+      queryClient.invalidateQueries(
+        secretSnapshotKeys.count({ environment, workspaceId, directory: secretPath })
+      );
+    },
+    ...options
   });
 };
 
-export const useDeleteSecretV3 = () => {
+export const useDeleteSecretV3 = ({
+  options
+}: {
+  options?: Omit<MutationOptions<{}, {}, TDeleteSecretsV3DTO>, "mutationFn">;
+} = {}) => {
   const queryClient = useQueryClient();
 
   return useMutation<{}, {}, TDeleteSecretsV3DTO>({
@@ -165,8 +201,160 @@ export const useDeleteSecretV3 = () => {
     },
     onSuccess: (_, { workspaceId, environment, secretPath }) => {
       queryClient.invalidateQueries(
-        secretKeys.getProjectSecret(workspaceId, environment, secretPath)
+        secretKeys.getProjectSecret({ workspaceId, environment, secretPath })
       );
-    }
+      queryClient.invalidateQueries(
+        secretSnapshotKeys.list({ environment, workspaceId, directory: secretPath })
+      );
+      queryClient.invalidateQueries(
+        secretSnapshotKeys.count({ environment, workspaceId, directory: secretPath })
+      );
+    },
+    ...options
   });
 };
+
+export const useCreateSecretBatch = ({
+  options
+}: {
+  options?: Omit<MutationOptions<{}, {}, TCreateSecretBatchDTO>, "mutationFn">;
+} = {}) => {
+  const queryClient = useQueryClient();
+
+  return useMutation<{}, {}, TCreateSecretBatchDTO>({
+    mutationFn: async ({ secretPath = "/", workspaceId, environment, secrets, latestFileKey }) => {
+      const PRIVATE_KEY = localStorage.getItem("PRIVATE_KEY") as string;
+      const randomBytes = latestFileKey
+        ? decryptAssymmetric({
+            ciphertext: latestFileKey.encryptedKey,
+            nonce: latestFileKey.nonce,
+            publicKey: latestFileKey.sender.publicKey,
+            privateKey: PRIVATE_KEY
+          })
+        : crypto.randomBytes(16).toString("hex");
+
+      const reqBody = {
+        workspaceId,
+        environment,
+        secretPath,
+        secrets: secrets.map(
+          ({ secretName, secretValue, secretComment, metadata, type, skipMultilineEncoding }) => ({
+            secretName,
+            ...encryptSecret(randomBytes, secretName, secretValue, secretComment),
+            type,
+            metadata,
+            skipMultilineEncoding
+          })
+        )
+      };
+
+      const { data } = await apiRequest.post("/api/v3/secrets/batch", reqBody);
+      return data;
+    },
+    onSuccess: (_, { workspaceId, environment, secretPath }) => {
+      queryClient.invalidateQueries(
+        secretKeys.getProjectSecret({ workspaceId, environment, secretPath })
+      );
+      queryClient.invalidateQueries(
+        secretSnapshotKeys.list({ environment, workspaceId, directory: secretPath })
+      );
+      queryClient.invalidateQueries(
+        secretSnapshotKeys.count({ environment, workspaceId, directory: secretPath })
+      );
+    },
+    ...options
+  });
+};
+
+export const useUpdateSecretBatch = ({
+  options
+}: {
+  options?: Omit<MutationOptions<{}, {}, TUpdateSecretBatchDTO>, "mutationFn">;
+} = {}) => {
+  const queryClient = useQueryClient();
+
+  return useMutation<{}, {}, TUpdateSecretBatchDTO>({
+    mutationFn: async ({ secretPath = "/", workspaceId, environment, secrets, latestFileKey }) => {
+      const PRIVATE_KEY = localStorage.getItem("PRIVATE_KEY") as string;
+      const randomBytes = latestFileKey
+        ? decryptAssymmetric({
+            ciphertext: latestFileKey.encryptedKey,
+            nonce: latestFileKey.nonce,
+            publicKey: latestFileKey.sender.publicKey,
+            privateKey: PRIVATE_KEY
+          })
+        : crypto.randomBytes(16).toString("hex");
+
+      const reqBody = {
+        workspaceId,
+        environment,
+        secretPath,
+        secrets: secrets.map(
+          ({ secretName, secretValue, secretComment, type, tags, skipMultilineEncoding }) => ({
+            secretName,
+            ...encryptSecret(randomBytes, secretName, secretValue, secretComment),
+            type,
+            tags,
+            skipMultilineEncoding
+          })
+        )
+      };
+
+      const { data } = await apiRequest.patch("/api/v3/secrets/batch", reqBody);
+      return data;
+    },
+    onSuccess: (_, { workspaceId, environment, secretPath }) => {
+      queryClient.invalidateQueries(
+        secretKeys.getProjectSecret({ workspaceId, environment, secretPath })
+      );
+      queryClient.invalidateQueries(
+        secretSnapshotKeys.list({ environment, workspaceId, directory: secretPath })
+      );
+      queryClient.invalidateQueries(
+        secretSnapshotKeys.count({ environment, workspaceId, directory: secretPath })
+      );
+    },
+    ...options
+  });
+};
+
+export const useDeleteSecretBatch = ({
+  options
+}: {
+  options?: Omit<MutationOptions<{}, {}, TDeleteSecretBatchDTO>, "mutationFn">;
+} = {}) => {
+  const queryClient = useQueryClient();
+
+  return useMutation<{}, {}, TDeleteSecretBatchDTO>({
+    mutationFn: async ({ secretPath = "/", workspaceId, environment, secrets }) => {
+      const reqBody = {
+        workspaceId,
+        environment,
+        secretPath,
+        secrets
+      };
+
+      const { data } = await apiRequest.delete("/api/v3/secrets/batch", {
+        data: reqBody
+      });
+      return data;
+    },
+    onSuccess: (_, { workspaceId, environment, secretPath }) => {
+      queryClient.invalidateQueries(
+        secretKeys.getProjectSecret({ workspaceId, environment, secretPath })
+      );
+      queryClient.invalidateQueries(
+        secretSnapshotKeys.list({ environment, workspaceId, directory: secretPath })
+      );
+      queryClient.invalidateQueries(
+        secretSnapshotKeys.count({ environment, workspaceId, directory: secretPath })
+      );
+    },
+    ...options
+  });
+};
+
+export const createSecret = async (dto: CreateSecretDTO) => {
+  const { data } = await apiRequest.post(`/api/v3/secrets/${dto.secretKey}`, dto);
+  return data;
+};

frontend/src/hooks/api/secrets/queries.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable no-param-reassign */
 import { useCallback, useMemo } from "react";
-import { useMutation, useQueries, useQuery, useQueryClient } from "@tanstack/react-query";
+import { useQueries, useQuery, UseQueryOptions } from "@tanstack/react-query";
 
 import {
   decryptAssymmetric,
@@ -8,218 +8,148 @@ import {
 } from "@app/components/utilities/cryptography/crypto";
 import { apiRequest } from "@app/config/request";
 
-import { secretSnapshotKeys } from "../secretSnapshots/queries";
+import { UserWsKeyPair } from "../keys/types";
 import {
-  BatchSecretDTO,
-  CreateSecretDTO,
   DecryptedSecret,
   EncryptedSecret,
   EncryptedSecretVersion,
-  GetProjectSecretsDTO,
   GetSecretVersionsDTO,
-  TGetProjectSecretsAllEnvDTO} from "./types";
+  TGetProjectSecretsAllEnvDTO,
+  TGetProjectSecretsDTO,
+  TGetProjectSecretsKey
+} from "./types";
 
 export const secretKeys = {
   // this is also used in secretSnapshot part
-  getProjectSecret: (workspaceId: string, env: string | string[], folderId?: string) => [
-    { workspaceId, env, folderId },
-    "secrets"
-  ],
-  getProjectSecretImports: (workspaceId: string, env: string | string[], folderId?: string) => [
-    { workspaceId, env, folderId },
-    "secrets-imports"
-  ],
-  getSecretVersion: (secretId: string) => [{ secretId }, "secret-versions"]
+  getProjectSecret: ({ workspaceId, environment, secretPath }: TGetProjectSecretsKey) =>
+    [{ workspaceId, environment, secretPath }, "secrets"] as const,
+  getSecretVersion: (secretId: string) => [{ secretId }, "secret-versions"] as const
 };
 
-const fetchProjectEncryptedSecrets = async (
-  workspaceId: string,
-  env: string | string[],
-  folderId?: string,
-  secretPath?: string
-) => {
+const decryptSecrets = (encryptedSecrets: EncryptedSecret[], decryptFileKey: UserWsKeyPair) => {
+  const PRIVATE_KEY = localStorage.getItem("PRIVATE_KEY") as string;
+  const key = decryptAssymmetric({
+    ciphertext: decryptFileKey.encryptedKey,
+    nonce: decryptFileKey.nonce,
+    publicKey: decryptFileKey.sender.publicKey,
+    privateKey: PRIVATE_KEY
+  });
+
+  const personalSecrets: Record<string, { id: string; value: string }> = {};
+  const secrets: DecryptedSecret[] = [];
+  encryptedSecrets.forEach((encSecret) => {
+    const secretKey = decryptSymmetric({
+      ciphertext: encSecret.secretKeyCiphertext,
+      iv: encSecret.secretKeyIV,
+      tag: encSecret.secretKeyTag,
+      key
+    });
+
+    const secretValue = decryptSymmetric({
+      ciphertext: encSecret.secretValueCiphertext,
+      iv: encSecret.secretValueIV,
+      tag: encSecret.secretValueTag,
+      key
+    });
+
+    const secretComment = decryptSymmetric({
+      ciphertext: encSecret.secretCommentCiphertext,
+      iv: encSecret.secretCommentIV,
+      tag: encSecret.secretCommentTag,
+      key
+    });
+
+    const decryptedSecret: DecryptedSecret = {
+      _id: encSecret._id,
+      env: encSecret.environment,
+      key: secretKey,
+      value: secretValue,
+      tags: encSecret.tags,
+      comment: secretComment,
+      createdAt: encSecret.createdAt,
+      updatedAt: encSecret.updatedAt,
+      version: encSecret.version,
+      skipMultilineEncoding: encSecret.skipMultilineEncoding
+    };
+
+    if (encSecret.type === "personal") {
+      personalSecrets[decryptedSecret.key] = {
+        id: encSecret._id,
+        value: secretValue
+      };
+    } else {
+      secrets.push(decryptedSecret);
+    }
+  });
+
+  secrets.forEach((sec) => {
+    if (personalSecrets?.[sec.key]) {
+      sec.idOverride = personalSecrets[sec.key].id;
+      sec.valueOverride = personalSecrets[sec.key].value;
+      sec.overrideAction = "modified";
+    }
+  });
+
+  return secrets;
+};
+
+const fetchProjectEncryptedSecrets = async ({
+  workspaceId,
+  environment,
+  secretPath
+}: TGetProjectSecretsKey) => {
   const { data } = await apiRequest.get<{ secrets: EncryptedSecret[] }>("/api/v3/secrets", {
     params: {
-      environment: env,
+      environment,
       workspaceId,
-      folderId: folderId || undefined,
       secretPath
     }
   });
-  
+
   return data.secrets;
 };
-
 export const useGetProjectSecrets = ({
   workspaceId,
-  env,
+  environment,
   decryptFileKey,
-  isPaused,
-  folderId,
-  secretPath
-}: GetProjectSecretsDTO) =>
+  secretPath,
+  options
+}: TGetProjectSecretsDTO & {
+  options?: Omit<
+    UseQueryOptions<
+      EncryptedSecret[],
+      unknown,
+      DecryptedSecret[],
+      ReturnType<typeof secretKeys.getProjectSecret>
+    >,
+    "queryKey" | "queryFn"
+  >;
+}) =>
   useQuery({
+    ...options,
     // wait for all values to be available
-    enabled: Boolean(decryptFileKey && workspaceId && env) && !isPaused,
-    queryKey: secretKeys.getProjectSecret(workspaceId, env, folderId || secretPath),
-    queryFn: () => fetchProjectEncryptedSecrets(workspaceId, env, folderId, secretPath),
-    select: useCallback(
-      (data: EncryptedSecret[]) => {
-        const PRIVATE_KEY = localStorage.getItem("PRIVATE_KEY") as string;
-        const latestKey = decryptFileKey;
-        const key = decryptAssymmetric({
-          ciphertext: latestKey.encryptedKey,
-          nonce: latestKey.nonce,
-          publicKey: latestKey.sender.publicKey,
-          privateKey: PRIVATE_KEY
-        });
-
-        const sharedSecrets: DecryptedSecret[] = [];
-        const personalSecrets: Record<string, { id: string; value: string }> = {};
-        // this used for add-only mode in dashboard
-        // type won't be there thus only one key is shown
-        const duplicateSecretKey: Record<string, boolean> = {};
-        data.forEach((encSecret: EncryptedSecret) => {
-          const secretKey = decryptSymmetric({
-            ciphertext: encSecret.secretKeyCiphertext,
-            iv: encSecret.secretKeyIV,
-            tag: encSecret.secretKeyTag,
-            key
-          });
-
-          const secretValue = decryptSymmetric({
-            ciphertext: encSecret.secretValueCiphertext,
-            iv: encSecret.secretValueIV,
-            tag: encSecret.secretValueTag,
-            key
-          });
-
-          const secretComment = decryptSymmetric({
-            ciphertext: encSecret.secretCommentCiphertext,
-            iv: encSecret.secretCommentIV,
-            tag: encSecret.secretCommentTag,
-            key
-          });
-
-          const decryptedSecret = {
-            _id: encSecret._id,
-            env: encSecret.environment,
-            key: secretKey,
-            value: secretValue,
-            tags: encSecret.tags,
-            comment: secretComment,
-            createdAt: encSecret.createdAt,
-            updatedAt: encSecret.updatedAt
-          };
-
-          if (encSecret.type === "personal") {
-            personalSecrets[`${decryptedSecret.key}-${decryptedSecret.env}`] = {
-              id: encSecret._id,
-              value: secretValue
-            };
-          } else {
-            if (!duplicateSecretKey?.[`${decryptedSecret.key}-${decryptedSecret.env}`]) {
-              sharedSecrets.push(decryptedSecret);
-            }
-            duplicateSecretKey[`${decryptedSecret.key}-${decryptedSecret.env}`] = true;
-          }
-        });
-        sharedSecrets.forEach((val) => {
-          const dupKey = `${val.key}-${val.env}`;
-          if (personalSecrets?.[dupKey]) {
-            val.idOverride = personalSecrets[dupKey].id;
-            val.valueOverride = personalSecrets[dupKey].value;
-            val.overrideAction = "modified";
-          }
-        });
-        return { secrets: sharedSecrets };
-      },
-      [decryptFileKey]
-    )
+    enabled: Boolean(decryptFileKey && workspaceId && environment) && (options?.enabled ?? true),
+    queryKey: secretKeys.getProjectSecret({ workspaceId, environment, secretPath }),
+    queryFn: async () => fetchProjectEncryptedSecrets({ workspaceId, environment, secretPath }),
+    select: (secrets: EncryptedSecret[]) => decryptSecrets(secrets, decryptFileKey)
   });
 
 export const useGetProjectSecretsAllEnv = ({
   workspaceId,
   envs,
   decryptFileKey,
-  folderId,
   secretPath
 }: TGetProjectSecretsAllEnvDTO) => {
   const secrets = useQueries({
-    queries: envs.map((env) => ({
-      queryKey: secretKeys.getProjectSecret(workspaceId, env, secretPath || folderId),
-      enabled: Boolean(decryptFileKey && workspaceId && env),
-      queryFn: () => fetchProjectEncryptedSecrets(workspaceId, env, folderId, secretPath),
-      select: (data: EncryptedSecret[]) => {
-        const PRIVATE_KEY = localStorage.getItem("PRIVATE_KEY") as string;
-        const latestKey = decryptFileKey;
-        const key = decryptAssymmetric({
-          ciphertext: latestKey.encryptedKey,
-          nonce: latestKey.nonce,
-          publicKey: latestKey.sender.publicKey,
-          privateKey: PRIVATE_KEY
-        });
-
-        const sharedSecrets: Record<string, DecryptedSecret> = {};
-        const personalSecrets: Record<string, { id: string; value: string }> = {};
-        // this used for add-only mode in dashboard
-        // type won't be there thus only one key is shown
-        const duplicateSecretKey: Record<string, boolean> = {};
-        data.forEach((encSecret: EncryptedSecret) => {
-          const secretKey = decryptSymmetric({
-            ciphertext: encSecret.secretKeyCiphertext,
-            iv: encSecret.secretKeyIV,
-            tag: encSecret.secretKeyTag,
-            key
-          });
-
-          const secretValue = decryptSymmetric({
-            ciphertext: encSecret.secretValueCiphertext,
-            iv: encSecret.secretValueIV,
-            tag: encSecret.secretValueTag,
-            key
-          });
-
-          const secretComment = decryptSymmetric({
-            ciphertext: encSecret.secretCommentCiphertext,
-            iv: encSecret.secretCommentIV,
-            tag: encSecret.secretCommentTag,
-            key
-          });
-
-          const decryptedSecret = {
-            _id: encSecret._id,
-            env: encSecret.environment,
-            key: secretKey,
-            value: secretValue,
-            tags: encSecret.tags,
-            comment: secretComment,
-            createdAt: encSecret.createdAt,
-            updatedAt: encSecret.updatedAt
-          };
-
-          if (encSecret.type === "personal") {
-            personalSecrets[decryptedSecret.key] = {
-              id: encSecret._id,
-              value: secretValue
-            };
-          } else {
-            if (!duplicateSecretKey?.[decryptedSecret.key]) {
-              sharedSecrets[decryptedSecret.key] = decryptedSecret;
-            }
-            duplicateSecretKey[decryptedSecret.key] = true;
-          }
-        });
-
-        Object.keys(sharedSecrets).forEach((val) => {
-          if (personalSecrets?.[val]) {
-            sharedSecrets[val].idOverride = personalSecrets[val].id;
-            sharedSecrets[val].valueOverride = personalSecrets[val].value;
-            sharedSecrets[val].overrideAction = "modified";
-          }
-        });
-        return sharedSecrets;
-      }
+    queries: envs.map((environment) => ({
+      queryKey: secretKeys.getProjectSecret({ workspaceId, environment, secretPath }),
+      enabled: Boolean(decryptFileKey && workspaceId && environment),
+      queryFn: async () => fetchProjectEncryptedSecrets({ workspaceId, environment, secretPath }),
+      select: (secs: EncryptedSecret[]) =>
+        decryptSecrets(secs, decryptFileKey).reduce<Record<string, DecryptedSecret>>(
+          (prev, curr) => ({ ...prev, [curr.key]: curr }),
+          {}
+        )
     }))
   });
 
@@ -303,46 +233,3 @@ export const useGetSecretVersion = (dto: GetSecretVersionsDTO) =>
       [dto.decryptFileKey]
     )
   });
-
-export const useBatchSecretsOp = () => {
-  const queryClient = useQueryClient();
-
-  return useMutation<{}, {}, BatchSecretDTO>({
-    mutationFn: async (dto) => {
-      const { data } = await apiRequest.post("/api/v2/secrets/batch", dto);
-      return data;
-    },
-    onSuccess: (_, dto) => {
-      queryClient.invalidateQueries(
-        secretKeys.getProjectSecret(dto.workspaceId, dto.environment, dto.folderId)
-      );
-      queryClient.invalidateQueries(
-        secretSnapshotKeys.list(dto.workspaceId, dto.environment, dto?.folderId)
-      );
-      queryClient.invalidateQueries(
-        secretSnapshotKeys.count(dto.workspaceId, dto.environment, dto?.folderId)
-      );
-    }
-  });
-};
-
-export const createSecret = async (dto: CreateSecretDTO) => {
-  const { data } = await apiRequest.post(`/api/v3/secrets/${dto.secretKey}`, dto);
-  return data;
-}
-
-export const useCreateSecret = () => {
-  const queryClient = useQueryClient();
-
-  return useMutation<{}, {}, CreateSecretDTO>({
-    mutationFn: async (dto) => {
-      const data = createSecret(dto);
-      return data;
-    },
-    onSuccess: (_, dto) => {
-      queryClient.invalidateQueries(
-        secretKeys.getProjectSecret(dto.workspaceId, dto.environment)
-      );
-    }
-  });
-};

frontend/src/hooks/api/secrets/types.ts

@@ -16,6 +16,7 @@ export type EncryptedSecret = {
   __v: number;
   createdAt: string;
   updatedAt: string;
+  skipMultilineEncoding?: boolean;
   secretCommentCiphertext: string;
   secretCommentIV: string;
   secretCommentTag: string;
@@ -24,6 +25,7 @@ export type EncryptedSecret = {
 
 export type DecryptedSecret = {
   _id: string;
+  version: number;
   key: string;
   value: string;
   comment: string;
@@ -35,6 +37,7 @@ export type DecryptedSecret = {
   idOverride?: string;
   overrideAction?: string;
   folderId?: string;
+  skipMultilineEncoding?: boolean;
 };
 
 export type EncryptedSecretVersion = {
@@ -53,55 +56,21 @@ export type EncryptedSecretVersion = {
   secretValueTag: string;
   tags: WsTag[];
   __v: number;
+  skipMultilineEncoding?: boolean;
   createdAt: string;
   updatedAt: string;
 };
 
 // dto
-type SecretTagArg = { _id: string; name: string; slug: string };
-
-export type UpdateSecretArg = {
-  _id: string;
-  folderId?: string;
-  type: "shared" | "personal";
-  secretName: string;
-  secretKeyCiphertext: string;
-  secretKeyIV: string;
-  secretKeyTag: string;
-  secretValueCiphertext: string;
-  secretValueIV: string;
-  secretValueTag: string;
-  secretCommentCiphertext: string;
-  secretCommentIV: string;
-  secretCommentTag: string;
-  tags: SecretTagArg[];
-};
-
-export type CreateSecretArg = Omit<UpdateSecretArg, "_id">;
-
-export type DeleteSecretArg = { _id: string, secretName: string; };
-
-export type BatchSecretDTO = {
+export type TGetProjectSecretsKey = {
   workspaceId: string;
-  folderId: string;
   environment: string;
-  requests: Array<
-    | { method: "POST"; secret: CreateSecretArg }
-    | { method: "PATCH"; secret: UpdateSecretArg }
-    | { method: "DELETE"; secret: DeleteSecretArg }
-  >;
+  secretPath?: string;
 };
 
-export type GetProjectSecretsDTO = {
-  workspaceId: string;
-  env: string | string[];
+export type TGetProjectSecretsDTO = {
   decryptFileKey: UserWsKeyPair;
-  folderId?: string;
-  secretPath?: string;
-  isPaused?: boolean;
-  include_imports?: boolean;
-  onSuccess?: (data: DecryptedSecret[]) => void;
-};
+} & TGetProjectSecretsKey;
 
 export type TGetProjectSecretsAllEnvDTO = {
   workspaceId: string;
@@ -124,6 +93,7 @@ export type TCreateSecretsV3DTO = {
   secretName: string;
   secretValue: string;
   secretComment: string;
+  skipMultilineEncoding?: boolean;
   secretPath: string;
   workspaceId: string;
   environment: string;
@@ -136,19 +106,63 @@ export type TUpdateSecretsV3DTO = {
   environment: string;
   type: string;
   secretPath: string;
+  skipMultilineEncoding?: boolean;
+  newSecretName?: string;
   secretName: string;
   secretValue: string;
+  secretComment?: string;
+  tags?: string[];
 };
 
 export type TDeleteSecretsV3DTO = {
   workspaceId: string;
   environment: string;
-  type: string;
+  type: "shared" | "personal";
   secretPath: string;
   secretName: string;
 };
 
-// --- v3
+export type TCreateSecretBatchDTO = {
+  workspaceId: string;
+  environment: string;
+  secretPath: string;
+  latestFileKey: UserWsKeyPair;
+  secrets: Array<{
+    secretName: string;
+    secretValue: string;
+    secretComment: string;
+    skipMultilineEncoding?: boolean;
+    type: "shared" | "personal";
+    metadata?: {
+      source?: string;
+    };
+  }>;
+};
+
+export type TUpdateSecretBatchDTO = {
+  workspaceId: string;
+  environment: string;
+  secretPath: string;
+  latestFileKey: UserWsKeyPair;
+  secrets: Array<{
+    type: "shared" | "personal";
+    secretName: string;
+    skipMultilineEncoding?: boolean;
+    secretValue: string;
+    secretComment: string;
+    tags?: string[];
+  }>;
+};
+
+export type TDeleteSecretBatchDTO = {
+  workspaceId: string;
+  environment: string;
+  secretPath: string;
+  secrets: Array<{
+    secretName: string;
+    type: "shared" | "personal";
+  }>;
+};
 
 export type CreateSecretDTO = {
   workspaceId: string;
@@ -167,5 +181,5 @@ export type CreateSecretDTO = {
   secretPath: string;
   metadata?: {
     source?: string;
-  }
-}
+  };
+};

frontend/src/hooks/api/types.ts

@@ -4,6 +4,10 @@ export type { IntegrationAuth } from "./integrationAuth/types";
 export type { TCloudIntegration, TIntegration } from "./integrations/types";
 export type { UserWsKeyPair } from "./keys/types";
 export type { Organization } from "./organization/types";
+export type { TSecretApprovalPolicy } from "./secretApproval/types";
+export type { TSecretFolder } from "./secretFolders/types";
+export type { TImportedSecrets, TSecretImports } from "./secretImports/types";
+export * from "./secrets/types";
 export type { CreateServiceTokenDTO, ServiceToken } from "./serviceTokens/types";
 export type { SubscriptionPlan } from "./subscriptions/types";
 export type { WsTag } from "./tags/types";

frontend/src/layouts/AppLayout/AppLayout.tsx

@@ -475,6 +475,20 @@ export const AppLayout = ({ children }: LayoutProps) => {
                           </MenuItem>
                         </a>
                       </Link>
+                      {process.env.NEXT_PUBLIC_SECRET_APPROVAL === "true" && (
+                        <Link href={`/project/${currentWorkspace?._id}/approval`} passHref>
+                          <a>
+                            <MenuItem
+                              isSelected={
+                                router.asPath === `/project/${currentWorkspace?._id}/allowlist`
+                              }
+                              icon="system-outline-126-verified"
+                            >
+                              Admin Panel
+                            </MenuItem>
+                          </a>
+                        </Link>
+                      )}
                       <Link href={`/project/${currentWorkspace?._id}/allowlist`} passHref>
                         <a>
                           <MenuItem

frontend/src/pages/project/[id]/approval/index.tsx

@@ -0,0 +1,27 @@
+import { useTranslation } from "react-i18next";
+import Head from "next/head";
+
+import { SecretApprovalPage } from "@app/views/SecretApprovalPage";
+
+const SecretApproval = () => {
+  const { t } = useTranslation();
+
+  return (
+    <>
+      <Head>
+        <title>{t("common.head-title", { title: t("approval.title") })}</title>
+        <link rel="icon" href="/infisical.ico" />
+        <meta property="og:image" content="/images/message.png" />
+        <meta property="og:title" content={String(t("approval.og-title"))} />
+        <meta name="og:description" content={String(t("approval.og-description"))} />
+      </Head>
+      <div className="h-full">
+        <SecretApprovalPage />
+      </div>
+    </>
+  );
+};
+
+export default SecretApproval;
+
+SecretApproval.requireAuth = true;

frontend/src/pages/project/[id]/secrets/[env].tsx

@@ -1,7 +1,7 @@
 import { useTranslation } from "react-i18next";
 import Head from "next/head";
 
-import { DashboardPage } from "@app/views/DashboardPage";
+import { SecretMainPage } from "@app/views/SecretMainPage";
 
 const Dashboard = () => {
   const { t } = useTranslation();
@@ -16,7 +16,7 @@ const Dashboard = () => {
         <meta name="og:description" content={String(t("dashboard.og-description"))} />
       </Head>
       <div className="h-full">
-        <DashboardPage />
+        <SecretMainPage />
       </div>
     </>
   );

frontend/src/pages/project/[id]/secrets/v2/[env].tsx

@@ -0,0 +1,27 @@
+import { useTranslation } from "react-i18next";
+import Head from "next/head";
+
+import { SecretMainPage } from "@app/views/SecretMainPage";
+
+const Dashboard = () => {
+  const { t } = useTranslation();
+
+  return (
+    <>
+      <Head>
+        <title>{t("common.head-title", { title: t("dashboard.title") })}</title>
+        <link rel="icon" href="/infisical.ico" />
+        <meta property="og:image" content="/images/message.png" />
+        <meta property="og:title" content={String(t("dashboard.og-title"))} />
+        <meta name="og:description" content={String(t("dashboard.og-description"))} />
+      </Head>
+      <div className="h-full">
+        <SecretMainPage />
+      </div>
+    </>
+  );
+};
+
+export default Dashboard;
+
+Dashboard.requireAuth = true;

frontend/src/views/DashboardPage/DashboardPage.utils.ts

@@ -1,289 +0,0 @@
-/* eslint-disable @typescript-eslint/naming-convention */
-import crypto from "crypto";
-
-import * as yup from "yup";
-
-import {
-  decryptAssymmetric,
-  encryptSymmetric
-} from "@app/components/utilities/cryptography/crypto";
-import { BatchSecretDTO, DecryptedSecret } from "@app/hooks/api/secrets/types";
-
-export enum SecretActionType {
-  Created = "created",
-  Modified = "modified",
-  Deleted = "deleted"
-}
-
-export const DEFAULT_SECRET_VALUE = {
-  _id: undefined,
-  overrideAction: undefined,
-  idOverride: undefined,
-  valueOverride: undefined,
-  comment: "",
-  key: "",
-  value: "",
-  tags: []
-};
-
-const secretSchema = yup.object({
-  _id: yup.string(),
-  key: yup
-    .string()
-    .trim()
-    .required()
-    .label("Secret key")
-    .test("starts-with-number", "Should start with an alphabet", (val) =>
-      Boolean(val?.charAt(0)?.match(/[a-zA-Z]/i))
-    )
-    .test({
-      name: "duplicate-keys",
-      // TODO:(akhilmhdh) ts keeps throwing from not found need to see how to resolve this
-      test: (val, ctx: any) => {
-        const secrets: Array<{ key: string }> = ctx?.from?.[1]?.value?.secrets || [];
-        const duplicateKeys: Record<number, boolean> = {};
-        secrets?.forEach(({ key }, index) => {
-          if (key === val) duplicateKeys[index + 1] = true;
-        });
-        const pos = Object.keys(duplicateKeys);
-        if (pos.length <= 1) {
-          return true;
-        }
-        return ctx.createError({ message: `Same key in row ${pos.join(", ")}` });
-      }
-    }),
-  value: yup.string().trim(),
-  comment: yup.string().trim(),
-  tags: yup.array(
-    yup.object({
-      _id: yup.string().required(),
-      name: yup.string().required(),
-      slug: yup.string().required(),
-      tagColor: yup.string().nullable(),
-    })
-  ),
-  overrideAction: yup.string().notRequired().oneOf(Object.values(SecretActionType)),
-  idOverride: yup.string().notRequired(),
-  valueOverride: yup.string().trim().notRequired()
-});
-
-export const schema = yup.object({
-  isSnapshotMode: yup.bool().notRequired(),
-  secrets: yup.array(secretSchema)
-});
-
-export type FormData = yup.InferType<typeof schema>;
-export type TSecretDetailsOpen = { index: number; id: string };
-export type TSecOverwriteOpt = { secrets: Record<string, { comments: string[]; value: string }> };
-
-// to convert multi line into single line ones by quoting them and changing to string \n
-const formatMultiValueEnv = (val?: string) => {
-  if (!val) return "";
-  if (!val.match("\n")) return val;
-  return `"${val.replace(/\n/g, "\\n")}"`;
-};
-
-export const downloadSecret = (
-  secrets: FormData["secrets"] = [],
-  importedSecrets: { key: string; value?: string; comment?: string }[] = [],
-  env: string = "unknown"
-) => {
-  const importSecPos: Record<string, number> = {};
-  importedSecrets.forEach((el, index) => {
-    importSecPos[el.key] = index;
-  });
-  const finalSecret = [...importedSecrets];
-  secrets.forEach(({ key, value, valueOverride, overrideAction, comment }) => {
-    const finalVal =
-      overrideAction && overrideAction !== SecretActionType.Deleted ? valueOverride : value;
-    const newValue = {
-      key,
-      value: formatMultiValueEnv(finalVal),
-      comment
-    };
-    // can also be zero thus failing
-    if (typeof importSecPos?.[key] === "undefined") {
-      finalSecret.push(newValue);
-    } else {
-      finalSecret[importSecPos[key]] = newValue;
-    }
-  });
-
-  let file = "";
-  finalSecret.forEach(({ key, value, comment }) => {
-    if (comment) {
-      file += `# ${comment}\n${key}=${value}\n`;
-      return;
-    }
-    file += `${key}=${value}\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();
-};
-
-/*
- * Below functions are used convert the dashboard secrets to the bulk secret creation request format
- * They are encrypted back
- * Formatted to [ { request: "", secret:{} } ]
- */
-const encryptASecret = (randomBytes: string, key: string, value?: string, comment?: string) => {
-  // encrypt key
-  const {
-    ciphertext: secretKeyCiphertext,
-    iv: secretKeyIV,
-    tag: secretKeyTag
-  } = encryptSymmetric({
-    plaintext: key,
-    key: randomBytes
-  });
-
-  // encrypt value
-  const {
-    ciphertext: secretValueCiphertext,
-    iv: secretValueIV,
-    tag: secretValueTag
-  } = encryptSymmetric({
-    plaintext: value ?? "",
-    key: randomBytes
-  });
-
-  // encrypt comment
-  const {
-    ciphertext: secretCommentCiphertext,
-    iv: secretCommentIV,
-    tag: secretCommentTag
-  } = encryptSymmetric({
-    plaintext: comment ?? "",
-    key: randomBytes
-  });
-
-  return {
-    secretKeyCiphertext,
-    secretKeyIV,
-    secretKeyTag,
-    secretValueCiphertext,
-    secretValueIV,
-    secretValueTag,
-    secretCommentCiphertext,
-    secretCommentIV,
-    secretCommentTag
-  };
-};
-
-const deepCompareSecrets = (lhs: DecryptedSecret, rhs: any) =>
-  lhs.key === rhs.key &&
-  lhs.value === rhs.value &&
-  lhs.comment === rhs.comment &&
-  lhs?.valueOverride === rhs?.valueOverride &&
-  JSON.stringify(lhs.tags) === JSON.stringify(rhs.tags);
-
-export const transformSecretsToBatchSecretReq = (
-  deletedSecretIds: { id: string; secretName: string; }[],
-  latestFileKey: any,
-  secrets: FormData["secrets"],
-  intialValues: DecryptedSecret[] = []
-) => {
-  // deleted secrets
-  const secretsToBeDeleted: BatchSecretDTO["requests"] = deletedSecretIds.map(({ id, secretName }) => ({
-    method: "DELETE",
-    secret: { 
-      _id: id,
-      secretName
-    }
-  }));
-
-  const secretsToBeUpdated: BatchSecretDTO["requests"] = [];
-  const secretsToBeCreated: BatchSecretDTO["requests"] = [];
-  const PRIVATE_KEY = localStorage.getItem("PRIVATE_KEY") as string;
-
-  const randomBytes = latestFileKey
-    ? decryptAssymmetric({
-        ciphertext: latestFileKey.encryptedKey,
-        nonce: latestFileKey.nonce,
-        publicKey: latestFileKey.sender.publicKey,
-        privateKey: PRIVATE_KEY
-      })
-    : crypto.randomBytes(16).toString("hex");
-
-  secrets?.forEach((secret) => {
-    const {
-      _id,
-      idOverride,
-      value,
-      valueOverride,
-      overrideAction,
-      tags = [],
-      comment,
-      key
-    } = secret;
-    if (!idOverride && overrideAction === SecretActionType.Created) {
-      secretsToBeCreated.push({
-        method: "POST",
-        secret: {
-          type: "personal",
-          tags,
-          secretName: key,
-          ...encryptASecret(randomBytes, key, valueOverride, comment)
-        }
-      });
-    }
-    // to be created ones as they don't have server generated id
-    if (!_id) {
-      secretsToBeCreated.push({
-        method: "POST",
-        secret: {
-          type: "shared",
-          tags,
-          secretName: key,
-          ...encryptASecret(randomBytes, key, value, comment)
-        }
-      });
-      return; // exit as updated and delete case won't happen when created
-    }
-    // has an id means this is updated one
-    if (_id) {
-      // check value has changed or not
-      const initialSecretValue = intialValues?.find(({ _id: secId }) => secId === _id)!;
-      if (!deepCompareSecrets(initialSecretValue, secret)) {
-        secretsToBeUpdated.push({
-          method: "PATCH",
-          secret: {
-            _id,
-            type: "shared",
-            tags,
-            secretName: key,
-            ...encryptASecret(randomBytes, key, value, comment)
-          }
-        });
-      }
-    }
-    if (idOverride) {
-      // if action is deleted meaning override has been removed but id is kept to collect at this point
-      if (overrideAction === SecretActionType.Deleted) {
-        secretsToBeDeleted.push({ method: "DELETE", secret: { _id: idOverride, secretName: key } });
-      } else {
-        // if not deleted action then as id is there its an updated
-        const initialSecretValue = intialValues?.find(({ _id: secId }) => secId === _id)!;
-        if (!deepCompareSecrets(initialSecretValue, secret)) {
-          secretsToBeUpdated.push({
-            method: "PATCH",
-            secret: {
-              _id: idOverride,
-              type: "personal",
-              tags,
-              secretName: key,
-              ...encryptASecret(randomBytes, key, valueOverride, comment)
-            }
-          });
-        }
-      }
-    }
-  });
-
-  return secretsToBeCreated.concat(secretsToBeUpdated, secretsToBeDeleted);
-};

frontend/src/views/DashboardPage/components/CompareSecret/CompareSecret.tsx

@@ -1,64 +0,0 @@
-import { useCallback } from "react";
-
-import { FormControl, Input, Spinner } from "@app/components/v2";
-import { useGetProjectSecrets, useGetUserWsKey } from "@app/hooks/api";
-
-type SecretValueProps = {
-  workspaceId: string;
-  envName: string;
-  env: string;
-  secretKey: string;
-};
-
-const SecretValue = ({ workspaceId, env, envName, secretKey }: SecretValueProps) => {
-  const { data: latestFileKey } = useGetUserWsKey(workspaceId);
-  const { data: secret, isLoading: isSecretsLoading } = useGetProjectSecrets({
-    workspaceId,
-    env,
-    decryptFileKey: latestFileKey!
-  });
-
-  const getValue = useCallback(
-    (data: typeof secret) => {
-      const sec = data?.secrets?.find(({ key: secKey }) => secKey === secretKey);
-      return sec?.value || "Not found";
-    },
-    [secretKey]
-  );
-
-  return (
-    <FormControl label={envName}>
-      <Input
-        className={`w-full text-ellipsis font-mono focus:ring-transparent ${getValue(secret) === "Not found" && "text-mineshaft-500"}`}
-        value={getValue(secret)}
-        isReadOnly
-        rightIcon={isSecretsLoading ? <Spinner /> : undefined}
-      />
-    </FormControl>
-  );
-};
-
-type Props = {
-  workspaceId: string;
-  secretKey: string;
-  envs: Array<{ name: string; slug: string }>;
-};
-
-export const CompareSecret = ({ workspaceId, secretKey, envs }: Props): JSX.Element => {
-  // should not do anything until secretKey is available
-  if (!secretKey) return <div />;
-
-  return (
-    <div className="flex flex-col">
-      {envs.map(({ name, slug }) => (
-        <SecretValue
-          workspaceId={workspaceId}
-          key={`secret-comparison-${slug}`}
-          envName={name}
-          env={slug}
-          secretKey={secretKey}
-        />
-      ))}
-    </div>
-  );
-};

frontend/src/views/DashboardPage/components/CompareSecret/index.tsx

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

frontend/src/views/DashboardPage/components/CreateTagModal/CreateTagModal.tsx

@@ -1,191 +0,0 @@
-import { useEffect, useState } from "react";
-import { Controller, useForm } from "react-hook-form";
-import {
-  faCheck
-} from "@fortawesome/free-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { yupResolver } from "@hookform/resolvers/yup";
-import * as yup from "yup";
-
-import { Button, FormControl, Input, ModalClose, Tooltip } from "@app/components/v2";
-
-import { isValidHexColor } from "../../../../components/utilities/isValidHexColor";
-import { secretTagsColors } from "../../../../const"
-import { TagColor } from "../../../../hooks/api/tags/types";
-
-
-type Props = {
-  onCreateTag: (tagName: string, tagColor: string) => Promise<void>;
-};
-
-const createTagSchema = yup.object({
-  name: yup.string().required().trim().label("Tag Name")
-});
-type FormData = yup.InferType<typeof createTagSchema>;
-
-export const CreateTagModal = ({ onCreateTag }: Props): JSX.Element => {
-  const {
-    control,
-    reset,
-    formState: { isSubmitting },
-    handleSubmit
-  } = useForm<FormData>({
-    resolver: yupResolver(createTagSchema)
-  });
-
-  const [tagsColors] = useState<TagColor[]>(secretTagsColors)
-  const [selectedTagColor, setSelectedTagColor] = useState<TagColor>(tagsColors[0])
-  const [showHexInput, setShowHexInput] = useState<boolean>(false)
-  const [tagColor, setTagColor] = useState<string>("")
-
-
-  const onFormSubmit = async ({ name }: FormData) => {
-    await onCreateTag(name, tagColor);
-    reset();
-  };
-
-  useEffect(() => {
-    const clonedTagColors = [...tagsColors]
-    const selectedTagBgColor = clonedTagColors.find($tagColor => $tagColor.selected);
-
-    if (selectedTagBgColor) {
-      setSelectedTagColor(selectedTagBgColor);
-      setTagColor(selectedTagBgColor.hex);
-    }
-  }, [])
-
-  useEffect(() => {
-    const tagsList = document.querySelector(".secret-tags-wrapper")
-    const tagsHexWrapper = document.querySelector(".tags-hex-wrapper")
-
-    if (showHexInput) {
-      tagsList?.classList.add("hide-tags")
-      tagsList?.classList.remove("show-tags")
-      tagsHexWrapper?.classList.add("show-hex-input")
-      tagsHexWrapper?.classList.remove("hide-hex-input")
-    } else {
-      tagsList?.classList.remove("hide-tags")
-      tagsList?.classList.add("show-tags")
-      tagsHexWrapper?.classList.remove("show-hex-input")
-      tagsHexWrapper?.classList.add("hide-hex-input")
-    }
-  }, [showHexInput])
-
-
-  const handleColorChange = (clickedTagColor: TagColor) => {
-    const updatedTagColors = [...tagsColors];
-    const clickedTagColorIndex = updatedTagColors.findIndex(($tagColor) => $tagColor.id === clickedTagColor.id);
-    const updatedClickedTagColor = updatedTagColors[clickedTagColorIndex];
-
-    updatedTagColors.forEach((tgColor) => {
-      // eslint-disable-next-line no-param-reassign
-      tgColor.selected = false;
-    });
-
-    if (selectedTagColor.id !== clickedTagColor.id) {
-      updatedClickedTagColor.selected = !updatedClickedTagColor.selected;
-      setSelectedTagColor(updatedClickedTagColor);
-      setTagColor(updatedClickedTagColor.hex);
-    }
-  };
-
-  return (
-    <form onSubmit={handleSubmit(onFormSubmit)}>
-      <Controller
-        control={control}
-        name="name"
-        defaultValue=""
-        render={({ field, fieldState: { error } }) => (
-          <FormControl label="Tag Name" isError={Boolean(error)} errorText={error?.message}>
-            <Input {...field} placeholder="Type your tag name" />
-          </FormControl>
-        )}
-      />
-
-      <div className="mt-2">
-        <div className="mb-0.5 ml-1 block text-sm font-normal text-mineshaft-400">Tag Color</div>
-        <div className="flex gap-2 h-[50px]">
-          <div className="w-[12%]   h-[2.813rem]	 inline-flex font-inter items-center justify-center border relative rounded-md border-mineshaft-500  bg-mineshaft-900 hover:bg-mineshaft-800">
-            <div className="w-[26px]  h-[26px] rounded-full" style={{ background: `${tagColor}` }} />
-          </div>
-
-          <div className="w-[88%] h-[2.813rem] flex-wrap inline-flex gap-3 items-center border  rounded-md border-mineshaft-500 bg-mineshaft-900 hover:bg-mineshaft-800 relative">
-            <div className="flex-wrap	 inline-flex gap-3 items-center secret-tags-wrapper pl-3">
-              {
-                tagsColors.map(($tagColor: TagColor) => {
-                  return (
-                    <div key={`tag-color-${$tagColor.id}`}>
-                      <Tooltip content={`${$tagColor.name}`}>
-                        <div className=" flex items-center justify-center w-[26px] h-[26px] hover:ring-offset-2 hover:ring-2 bg-[#bec2c8] border-2 p-2 hover:shadow-lg border-transparent hover:border-black rounded-full"
-                          key={`tag-${$tagColor.id}`}
-                          style={{ backgroundColor: `${$tagColor.hex}` }}
-
-                          onClick={() => handleColorChange($tagColor)}
-                          tabIndex={0} role="button"
-                          onKeyDown={() => { }}
-                        >
-                          {
-                            $tagColor.selected && <FontAwesomeIcon icon={faCheck} style={{ color: "#00000070" }} />
-                          }
-                        </div>
-                      </Tooltip>
-                    </div>
-                  )
-                })
-              }
-            </div>
-
-            <div className="flex items-center gap-2 px-2 tags-hex-wrapper" >
-              <div className="w-1/6	  flex items-center  relative rounded-md hover:bg-mineshaft-800">
-                {
-                  isValidHexColor(tagColor) && (
-                    <div className="w-[26px]  h-[26px] rounded-full flex items-center justify-center" style={{ background: `${tagColor}` }}>
-                      <FontAwesomeIcon icon={faCheck} style={{ color: "#00000070" }} />
-                    </div>
-                  )
-                }
-
-                {
-                  !isValidHexColor(tagColor) && (
-                    <div className="border-dashed border bg-blue rounded-full w-[26px] h-[26px] border-mineshaft-500" />
-                  )
-                }
-              </div>
-              <div className="w-10/12">
-                <Input
-                  variant="plain"
-                  className="w-full focus:text-bunker-100 focus:ring-transparent bg-transparent"
-                  autoCapitalization={false}
-                  value={tagColor}
-                  onChange={(e: React.ChangeEvent<HTMLInputElement>) => setTagColor(e.target.value)}
-                />
-              </div>
-            </div>
-
-            <div className="w-[26px] h-[26px]  flex items-center justify-center absolute top-[10px] right-[-4px] translate-x-[-50%]">
-              <div className="border-mineshaft-500  border h-[2.1rem] mr-4 absolute right-5" />
-              <div className={`flex items-center justify-center w-[26px] h-[26px] bg-transparent cursor-pointer hover:ring-offset-1 hover:ring-2 border-mineshaft-500 border bg-mineshaft-900 rounded-[3px]  p-2 ${showHexInput ? "tags-conic-bg rounded-full" : ""}`} onClick={() => setShowHexInput((prev) => !prev)} style={{ border: "1px solid rgba(220, 216, 254, 0.376)" }}
-                tabIndex={0} role="button"
-                onKeyDown={() => { }}>
-                {
-                  !showHexInput && <span>#</span>
-                }
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <div className="mt-8 flex items-center">
-        <Button className="mr-4" type="submit" isDisabled={isSubmitting} isLoading={isSubmitting}>
-          Create
-        </Button>
-        <ModalClose asChild>
-          <Button variant="plain" colorSchema="secondary">
-            Cancel
-          </Button>
-        </ModalClose>
-      </div>
-    </form>
-  );
-};

frontend/src/views/DashboardPage/components/CreateTagModal/index.tsx

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

frontend/src/views/DashboardPage/components/FolderSection/FolderSection.tsx

@@ -1,108 +0,0 @@
-import { memo } from "react";
-import { subject } from "@casl/ability";
-import { faEdit, faFolder, faXmark } from "@fortawesome/free-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-
-import { ProjectPermissionCan } from "@app/components/permissions";
-import { IconButton, Tooltip } from "@app/components/v2";
-import { ProjectPermissionActions, ProjectPermissionSub } from "@app/context";
-
-type Props = {
-  folders?: Array<{ id: string; name: string }>;
-  search?: string;
-  environment: string;
-  secretPath: string;
-  onFolderUpdate: (folderId: string, name: string) => void;
-  onFolderDelete: (folderId: string, name: string) => void;
-  onFolderOpen: (folderId: string) => void;
-};
-
-export const FolderSection = memo(
-  ({
-    onFolderUpdate: handleFolderUpdate,
-    onFolderDelete: handleFolderDelete,
-    onFolderOpen: handleFolderOpen,
-    search = "",
-    folders = [],
-    environment,
-    secretPath
-  }: Props) => {
-    return (
-      <>
-        {folders
-          .filter(({ name }) => name.toLowerCase().includes(search.toLowerCase()))
-          .map(({ id, name }) => (
-            <tr
-              key={id}
-              className="group flex cursor-default flex-row items-center hover:bg-mineshaft-700"
-            >
-              <td className="ml-0.5 flex h-10 w-10 items-center justify-center border-none px-4">
-                <FontAwesomeIcon icon={faFolder} className="text-yellow-700" />
-              </td>
-              <td
-                colSpan={2}
-                className="relative flex w-full min-w-[220px] items-center justify-between overflow-hidden text-ellipsis lg:min-w-[240px] xl:min-w-[280px]"
-                style={{ paddingTop: "0", paddingBottom: "0" }}
-              >
-                <div
-                  className="flex-grow cursor-default p-2"
-                  onKeyDown={() => null}
-                  tabIndex={0}
-                  role="button"
-                  onClick={() => handleFolderOpen(id)}
-                >
-                  {name}
-                </div>
-                <div className="duration-0 flex h-10 w-16 items-center justify-end space-x-2.5 overflow-hidden border-l border-mineshaft-600 transition-all">
-                  <ProjectPermissionCan
-                    I={ProjectPermissionActions.Edit}
-                    a={subject(ProjectPermissionSub.Secrets, { environment, secretPath })}
-                  >
-                    {(isAllowed) => (
-                      <div className="opacity-0 group-hover:opacity-100">
-                        <Tooltip content="Settings" className="capitalize">
-                          <IconButton
-                            size="md"
-                            colorSchema="primary"
-                            variant="plain"
-                            isDisabled={!isAllowed}
-                            onClick={() => handleFolderUpdate(id, name)}
-                            ariaLabel="expand"
-                          >
-                            <FontAwesomeIcon icon={faEdit} />
-                          </IconButton>
-                        </Tooltip>
-                      </div>
-                    )}
-                  </ProjectPermissionCan>
-                  <ProjectPermissionCan
-                    I={ProjectPermissionActions.Delete}
-                    a={subject(ProjectPermissionSub.Secrets, { environment, secretPath })}
-                  >
-                    {(isAllowed) => (
-                      <div className="opacity-0 group-hover:opacity-100">
-                        <Tooltip content="Delete" className="capitalize">
-                          <IconButton
-                            size="md"
-                            variant="plain"
-                            colorSchema="danger"
-                            ariaLabel="delete"
-                            isDisabled={!isAllowed}
-                            onClick={() => handleFolderDelete(id, name)}
-                          >
-                            <FontAwesomeIcon icon={faXmark} size="lg" />
-                          </IconButton>
-                        </Tooltip>
-                      </div>
-                    )}
-                  </ProjectPermissionCan>
-                </div>
-              </td>
-            </tr>
-          ))}
-      </>
-    );
-  }
-);
-
-FolderSection.displayName = "FolderSection";

frontend/src/views/DashboardPage/components/FolderSection/index.tsx

@@ -1,3 +0,0 @@
-export { FolderForm } from "./FolderForm";
-export { FolderSection } from "./FolderSection";
-export * from "./types";

frontend/src/views/DashboardPage/components/FolderSection/types.ts

@@ -1,2 +0,0 @@
-export type TEditFolderForm = { id: string; name: string };
-export type TDeleteFolderForm = { id: string; name: string };

frontend/src/views/DashboardPage/components/SecretDetailDrawer/SecretDetailDrawer.tsx

@@ -1,237 +0,0 @@
-import { useFormContext, useWatch } from "react-hook-form";
-import { subject } from "@casl/ability";
-import { faCircle, faCircleDot, faShuffle } from "@fortawesome/free-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-
-import { ProjectPermissionCan } from "@app/components/permissions";
-import {
-  Button,
-  Drawer,
-  DrawerContent,
-  FormControl,
-  Input,
-  Popover,
-  PopoverContent,
-  PopoverTrigger,
-  Switch,
-  TextArea
-} from "@app/components/v2";
-import { ProjectPermissionActions, ProjectPermissionSub } from "@app/context";
-import { useToggle } from "@app/hooks";
-
-import { FormData, SecretActionType } from "../../DashboardPage.utils";
-import { GenRandomNumber } from "./GenRandomNumber";
-
-type Props = {
-  isDrawerOpen: boolean;
-  environment: string;
-  secretPath: string;
-  onOpenChange: (isOpen: boolean) => void;
-  index: number;
-  isReadOnly?: boolean;
-  onEnvCompare: (secretKey: string) => void;
-  secretVersion?: Array<{ id: string; createdAt: string; value: string }>;
-  // to record the ids of deleted ones
-  onSecretDelete: (index: number, secretName: string, id?: string, overrideId?: string) => void;
-  onSave: () => void;
-};
-
-export const SecretDetailDrawer = ({
-  isDrawerOpen,
-  onOpenChange,
-  index,
-  secretVersion = [],
-  isReadOnly,
-  onSecretDelete,
-  onSave,
-  onEnvCompare,
-  environment,
-  secretPath
-}: Props): JSX.Element => {
-  const [canRevealSecVal, setCanRevealSecVal] = useToggle();
-  const [canRevealSecOverride, setCanRevealSecOverride] = useToggle();
-
-  const { register, setValue, control, getValues } = useFormContext<FormData>();
-
-  const overrideAction = useWatch({ control, name: `secrets.${index}.overrideAction` });
-  const isOverridden =
-    overrideAction === SecretActionType.Created || overrideAction === SecretActionType.Modified;
-
-  const onSecretOverride = () => {
-    const secret = getValues(`secrets.${index}`);
-    if (isOverridden) {
-      // when user created a new override but then removes
-      if (SecretActionType.Created) {
-        setValue(`secrets.${index}.valueOverride`, "", { shouldDirty: true });
-      }
-      setValue(`secrets.${index}.overrideAction`, SecretActionType.Deleted, { shouldDirty: true });
-    } else {
-      setValue(
-        `secrets.${index}.overrideAction`,
-        secret?.idOverride ? SecretActionType.Modified : SecretActionType.Created,
-        { shouldDirty: true }
-      );
-    }
-  };
-
-  return (
-    <Drawer onOpenChange={onOpenChange} isOpen={isDrawerOpen}>
-      <DrawerContent
-        className="dark border-l border-mineshaft-500 bg-bunker"
-        title="Secret"
-        footerContent={
-          <div className="flex flex-col space-y-2 pt-4 shadow-md">
-            <div>
-              <Button
-                variant="star"
-                onClick={() => onEnvCompare(getValues(`secrets.${index}.key`))}
-                isFullWidth
-                isDisabled={isReadOnly}
-              >
-                Compare secret across environments
-              </Button>
-            </div>
-            <div className="flex w-full space-x-2">
-              <ProjectPermissionCan
-                I={ProjectPermissionActions.Edit}
-                a={subject(ProjectPermissionSub.Secrets, { environment, secretPath })}
-              >
-                {(isAllowed) => (
-                  <Button isFullWidth onClick={onSave} isDisabled={isReadOnly || !isAllowed}>
-                    Save Changes
-                  </Button>
-                )}
-              </ProjectPermissionCan>
-              <ProjectPermissionCan
-                I={ProjectPermissionActions.Delete}
-                a={subject(ProjectPermissionSub.Secrets, { environment, secretPath })}
-              >
-                {(isAllowed) => (
-                  <Button
-                    colorSchema="danger"
-                    isDisabled={isReadOnly || !isAllowed}
-                    onClick={() => {
-                      const secret = getValues(`secrets.${index}`);
-
-                      onSecretDelete(index, secret.key, secret._id, secret.idOverride);
-                    }}
-                  >
-                    Delete
-                  </Button>
-                )}
-              </ProjectPermissionCan>
-            </div>
-          </div>
-        }
-      >
-        <div className="dark:[color-scheme:dark]">
-          <FormControl label="Key">
-            <Input isDisabled {...register(`secrets.${index}.key`)} />
-          </FormControl>
-          <FormControl label="Value">
-            <Popover>
-              <Input
-                isReadOnly={isOverridden || isReadOnly}
-                {...register(`secrets.${index}.value`)}
-                placeholder="EMPTY"
-                onBlur={setCanRevealSecVal.off}
-                onFocus={setCanRevealSecVal.on}
-                type={canRevealSecVal ? "text" : "password"}
-                rightIcon={
-                  <PopoverTrigger disabled={isOverridden || isReadOnly}>
-                    <FontAwesomeIcon icon={faShuffle} />
-                  </PopoverTrigger>
-                }
-              />
-              <PopoverContent
-                hideCloseBtn
-                className="w-auto border-mineshaft-500 bg-bunker p-0"
-                align="end"
-              >
-                <GenRandomNumber
-                  onGenerate={(val) =>
-                    setValue(`secrets.${index}.value`, val, { shouldDirty: true })
-                  }
-                />
-              </PopoverContent>
-            </Popover>
-          </FormControl>
-          <div className="mb-2 border-t border-mineshaft-600 pt-4">
-            <Switch
-              id="personal-override"
-              onCheckedChange={onSecretOverride}
-              isChecked={isOverridden}
-              isDisabled={isReadOnly}
-            >
-              Override with a personal value
-            </Switch>
-          </div>
-          <FormControl>
-            <Popover>
-              <Input
-                isReadOnly={!isOverridden || isReadOnly}
-                {...register(`secrets.${index}.valueOverride`)}
-                placeholder="EMPTY"
-                type={canRevealSecOverride ? "text" : "password"}
-                onBlur={setCanRevealSecOverride.off}
-                onFocus={setCanRevealSecOverride.on}
-                rightIcon={
-                  <PopoverTrigger disabled={!isOverridden || isReadOnly}>
-                    <FontAwesomeIcon icon={faShuffle} />
-                  </PopoverTrigger>
-                }
-              />
-              <PopoverContent
-                hideCloseBtn
-                className="w-auto border-mineshaft-500 bg-bunker p-0"
-                align="end"
-              >
-                <GenRandomNumber
-                  onGenerate={(val) =>
-                    setValue(`secrets.${index}.valueOverride`, val, { shouldDirty: true })
-                  }
-                />
-              </PopoverContent>
-            </Popover>
-          </FormControl>
-          <div className="dark mb-4 text-sm text-bunker-300">
-            <div className="mb-2">Version History</div>
-            <div className="flex h-48 flex-col space-y-2 overflow-y-auto overflow-x-hidden rounded-md border border-mineshaft-600 bg-bunker-800 p-2 dark:[color-scheme:dark]">
-              {secretVersion?.map(({ createdAt, value, id }, i) => (
-                <div key={id} className="flex flex-col space-y-1">
-                  <div className="flex items-center space-x-2">
-                    <div>
-                      <FontAwesomeIcon icon={i === 0 ? faCircleDot : faCircle} size="sm" />
-                    </div>
-                    <div>
-                      {new Date(createdAt).toLocaleDateString("en-US", {
-                        year: "numeric",
-                        month: "2-digit",
-                        day: "2-digit",
-                        hour: "2-digit",
-                        minute: "2-digit",
-                        second: "2-digit"
-                      })}
-                    </div>
-                  </div>
-                  <div className="ml-1.5 flex items-center space-x-2 border-l border-bunker-300 pl-4">
-                    <div className="self-start rounded-sm bg-primary-500/30 px-1">Value:</div>
-                    <div className="break-all font-mono">{value}</div>
-                  </div>
-                </div>
-              ))}
-            </div>
-          </div>
-          <FormControl label="Comments & Notes">
-            <TextArea
-              className="border border-mineshaft-600 text-sm"
-              isDisabled={isReadOnly}
-              {...register(`secrets.${index}.comment`)}
-              rows={5}
-            />
-          </FormControl>
-        </div>
-      </DrawerContent>
-    </Drawer>
-  );
-};

frontend/src/views/DashboardPage/components/SecretDetailDrawer/index.tsx

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

frontend/src/views/DashboardPage/components/SecretDropzone/SecretDropzone.tsx

@@ -1,451 +0,0 @@
-import { ChangeEvent, DragEvent, useEffect, useState } from "react";
-import { Controller, useForm } from "react-hook-form";
-import { useTranslation } from "react-i18next";
-import { subject } from "@casl/ability";
-import { faSquareCheck } from "@fortawesome/free-regular-svg-icons";
-import {
-  faClone,
-  faKey,
-  faSearch,
-  faSquareXmark,
-  faUpload
-} from "@fortawesome/free-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { yupResolver } from "@hookform/resolvers/yup";
-import { twMerge } from "tailwind-merge";
-import * as yup from "yup";
-
-import GlobPatternExamples from "@app/components/basic/popups/GlobPatternExamples";
-import { useNotificationContext } from "@app/components/context/Notifications/NotificationProvider";
-import { ProjectPermissionCan } from "@app/components/permissions";
-// TODO:(akhilmhdh) convert all the util functions like this into a lib folder grouped by functionality
-import { parseDotEnv } from "@app/components/utilities/parseDotEnv";
-import {
-  Button,
-  Checkbox,
-  EmptyState,
-  FormControl,
-  IconButton,
-  Input,
-  Modal,
-  ModalContent,
-  ModalTrigger,
-  Select,
-  SelectItem,
-  Skeleton,
-  Tooltip
-} from "@app/components/v2";
-import { ProjectPermissionActions, ProjectPermissionSub } from "@app/context";
-import { useDebounce, usePopUp, useToggle } from "@app/hooks";
-import { useGetProjectSecrets } from "@app/hooks/api";
-import { UserWsKeyPair } from "@app/hooks/api/types";
-
-const formSchema = yup.object({
-  environment: yup.string().required().label("Environment").trim(),
-  secretPath: yup
-    .string()
-    .required()
-    .label("Secret Path")
-    .trim()
-    .transform((val) =>
-      typeof val === "string" && val.at(-1) === "/" && val.length > 1 ? val.slice(0, -1) : val
-    ),
-  secrets: yup.lazy((val) => {
-    const valSchema: Record<string, yup.StringSchema> = {};
-    Object.keys(val).forEach((key) => {
-      valSchema[key] = yup.string().trim();
-    });
-    return yup.object(valSchema);
-  })
-});
-
-type TFormSchema = yup.InferType<typeof formSchema>;
-
-const parseJson = (src: ArrayBuffer) => {
-  const file = src.toString();
-  const formatedData: Record<string, string> = JSON.parse(file);
-  const env: Record<string, { value: string; comments: string[] }> = {};
-  Object.keys(formatedData).forEach((key) => {
-    if (typeof formatedData[key] === "string") {
-      env[key] = { value: formatedData[key], comments: [] };
-    }
-  });
-  return env;
-};
-
-type Props = {
-  isSmaller: boolean;
-  onParsedEnv: (env: Record<string, { value: string; comments: string[] }>) => void;
-  onAddNewSecret?: () => void;
-  environments?: { name: string; slug: string }[];
-  workspaceId: string;
-  decryptFileKey: UserWsKeyPair;
-  environment: string;
-  secretPath: string;
-};
-
-export const SecretDropzone = ({
-  isSmaller,
-  onParsedEnv,
-  onAddNewSecret,
-  environments = [],
-  workspaceId,
-  decryptFileKey,
-  environment,
-  secretPath
-}: Props): JSX.Element => {
-  const { t } = useTranslation();
-  const [isDragActive, setDragActive] = useToggle();
-  const [isLoading, setIsLoading] = useToggle();
-  const { createNotification } = useNotificationContext();
-  const { popUp, handlePopUpClose, handlePopUpToggle } = usePopUp(["importSecEnv"] as const);
-  const [searchFilter, setSearchFilter] = useState("");
-  const [shouldIncludeValues, setShouldIncludeValues] = useState(true);
-
-  const {
-    handleSubmit,
-    control,
-    watch,
-    register,
-    reset,
-    setValue,
-    formState: { isDirty }
-  } = useForm<TFormSchema>({
-    resolver: yupResolver(formSchema),
-    defaultValues: { secretPath: "/", environment: environments?.[0]?.slug }
-  });
-
-  const envCopySecPath = watch("secretPath");
-  const selectedEnvSlug = watch("environment");
-  const debouncedEnvCopySecretPath = useDebounce(envCopySecPath);
-
-  const { data: secrets, isLoading: isSecretsLoading } = useGetProjectSecrets({
-    workspaceId,
-    env: selectedEnvSlug,
-    secretPath: debouncedEnvCopySecretPath,
-    isPaused:
-      !(Boolean(workspaceId) && Boolean(selectedEnvSlug) && Boolean(debouncedEnvCopySecretPath)) &&
-      !popUp.importSecEnv.isOpen,
-    decryptFileKey
-  });
-
-  useEffect(() => {
-    setValue("secrets", {});
-    setSearchFilter("");
-  }, [debouncedEnvCopySecretPath]);
-
-  const handleDrag = (e: DragEvent) => {
-    e.preventDefault();
-    e.stopPropagation();
-    if (e.type === "dragenter" || e.type === "dragover") {
-      setDragActive.on();
-    } else if (e.type === "dragleave") {
-      setDragActive.off();
-    }
-  };
-
-  const parseFile = (file?: File, isJson?: boolean) => {
-    const reader = new FileReader();
-    if (!file) {
-      createNotification({
-        text: "You can't inject files from VS Code. Click 'Reveal in finder', and drag your file directly from the directory where it's located.",
-        type: "error",
-        timeoutMs: 10000
-      });
-      return;
-    }
-    // const fileType = file.name.split('.')[1];
-    setIsLoading.on();
-    reader.onload = (event) => {
-      if (!event?.target?.result) return;
-      // parse function's argument looks like to be ArrayBuffer
-      const env = isJson
-        ? parseJson(event.target.result as ArrayBuffer)
-        : parseDotEnv(event.target.result as ArrayBuffer);
-      setIsLoading.off();
-      onParsedEnv(env);
-    };
-
-    // If something is wrong show an error
-    try {
-      reader.readAsText(file);
-    } catch (error) {
-      console.log(error);
-    }
-  };
-
-  const handleDrop = (e: DragEvent) => {
-    e.preventDefault();
-    e.stopPropagation();
-    if (!e.dataTransfer) {
-      return;
-    }
-
-    e.dataTransfer.dropEffect = "copy";
-    setDragActive.off();
-    parseFile(e.dataTransfer.files[0]);
-  };
-
-  const handleFileUpload = (e: ChangeEvent<HTMLInputElement>) => {
-    e.preventDefault();
-    parseFile(e.target?.files?.[0], e.target?.files?.[0]?.type === "application/json");
-  };
-
-  const handleFormSubmit = (data: TFormSchema) => {
-    const secretsToBePulled: Record<string, { value: string; comments: string[] }> = {};
-    Object.keys(data.secrets || {}).forEach((key) => {
-      if (data.secrets[key]) {
-        secretsToBePulled[key] = {
-          value: (shouldIncludeValues && data.secrets[key]) || "",
-          comments: [""]
-        };
-      }
-    });
-    onParsedEnv(secretsToBePulled);
-    handlePopUpClose("importSecEnv");
-    reset();
-  };
-
-  const handleSecSelectAll = () => {
-    if (secrets?.secrets) {
-      setValue(
-        "secrets",
-        secrets?.secrets?.reduce((prev, curr) => ({ ...prev, [curr.key]: curr.value }), {}),
-        { shouldDirty: true }
-      );
-    }
-  };
-
-  return (
-    <div
-      onDragEnter={handleDrag}
-      onDragLeave={handleDrag}
-      onDragOver={handleDrag}
-      onDrop={handleDrop}
-      className={twMerge(
-        "relative mx-0.5 mb-4 mt-4 flex cursor-pointer items-center justify-center rounded-md bg-mineshaft-900 py-4 px-2 text-sm text-mineshaft-200 opacity-60 outline-dashed outline-2 outline-chicago-600 duration-200 hover:opacity-100",
-        isDragActive && "opacity-100",
-        !isSmaller && "w-full max-w-3xl flex-col space-y-4 py-20",
-        isLoading && "bg-bunker-800"
-      )}
-    >
-      {isLoading ? (
-        <div className="mb-16 flex items-center justify-center pt-16">
-          <img src="/images/loading/loading.gif" height={70} width={120} alt="loading animation" />
-        </div>
-      ) : (
-        <form onSubmit={handleSubmit(handleFormSubmit)}>
-          <div className="justify-cente flex flex-col items-center space-y-2">
-            <div>
-              <FontAwesomeIcon icon={faUpload} size={isSmaller ? "2x" : "5x"} />
-            </div>
-            <div>
-              <p className="">{t(isSmaller ? "common.drop-zone-keys" : "common.drop-zone")}</p>
-            </div>
-            <ProjectPermissionCan
-              I={ProjectPermissionActions.Create}
-              a={subject(ProjectPermissionSub.Secrets, { environment, secretPath })}
-            >
-              {(isAllowed) => (
-                <input
-                  id="fileSelect"
-                  disabled={!isAllowed}
-                  type="file"
-                  className="absolute h-full w-full cursor-pointer opacity-0"
-                  accept=".txt,.env,.yml,.yaml,.json"
-                  onChange={handleFileUpload}
-                />
-              )}
-            </ProjectPermissionCan>
-            <div
-              className={twMerge(
-                "flex w-full flex-row items-center justify-center py-4",
-                isSmaller && "py-1"
-              )}
-            >
-              <div className="w-1/5 border-t border-mineshaft-700" />
-              <p className="mx-4 text-xs text-mineshaft-400">OR</p>
-              <div className="w-1/5 border-t border-mineshaft-700" />
-            </div>
-            <div className="flex items-center justify-center space-x-8">
-              <Modal
-                isOpen={popUp.importSecEnv.isOpen}
-                onOpenChange={(isOpen) => {
-                  handlePopUpToggle("importSecEnv", isOpen);
-                  reset();
-                  setSearchFilter("");
-                }}
-              >
-                <ModalTrigger asChild>
-                  <div>
-                    <ProjectPermissionCan
-                      I={ProjectPermissionActions.Create}
-                      a={subject(ProjectPermissionSub.Secrets, { environment, secretPath })}
-                    >
-                      {(isAllowed) => (
-                        <Button
-                          isDisabled={!isAllowed}
-                          variant="star"
-                          size={isSmaller ? "xs" : "sm"}
-                        >
-                          Copy Secrets From An Environment
-                        </Button>
-                      )}
-                    </ProjectPermissionCan>
-                  </div>
-                </ModalTrigger>
-                <ModalContent
-                  className="max-w-2xl"
-                  title="Copy Secret From An Environment"
-                  subTitle="Copy/paste secrets from other environments into this context"
-                >
-                  <form>
-                    <div className="flex items-center space-x-2">
-                      <Controller
-                        control={control}
-                        name="environment"
-                        render={({ field: { value, onChange } }) => (
-                          <FormControl label="Environment" isRequired className="w-1/3">
-                            <Select
-                              value={value}
-                              onValueChange={(val) => onChange(val)}
-                              className="w-full border border-mineshaft-500"
-                              defaultValue={environments?.[0]?.slug}
-                              position="popper"
-                            >
-                              {environments.map((sourceEnvironment) => (
-                                <SelectItem
-                                  value={sourceEnvironment.slug}
-                                  key={`source-environment-${sourceEnvironment.slug}`}
-                                >
-                                  {sourceEnvironment.name}
-                                </SelectItem>
-                              ))}
-                            </Select>
-                          </FormControl>
-                        )}
-                      />
-                      <FormControl
-                        label="Secret Path"
-                        className="flex-grow"
-                        isRequired
-                        icon={<GlobPatternExamples />}
-                      >
-                        <Input
-                          {...register("secretPath")}
-                          placeholder="Provide a path, default is /"
-                        />
-                      </FormControl>
-                    </div>
-                    <div className="border-t border-mineshaft-600 pt-4">
-                      <div className="mb-4 flex items-center justify-between">
-                        <div>Secrets</div>
-                        <div className="flex w-1/2 items-center space-x-2">
-                          <Input
-                            placeholder="Search for secret"
-                            value={searchFilter}
-                            size="xs"
-                            leftIcon={<FontAwesomeIcon icon={faSearch} />}
-                            onChange={(evt) => setSearchFilter(evt.target.value)}
-                          />
-                          <Tooltip content="Select All">
-                            <IconButton
-                              ariaLabel="Select all"
-                              variant="outline_bg"
-                              size="xs"
-                              onClick={handleSecSelectAll}
-                            >
-                              <FontAwesomeIcon icon={faSquareCheck} size="lg" />
-                            </IconButton>
-                          </Tooltip>
-                          <Tooltip content="Unselect All">
-                            <IconButton
-                              ariaLabel="UnSelect all"
-                              variant="outline_bg"
-                              size="xs"
-                              onClick={() => reset()}
-                            >
-                              <FontAwesomeIcon icon={faSquareXmark} size="lg" />
-                            </IconButton>
-                          </Tooltip>
-                        </div>
-                      </div>
-                      {!isSecretsLoading && !secrets?.secrets?.length && (
-                        <EmptyState title="No secrets found" icon={faKey} />
-                      )}
-                      <div className="thin-scrollbar grid max-h-64 grid-cols-2 gap-4 overflow-auto ">
-                        {isSecretsLoading &&
-                          Array.apply(0, Array(2)).map((_x, i) => (
-                            <Skeleton
-                              key={`secret-pull-loading-${i + 1}`}
-                              className="bg-mineshaft-700"
-                            />
-                          ))}
-
-                        {secrets?.secrets
-                          ?.filter(({ key }) =>
-                            key.toLowerCase().includes(searchFilter.toLowerCase())
-                          )
-                          ?.map(({ _id, key, value: secVal }) => (
-                            <Controller
-                              key={`pull-secret--${_id}`}
-                              control={control}
-                              name={`secrets.${key}`}
-                              render={({ field: { value, onChange } }) => (
-                                <Checkbox
-                                  id={`pull-secret-${_id}`}
-                                  isChecked={Boolean(value)}
-                                  onCheckedChange={(isChecked) => onChange(isChecked ? secVal : "")}
-                                >
-                                  {key}
-                                </Checkbox>
-                              )}
-                            />
-                          ))}
-                      </div>
-                      <div className="mt-6 mb-4">
-                        <Checkbox
-                          id="populate-include-value"
-                          isChecked={shouldIncludeValues}
-                          onCheckedChange={(isChecked) =>
-                            setShouldIncludeValues(isChecked as boolean)
-                          }
-                        >
-                          Include secret values
-                        </Checkbox>
-                      </div>
-                      <div className="flex items-center space-x-2">
-                        <Button
-                          leftIcon={<FontAwesomeIcon icon={faClone} />}
-                          type="submit"
-                          isDisabled={!isDirty}
-                        >
-                          Paste Secrets
-                        </Button>
-                        <Button variant="plain" colorSchema="secondary">
-                          Cancel
-                        </Button>
-                      </div>
-                    </div>
-                  </form>
-                </ModalContent>
-              </Modal>
-              {!isSmaller && (
-                <ProjectPermissionCan
-                  I={ProjectPermissionActions.Create}
-                  a={subject(ProjectPermissionSub.Secrets, { environment, secretPath })}
-                >
-                  {(isAllowed) => (
-                    <Button variant="star" onClick={onAddNewSecret} isDisabled={!isAllowed}>
-                      Add a new secret
-                    </Button>
-                  )}
-                </ProjectPermissionCan>
-              )}
-            </div>
-          </div>
-        </form>
-      )}
-    </div>
-  );
-};

frontend/src/views/DashboardPage/components/SecretImportForm/SecretImportForm.tsx

@@ -1,86 +0,0 @@
-import { Controller, useForm } from "react-hook-form";
-import { yupResolver } from "@hookform/resolvers/yup";
-import * as yup from "yup";
-
-import { Button, FormControl, Input, ModalClose, Select, SelectItem } from "@app/components/v2";
-
-type Props = {
-  onCreate: (environment: string, secretPath: string) => Promise<void>;
-  environments?: Array<{ slug: string; name: string }>;
-};
-
-const formSchema = yup.object({
-  environment: yup.string().required().label("Environment").trim(),
-  secretPath: yup
-    .string()
-    .required()
-    .label("Secret Path")
-    .trim()
-    .transform((val) =>
-      typeof val === "string" && val.at(-1) === "/" && val.length > 1 ? val.slice(0, -1) : val
-    )
-});
-
-type TFormData = yup.InferType<typeof formSchema>;
-
-export const SecretImportForm = ({ onCreate, environments = [] }: Props): JSX.Element => {
-  const {
-    control,
-    reset,
-    formState: { isSubmitting },
-    handleSubmit
-  } = useForm<TFormData>({
-    resolver: yupResolver(formSchema)
-  });
-
-  const onSubmit = async ({ environment, secretPath }: TFormData) => {
-    await onCreate(environment, secretPath);
-    reset();
-  };
-
-  return (
-    <form onSubmit={handleSubmit(onSubmit)}>
-      <Controller
-        control={control}
-        name="environment"
-        defaultValue={environments?.[0]?.slug}
-        render={({ field: { onChange, ...field }, fieldState: { error } }) => (
-          <FormControl label="Environment" errorText={error?.message} isError={Boolean(error)}>
-            <Select
-              defaultValue={field.value}
-              {...field}
-              onValueChange={(e) => onChange(e)}
-              className="w-full"
-            >
-              {environments.map(({ name, slug }) => (
-                <SelectItem value={slug} key={slug}>
-                  {name}
-                </SelectItem>
-              ))}
-            </Select>
-          </FormControl>
-        )}
-      />
-      <Controller
-        control={control}
-        name="secretPath"
-        defaultValue="/"
-        render={({ field, fieldState: { error } }) => (
-          <FormControl label="Secret Path" isError={Boolean(error)} errorText={error?.message}>
-            <Input {...field} />
-          </FormControl>
-        )}
-      />
-      <div className="mt-8 flex items-center">
-        <Button className="mr-4" type="submit" isDisabled={isSubmitting} isLoading={isSubmitting}>
-          Create
-        </Button>
-        <ModalClose asChild>
-          <Button variant="plain" colorSchema="secondary">
-            Cancel
-          </Button>
-        </ModalClose>
-      </div>
-    </form>
-  );
-};

frontend/src/views/DashboardPage/components/SecretImportForm/index.tsx

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

frontend/src/views/DashboardPage/components/SecretImportSection/SecretImportItem.tsx

@@ -1,200 +0,0 @@
-import { useEffect } from "react";
-import { subject } from "@casl/ability";
-import { useSortable } from "@dnd-kit/sortable";
-import {
-  faFileImport,
-  faFolder,
-  faKey,
-  faUpDown,
-  faXmark
-} from "@fortawesome/free-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-
-import { ProjectPermissionCan } from "@app/components/permissions";
-import { EmptyState, IconButton, SecretInput, TableContainer, Tooltip } from "@app/components/v2";
-import { ProjectPermissionActions, ProjectPermissionSub, useWorkspace } from "@app/context";
-import { useToggle } from "@app/hooks";
-
-type Props = {
-  onDelete: (environment: string, secretPath: string) => void;
-  environment: string;
-  secretPath: string;
-  importedEnv: string;
-  importedSecPath: string;
-  importedSecrets: { key: string; value: string; overriden: { env: string; secretPath: string } }[];
-  searchTerm: string;
-};
-
-// to show the environment and folder icon
-export const EnvFolderIcon = ({ env, secretPath }: { env: string; secretPath: string }) => (
-  <div className="inline-flex items-center space-x-2">
-    <div style={{ minWidth: "96px" }}>{env || "-"}</div>
-    {secretPath && (
-      <div className="inline-flex items-center space-x-2 border-l border-mineshaft-600 pl-2">
-        <FontAwesomeIcon icon={faFolder} className="text-green-700 text-md" />
-        <span>{secretPath}</span>
-      </div>
-    )}
-  </div>
-);
-
-export const SecretImportItem = ({
-  importedEnv,
-  importedSecPath,
-  onDelete,
-  importedSecrets = [],
-  searchTerm = "",
-  secretPath,
-  environment
-}: Props) => {
-  const [isExpanded, setIsExpanded] = useToggle();
-  const { attributes, listeners, transform, transition, setNodeRef, isDragging } = useSortable({
-    id: `${importedEnv}-${importedSecPath}`
-  });
-  const { currentWorkspace } = useWorkspace();
-  const rowEnv = currentWorkspace?.environments?.find(({ slug }) => slug === importedEnv);
-
-  useEffect(() => {
-    const filteredSecrets = importedSecrets.filter((secret) =>
-      secret.key.toUpperCase().includes(searchTerm.toUpperCase())
-    );
-
-    if (filteredSecrets.length > 0 && searchTerm) {
-      setIsExpanded.on();
-    } else {
-      setIsExpanded.off();
-    }
-  }, [searchTerm]);
-
-  useEffect(() => {
-    if (isDragging) {
-      setIsExpanded.off();
-    }
-  }, [isDragging]);
-
-  const style = {
-    transform: transform ? `translateY(${transform.y ? Math.round(transform.y) : 0}px)` : "",
-    transition
-  };
-
-  return (
-    <>
-      <tr
-        ref={setNodeRef}
-        style={style}
-        className="group flex cursor-default flex-row items-center hover:bg-mineshaft-700"
-        onClick={() => setIsExpanded.toggle()}
-      >
-        <td
-          className={`ml-0.5 flex h-10 w-10 items-center justify-center border-none px-4 ${
-            isExpanded && "border-t-2 border-mineshaft-500"
-          }`}
-        >
-          <Tooltip content="Secret Import" className="capitalize">
-            <FontAwesomeIcon icon={faFileImport} className="text-green-700" />
-          </Tooltip>
-        </td>
-        <td
-          colSpan={2}
-          className="relative flex w-full min-w-[220px] items-center justify-between overflow-hidden text-ellipsis lg:min-w-[240px] xl:min-w-[280px]"
-          style={{ paddingTop: "0", paddingBottom: "0" }}
-        >
-          <div className="flex-grow p-2">
-            <EnvFolderIcon env={rowEnv?.name || ""} secretPath={importedSecPath} />
-          </div>
-          <div className="duration-0 flex h-10 w-16 items-center justify-end space-x-2.5 overflow-hidden border-l border-mineshaft-600 transition-all">
-            <div className="opacity-0 group-hover:opacity-100">
-              <Tooltip content="Change Order" className="capitalize">
-                <IconButton
-                  size="md"
-                  colorSchema="primary"
-                  variant="plain"
-                  ariaLabel="expand"
-                  {...attributes}
-                  {...listeners}
-                >
-                  <FontAwesomeIcon icon={faUpDown} size="lg" />
-                </IconButton>
-              </Tooltip>
-            </div>
-            <ProjectPermissionCan
-              I={ProjectPermissionActions.Delete}
-              a={subject(ProjectPermissionSub.Secrets, { environment, secretPath })}
-            >
-              {(isAllowed) => (
-                <div className="opacity-0 group-hover:opacity-100">
-                  <Tooltip content="Delete" className="capitalize">
-                    <IconButton
-                      size="md"
-                      variant="plain"
-                      colorSchema="danger"
-                      ariaLabel="delete"
-                      isDisabled={!isAllowed}
-                      onClick={(evt) => {
-                        evt.stopPropagation();
-                        onDelete(importedEnv, importedSecPath);
-                      }}
-                    >
-                      <FontAwesomeIcon icon={faXmark} size="lg" />
-                    </IconButton>
-                  </Tooltip>
-                </div>
-              )}
-            </ProjectPermissionCan>
-          </div>
-        </td>
-      </tr>
-      <tr>
-        {isExpanded && !isDragging && (
-          <td
-            colSpan={3}
-            className={`bg-bunker-800 ${isExpanded && "border-b-2 border-mineshaft-500"}`}
-          >
-            <div className="rounded-md bg-bunker-700 p-1">
-              <TableContainer>
-                <table className="secret-table">
-                  <thead>
-                    <tr>
-                      <td style={{ padding: "0.25rem 1rem" }}>Key</td>
-                      <td style={{ padding: "0.25rem 1rem" }}>Value</td>
-                      <td style={{ padding: "0.25rem 1rem" }}>Override</td>
-                    </tr>
-                  </thead>
-                  <tbody>
-                    {importedSecrets?.length === 0 && (
-                      <tr>
-                        <td colSpan={3}>
-                          <EmptyState title="No secrets found" icon={faKey} />
-                        </td>
-                      </tr>
-                    )}
-                    {importedSecrets
-                      .filter((secret) =>
-                        secret.key.toUpperCase().includes(searchTerm.toUpperCase())
-                      )
-                      .map(({ key, value, overriden }, index) => (
-                        <tr key={`${importedEnv}-${importedSecPath}-${key}-${index + 1}`}>
-                          <td className="h-10" style={{ padding: "0.25rem 1rem" }}>
-                            {key}
-                          </td>
-                          <td className="h-10" style={{ padding: "0.25rem 1rem" }}>
-                            <SecretInput value={value} isDisabled isVisible />
-                          </td>
-                          <td className="h-10" style={{ padding: "0.25rem 1rem" }}>
-                            <EnvFolderIcon
-                              env={overriden?.env}
-                              secretPath={overriden?.secretPath}
-                            />
-                          </td>
-                        </tr>
-                      ))}
-                  </tbody>
-                </table>
-              </TableContainer>
-            </div>
-          </td>
-        )}
-      </tr>
-    </>
-  );
-};

frontend/src/views/DashboardPage/components/SecretImportSection/SecretImportSection.tsx

@@ -1,107 +0,0 @@
-import { memo } from "react";
-import { SortableContext, verticalListSortingStrategy } from "@dnd-kit/sortable";
-
-import { useWorkspace } from "@app/context";
-import { DecryptedSecret } from "@app/hooks/api/secrets/types";
-
-import { SecretImportItem } from "./SecretImportItem";
-
-type TImportedSecrets = Array<{
-  environment: string;
-  secretPath: string;
-  folderId: string;
-  secrets: DecryptedSecret[];
-}>;
-
-const SECRET_IN_DASHBOARD = "Present In Dashboard";
-
-export const computeImportedSecretRows = (
-  importedSecEnv: string,
-  importedSecPath: string,
-  importSecrets: TImportedSecrets = [],
-  secrets: DecryptedSecret[] = [],
-  environments: { name: string; slug: string }[] = []
-) => {
-  const importedSecIndex = importSecrets.findIndex(
-    ({ secretPath, environment }) =>
-      secretPath === importedSecPath && importedSecEnv === environment
-  );
-  if (importedSecIndex === -1) return [];
-
-  const importedSec = importSecrets[importedSecIndex];
-
-  const overridenSec: Record<string, { env: string; secretPath: string }> = {};
-  const envSlug2Name: Record<string, string> = {};
-  environments.forEach((el) => {
-    envSlug2Name[el.slug] = el.name;
-  });
-
-  for (let i = importedSecIndex + 1; i < importSecrets.length; i += 1) {
-    importSecrets[i].secrets.forEach((el) => {
-      overridenSec[el.key] = {
-        env: envSlug2Name?.[importSecrets[i].environment] || "unknown",
-        secretPath: importSecrets[i].secretPath
-      };
-    });
-  }
-
-  secrets.forEach((el) => {
-    overridenSec[el.key] = { env: SECRET_IN_DASHBOARD, secretPath: "" };
-  });
-
-  return importedSec.secrets.map(({ key, value }) => ({
-    key,
-    value,
-    overriden: overridenSec?.[key]
-  }));
-};
-
-type Props = {
-  secrets?: DecryptedSecret[];
-  importedSecrets?: TImportedSecrets;
-  environment: string;
-  secretPath: string;
-  onSecretImportDelete: (env: string, secPath: string) => void;
-  items: { id: string; environment: string; secretPath: string }[];
-  searchTerm: string;
-};
-
-export const SecretImportSection = memo(
-  ({
-    secrets = [],
-    environment,
-    secretPath,
-    importedSecrets = [],
-    onSecretImportDelete,
-    items = [],
-    searchTerm = ""
-  }: Props) => {
-    const { currentWorkspace } = useWorkspace();
-    const environments = currentWorkspace?.environments || [];
-
-    return (
-      <SortableContext items={items} strategy={verticalListSortingStrategy}>
-        {items.map(({ secretPath: impSecPath, environment: importSecEnv, id }) => (
-          <SecretImportItem
-            key={id}
-            importedEnv={importSecEnv}
-            importedSecrets={computeImportedSecretRows(
-              importSecEnv,
-              impSecPath,
-              importedSecrets,
-              secrets,
-              environments
-            )}
-            secretPath={secretPath}
-            environment={environment}
-            onDelete={onSecretImportDelete}
-            importedSecPath={impSecPath}
-            searchTerm={searchTerm}
-          />
-        ))}
-      </SortableContext>
-    );
-  }
-);
-
-SecretImportSection.displayName = "SecretImportSection";

frontend/src/views/DashboardPage/components/SecretImportSection/index.tsx

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

frontend/src/views/DashboardPage/components/SecretInputRow/SecretInputRow.tsx

@@ -1,525 +0,0 @@
-/* eslint-disable react/jsx-no-useless-fragment */
-import { memo, useEffect, useRef, useState } from "react";
-import {
-  Control,
-  Controller,
-  useFieldArray,
-  UseFormRegister,
-  UseFormSetValue,
-  useWatch
-} from "react-hook-form";
-import { subject } from "@casl/ability";
-import {
-  faCheck,
-  faCodeBranch,
-  faComment,
-  faCopy,
-  faEllipsis,
-  faInfoCircle,
-  faTags,
-  faXmark
-} from "@fortawesome/free-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { cx } from "cva";
-import { twMerge } from "tailwind-merge";
-
-// TODO:(akhilmhdh): Refactor this
-import AddTagPopoverContent from "@app/components/AddTagPopoverContent/AddTagPopoverContent";
-import { ProjectPermissionCan } from "@app/components/permissions";
-import {
-  FormControl,
-  HoverCard,
-  HoverCardContent,
-  HoverCardTrigger,
-  IconButton,
-  Input,
-  Popover,
-  PopoverContent,
-  PopoverTrigger,
-  SecretInput,
-  Tag,
-  TextArea,
-  Tooltip
-} from "@app/components/v2";
-import { ProjectPermissionActions, ProjectPermissionSub } from "@app/context";
-import { useToggle } from "@app/hooks";
-import { WsTag } from "@app/hooks/api/types";
-
-import { FormData, SecretActionType } from "../../DashboardPage.utils";
-
-type Props = {
-  index: number;
-  environment: string;
-  secretPath: string;
-  // backend generated unique id
-  secUniqId?: string;
-  // permission and external state's that decided to hide or show
-  isReadOnly?: boolean;
-  isAddOnly?: boolean;
-  isRollbackMode?: boolean;
-  isSecretValueHidden: boolean;
-  searchTerm: string;
-  // to record the ids of deleted ones
-  onSecretDelete: (index: number, secretName: string, id?: string, overrideId?: string) => void;
-  // sidebar control props
-  onRowExpand: (secId: string | undefined, index: number) => void;
-  // tag props
-  wsTags?: WsTag[];
-  onCreateTagOpen: () => void;
-  // rhf specific functions, dont put this using useFormContext. This is passed as props to avoid re-rendering
-  control: Control<FormData>;
-  register: UseFormRegister<FormData>;
-  setValue: UseFormSetValue<FormData>;
-  isKeyError?: boolean;
-  keyError?: string;
-  autoCapitalization?: boolean;
-};
-
-export const SecretInputRow = memo(
-  ({
-    index,
-    secretPath,
-    environment,
-    isSecretValueHidden,
-    onRowExpand,
-    isReadOnly,
-    isRollbackMode,
-    isAddOnly,
-    wsTags,
-    onCreateTagOpen,
-    onSecretDelete,
-    searchTerm,
-    control,
-    register,
-    setValue,
-    isKeyError,
-    keyError,
-    secUniqId,
-    autoCapitalization
-  }: Props): JSX.Element => {
-    const isKeySubDisabled = useRef<boolean>(false);
-    // comment management in a row
-    const {
-      fields: secretTags,
-      remove,
-      append
-    } = useFieldArray({ control, name: `secrets.${index}.tags` });
-
-    // display the tags in alphabetical order
-    secretTags.sort((a, b) => a?.name?.localeCompare(b?.name));
-
-    // to get details on a secret
-    const overrideAction = useWatch({
-      control,
-      name: `secrets.${index}.overrideAction`,
-      exact: true
-    });
-    const idOverride = useWatch({ control, name: `secrets.${index}.idOverride`, exact: true });
-    const secComment = useWatch({ control, name: `secrets.${index}.comment`, exact: true });
-    const hasComment = Boolean(secComment);
-    const secKey = useWatch({
-      control,
-      name: `secrets.${index}.key`,
-      disabled: isKeySubDisabled.current,
-      exact: true
-    });
-    const secValue = useWatch({
-      control,
-      name: `secrets.${index}.value`,
-      disabled: isKeySubDisabled.current,
-      exact: true
-    });
-    const secValueOverride = useWatch({
-      control,
-      name: `secrets.${index}.valueOverride`,
-      disabled: isKeySubDisabled.current,
-      exact: true
-    });
-    // when secret is override by personal values
-    const isOverridden =
-      overrideAction === SecretActionType.Created || overrideAction === SecretActionType.Modified;
-    const [hoveredTag, setHoveredTag] = useState<WsTag | null>(null);
-
-    const handleTagOnMouseEnter = (wsTag: WsTag) => {
-      setHoveredTag(wsTag);
-    };
-
-    const handleTagOnMouseLeave = () => {
-      setHoveredTag(null);
-    };
-
-    const checkIfTagIsVisible = (wsTag: WsTag) => wsTag._id === hoveredTag?._id;
-
-    const secId = useWatch({ control, name: `secrets.${index}._id`, exact: true });
-    const tags =
-      useWatch({ control, name: `secrets.${index}.tags`, exact: true, defaultValue: [] }) || [];
-
-    const selectedTagIds = tags.reduce<Record<string, boolean>>(
-      (prev, curr) => ({ ...prev, [curr.slug]: true }),
-      {}
-    );
-
-    const [isSecValueCopied, setIsSecValueCopied] = useToggle(false);
-
-    useEffect(() => {
-      let timer: NodeJS.Timeout;
-      if (isSecValueCopied) {
-        timer = setTimeout(() => setIsSecValueCopied.off(), 2000);
-      }
-      return () => clearTimeout(timer);
-    }, [isSecValueCopied]);
-
-    const copyTokenToClipboard = () => {
-      navigator.clipboard.writeText((secValueOverride || secValue) as string);
-      setIsSecValueCopied.on();
-    };
-
-    const onSecretOverride = () => {
-      if (isOverridden) {
-        // when user created a new override but then removes
-        if (overrideAction === SecretActionType.Created)
-          setValue(`secrets.${index}.valueOverride`, "");
-        setValue(`secrets.${index}.overrideAction`, SecretActionType.Deleted, {
-          shouldDirty: true
-        });
-      } else {
-        setValue(`secrets.${index}.valueOverride`, "");
-        setValue(
-          `secrets.${index}.overrideAction`,
-          idOverride ? SecretActionType.Modified : SecretActionType.Created,
-          { shouldDirty: true }
-        );
-      }
-    };
-
-    const onSelectTag = (selectedTag: WsTag) => {
-      const shouldAppend = !selectedTagIds[selectedTag.slug];
-      if (shouldAppend) {
-        const { _id: id, name, slug, tagColor } = selectedTag;
-        append({ _id: id, name, slug, tagColor });
-      } else {
-        const pos = tags.findIndex(({ slug }: { slug: string }) => selectedTag.slug === slug);
-        remove(pos);
-      }
-    };
-    const isCreatedSecret = !secId;
-    const shouldBeBlockedInAddOnly = !isCreatedSecret && isAddOnly;
-
-    // Why this instead of filter in parent
-    // Because rhf field.map has default values so basically
-    // keys are not updated there and index needs to kept so that we can monitor
-    // values individually here
-    if (
-      !(
-        secKey?.toUpperCase().includes(searchTerm?.toUpperCase()) ||
-        tags
-          ?.map((tag) => tag.name)
-          .join(" ")
-          ?.toUpperCase()
-          .includes(searchTerm?.toUpperCase()) ||
-        secComment?.toUpperCase().includes(searchTerm?.toUpperCase())
-      )
-    ) {
-      return <></>;
-    }
-
-    return (
-      <tr className="group flex flex-row hover:bg-mineshaft-700" key={index}>
-        <td className="flex h-10 w-10 items-center justify-center border-none px-4">
-          <div className="w-10 text-center text-xs text-bunker-400">{index + 1}</div>
-        </td>
-        <Controller
-          control={control}
-          defaultValue=""
-          name={`secrets.${index}.key`}
-          render={({ field }) => (
-            <HoverCard openDelay={0} open={isKeyError ? undefined : false}>
-              <HoverCardTrigger asChild>
-                <td className={cx(isKeyError ? "rounded ring ring-red/50" : null)}>
-                  <div className="relative flex w-full min-w-[220px] items-center justify-end lg:min-w-[240px] xl:min-w-[280px]">
-                    <Input
-                      autoComplete="off"
-                      onFocus={() => {
-                        isKeySubDisabled.current = true;
-                      }}
-                      variant="plain"
-                      isDisabled={isReadOnly || shouldBeBlockedInAddOnly || isRollbackMode}
-                      className="w-full focus:text-bunker-100 focus:ring-transparent"
-                      {...field}
-                      onBlur={() => {
-                        isKeySubDisabled.current = false;
-                        field.onBlur();
-                      }}
-                      autoCapitalization={autoCapitalization}
-                    />
-                  </div>
-                </td>
-              </HoverCardTrigger>
-              <HoverCardContent className="w-auto py-2 pt-2">
-                <div className="flex items-center space-x-2">
-                  <div>
-                    <FontAwesomeIcon icon={faInfoCircle} className="text-red" />
-                  </div>
-                  <div className="text-sm">{keyError}</div>
-                </div>
-              </HoverCardContent>
-            </HoverCard>
-          )}
-        />
-        <td
-          className="flex w-full flex-grow flex-row border-r border-none border-red"
-          style={{ padding: "0.5rem 0 0.5rem 1rem" }}
-        >
-          <div className="w-full flex items-center">
-            {isOverridden ? (
-              <Controller
-                control={control}
-                key={`secrets.${index}.valueOverride`}
-                name={`secrets.${index}.valueOverride`}
-                render={({ field }) => (
-                  <SecretInput
-                    key={`secrets.${index}.valueOverride`}
-                    isDisabled={
-                      isReadOnly ||
-                      isRollbackMode ||
-                      (isOverridden ? isAddOnly : shouldBeBlockedInAddOnly)
-                    }
-                    isVisible={!isSecretValueHidden}
-                    {...field}
-                  />
-                )}
-              />
-            ) : (
-              <Controller
-                control={control}
-                key={`secrets.${index}.value`}
-                name={`secrets.${index}.value`}
-                render={({ field }) => (
-                  <SecretInput
-                    key={`secrets.${index}.value`}
-                    isVisible={!isSecretValueHidden}
-                    isDisabled={
-                      isReadOnly ||
-                      isRollbackMode ||
-                      (isOverridden ? isAddOnly : shouldBeBlockedInAddOnly)
-                    }
-                    {...field}
-                  />
-                )}
-              />
-            )}
-          </div>
-        </td>
-        <td className="min-w-sm flex">
-          <div className="flex h-8 items-center pl-2">
-            {secretTags.map(({ id, slug, tagColor }) => {
-              return (
-                <>
-                  <Popover>
-                    <PopoverTrigger asChild>
-                      <div>
-                        <Tag
-                          // isDisabled={isReadOnly || isAddOnly || isRollbackMode}
-                          // onClose={() => remove(i)}
-                          key={id}
-                          className="cursor-pointer"
-                        >
-                          <div className="rounded-full border-mineshaft-500 bg-transparent flex items-center  gap-1.5 justify-around">
-                            <div
-                              className="w-[10px] h-[10px] rounded-full"
-                              style={{ background: tagColor || "#bec2c8" }}
-                            />
-                            {slug}
-                          </div>
-                        </Tag>
-                      </div>
-                    </PopoverTrigger>
-                    <AddTagPopoverContent
-                      wsTags={wsTags}
-                      secKey={secKey || "this secret"}
-                      selectedTagIds={selectedTagIds}
-                      handleSelectTag={(wsTag: WsTag) => onSelectTag(wsTag)}
-                      handleTagOnMouseEnter={(wsTag: WsTag) => handleTagOnMouseEnter(wsTag)}
-                      handleTagOnMouseLeave={() => handleTagOnMouseLeave()}
-                      checkIfTagIsVisible={(wsTag: WsTag) => checkIfTagIsVisible(wsTag)}
-                      handleOnCreateTagOpen={() => onCreateTagOpen()}
-                    />
-                  </Popover>
-                </>
-              );
-            })}
-            <div className="w-0 overflow-hidden group-hover:w-6">
-              <Tooltip content="Copy value">
-                <IconButton
-                  variant="plain"
-                  size="md"
-                  ariaLabel="add-tag"
-                  className="py-[0.42rem]"
-                  onClick={copyTokenToClipboard}
-                >
-                  <FontAwesomeIcon icon={isSecValueCopied ? faCheck : faCopy} />
-                </IconButton>
-              </Tooltip>
-            </div>
-            {!(isReadOnly || isAddOnly || isRollbackMode) && (
-              <div className="duration-0 ml-1 overflow-hidden">
-                <Popover>
-                  <PopoverTrigger asChild>
-                    <div className="w-0 group-hover:w-6 data-[state=open]:w-6">
-                      <ProjectPermissionCan
-                        renderTooltip
-                        allowedLabel="Add Tags"
-                        I={ProjectPermissionActions.Edit}
-                        a={subject(ProjectPermissionSub.Secrets, { environment, secretPath })}
-                      >
-                        {(isAllowed) => (
-                          <IconButton
-                            isDisabled={!isAllowed}
-                            variant="plain"
-                            size="md"
-                            ariaLabel="add-tags"
-                            className="py-[0.42rem]"
-                          >
-                            <FontAwesomeIcon icon={faTags} />
-                          </IconButton>
-                        )}
-                      </ProjectPermissionCan>
-                    </div>
-                  </PopoverTrigger>
-                  <AddTagPopoverContent
-                    wsTags={wsTags}
-                    secKey={secKey || "this secret"}
-                    selectedTagIds={selectedTagIds}
-                    handleSelectTag={(wsTag: WsTag) => onSelectTag(wsTag)}
-                    handleTagOnMouseEnter={(wsTag: WsTag) => handleTagOnMouseEnter(wsTag)}
-                    handleTagOnMouseLeave={() => handleTagOnMouseLeave()}
-                    checkIfTagIsVisible={(wsTag: WsTag) => checkIfTagIsVisible(wsTag)}
-                    handleOnCreateTagOpen={() => onCreateTagOpen()}
-                  />
-                </Popover>
-              </div>
-            )}
-          </div>
-          <div className="flex h-8 flex-row items-center pr-2">
-            {!isAddOnly && (
-              <div>
-                <ProjectPermissionCan
-                  renderTooltip
-                  allowedLabel="Override with a personal value"
-                  I={ProjectPermissionActions.Edit}
-                  a={subject(ProjectPermissionSub.Secrets, { environment, secretPath })}
-                >
-                  {(isAllowed) => (
-                    <IconButton
-                      variant="plain"
-                      className={twMerge(
-                        "mt-0.5 w-0 overflow-hidden p-0 group-hover:ml-1 group-hover:w-7",
-                        isOverridden && "ml-1 w-7 text-primary"
-                      )}
-                      onClick={onSecretOverride}
-                      size="md"
-                      isDisabled={isRollbackMode || isReadOnly || !isAllowed}
-                      ariaLabel="info"
-                    >
-                      <div className="flex items-center space-x-1">
-                        <FontAwesomeIcon icon={faCodeBranch} className="text-base" />
-                      </div>
-                    </IconButton>
-                  )}
-                </ProjectPermissionCan>
-              </div>
-            )}
-            <div className="mt-0.5 overflow-hidden ">
-              <Popover>
-                <PopoverTrigger asChild>
-                  <div>
-                    <ProjectPermissionCan
-                      renderTooltip
-                      allowedLabel="Comment"
-                      I={ProjectPermissionActions.Edit}
-                      a={subject(ProjectPermissionSub.Secrets, { environment, secretPath })}
-                    >
-                      {(isAllowed) => (
-                        <IconButton
-                          className={twMerge(
-                            "w-7 overflow-hidden p-0",
-                            "w-0 group-hover:w-7 data-[state=open]:w-7",
-                            hasComment ? "w-7 text-primary" : "group-hover:w-7"
-                          )}
-                          isDisabled={!isAllowed}
-                          variant="plain"
-                          size="md"
-                          ariaLabel="add-comment"
-                        >
-                          <FontAwesomeIcon icon={faComment} />
-                        </IconButton>
-                      )}
-                    </ProjectPermissionCan>
-                  </div>
-                </PopoverTrigger>
-                <PopoverContent
-                  className="w-auto border border-mineshaft-600 bg-mineshaft-800 p-2 drop-shadow-2xl"
-                  sticky="always"
-                >
-                  <FormControl label="Comment" className="mb-0">
-                    <TextArea
-                      isDisabled={isReadOnly || isRollbackMode || shouldBeBlockedInAddOnly}
-                      className="border border-mineshaft-600 text-sm"
-                      {...register(`secrets.${index}.comment`)}
-                      rows={8}
-                      cols={30}
-                    />
-                  </FormControl>
-                </PopoverContent>
-              </Popover>
-            </div>
-          </div>
-          <div className="duration-0 flex w-16 justify-center overflow-hidden border-l border-mineshaft-600 pl-2 transition-all">
-            <div className="flex h-8 items-center space-x-2.5">
-              {!isAddOnly && (
-                <div className="opacity-0 group-hover:opacity-100">
-                  <Tooltip content="Settings">
-                    <IconButton
-                      size="lg"
-                      colorSchema="primary"
-                      variant="plain"
-                      onClick={() => onRowExpand(secUniqId, index)}
-                      ariaLabel="expand"
-                    >
-                      <FontAwesomeIcon icon={faEllipsis} />
-                    </IconButton>
-                  </Tooltip>
-                </div>
-              )}
-              <div className="opacity-0 group-hover:opacity-100">
-                <ProjectPermissionCan
-                  I={ProjectPermissionActions.Delete}
-                  a={subject(ProjectPermissionSub.Secrets, { environment, secretPath })}
-                  renderTooltip
-                  allowedLabel="Delete"
-                >
-                  {(isAllowed) => (
-                    <IconButton
-                      size="lg"
-                      variant="plain"
-                      colorSchema="danger"
-                      ariaLabel="delete"
-                      isDisabled={isReadOnly || isRollbackMode || !isAllowed}
-                      onClick={() => {
-                        onSecretDelete(index, secKey, secId, idOverride);
-                      }}
-                    >
-                      <FontAwesomeIcon icon={faXmark} />
-                    </IconButton>
-                  )}
-                </ProjectPermissionCan>
-              </div>
-            </div>
-          </div>
-        </td>
-      </tr>
-    );
-  }
-);
-
-SecretInputRow.displayName = "SecretInputRow";

frontend/src/views/DashboardPage/components/SecretInputRow/index.tsx

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

frontend/src/views/DashboardPage/components/SecretTableHeader/SecretTableHeader.tsx

@@ -1,36 +0,0 @@
-import { faArrowDown, faArrowUp } from "@fortawesome/free-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-
-import { IconButton } from "@app/components/v2";
-
-type Props = {
-  sortDir: "asc" | "desc";
-  onSort: () => void;
-};
-
-export const SecretTableHeader = ({ sortDir, onSort }: Props): JSX.Element => (
-  <thead className="sticky top-0 z-50 bg-mineshaft-800">
-    <tr className="top-0 flex flex-row">
-      <td className="flex w-10 items-center justify-center border-none px-4">
-        <div className="w-10 text-center text-xs text-transparent">{0}</div>
-      </td>
-      <td className="flex items-center">
-        <div className="relative flex w-full min-w-[220px] items-center justify-start pl-2.5 lg:min-w-[240px] xl:min-w-[280px]">
-          <div className="text-md inline-flex items-end font-medium">
-            Key
-            <IconButton variant="plain" className="ml-2" ariaLabel="sort" onClick={onSort}>
-              <FontAwesomeIcon icon={sortDir === "asc" ? faArrowDown : faArrowUp} />
-            </IconButton>
-          </div>
-          <div className="flex w-max flex-row items-center justify-end">
-            <div className="mt-1 w-5 overflow-hidden group-hover:w-5" />
-          </div>
-        </div>
-      </td>
-      <th className="flex w-full flex-row">
-        <div className="text-sm font-medium">Value</div>
-      </th>
-    </tr>
-    <tr className="h-0 w-full border border-mineshaft-600" />
-  </thead>
-);

frontend/src/views/DashboardPage/components/SecretTableHeader/index.tsx

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

frontend/src/views/DashboardPage/index.tsx

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

frontend/src/views/SecretApprovalPage/SecretApprovalPage.tsx

@@ -0,0 +1,31 @@
+import { Tab, TabList, TabPanel, Tabs } from "@app/components/v2";
+import { useWorkspace } from "@app/context";
+
+import { SecretApprovalPolicyList } from "./components/SecretApprovalPolicyList";
+
+enum TabSection {
+  ApprovalRequests = "approval-requests",
+  Rules = "approval-rules"
+}
+
+export const SecretApprovalPage = () => {
+  const { currentWorkspace } = useWorkspace();
+  const workspaceId = currentWorkspace?._id || "";
+
+  return (
+    <div className="container mx-auto bg-bunker-800 text-white w-full h-full">
+      <div className="my-6">
+        <p className="text-3xl font-semibold text-gray-200">Admin Panels</p>
+      </div>
+      <Tabs defaultValue={TabSection.ApprovalRequests}>
+        <TabList>
+          <Tab value={TabSection.ApprovalRequests}>Secret PRs</Tab>
+          <Tab value={TabSection.Rules}>Policies</Tab>
+        </TabList>
+        <TabPanel value={TabSection.Rules}>
+          <SecretApprovalPolicyList workspaceId={workspaceId} />
+        </TabPanel>
+      </Tabs>
+    </div>
+  );
+};