feat(PIT-revamp): snapshot changes for PIT revamp and add docs for new logic

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

@@ -282,7 +282,8 @@ export const useUpdateProject = () => {
       newProjectName,
       newProjectDescription,
       newSlug,
-      secretSharing
+      secretSharing,
+      showSnapshotsLegacy
     }) => {
       const { data } = await apiRequest.patch<{ workspace: Workspace }>(
         `/api/v1/workspace/${projectID}`,
@@ -290,7 +291,8 @@ export const useUpdateProject = () => {
           name: newProjectName,
           description: newProjectDescription,
           slug: newSlug,
-          secretSharing
+          secretSharing,
+          showSnapshotsLegacy
         }
       );
       return data.workspace;

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

@@ -39,6 +39,7 @@ export type Workspace = {
   roles?: TProjectRole[];
   hasDeleteProtection: boolean;
   secretSharing: boolean;
+  showSnapshotsLegacy: boolean;
 };
 
 export type WorkspaceEnv = {
@@ -79,6 +80,7 @@ export type UpdateProjectDTO = {
   newProjectDescription?: string;
   newSlug?: string;
   secretSharing?: boolean;
+  showSnapshotsLegacy?: boolean;
 };
 
 export type UpdatePitVersionLimitDTO = { projectSlug: string; pitVersionLimit: number };

frontend/src/pages/secret-manager/SecretDashboardPage/SecretDashboardPage.tsx

@@ -300,7 +300,7 @@ const Page = () => {
     isPaused: !canDoReadRollback
   });
 
-  const isPITEnabled = true;
+  const isPITEnabled = !currentWorkspace?.showSnapshotsLegacy;
 
   const changesCount = useMemo(() => {
     return isPITEnabled ? folderCommitsCount : snapshotCount;

frontend/src/pages/secret-manager/SecretDashboardPage/components/SnapshotView/SnapshotView.tsx

@@ -5,7 +5,8 @@ import {
   faCodeCommit,
   faFolder,
   faMagnifyingGlass,
-  faUndo
+  faUndo,
+  faWarning
 } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 
@@ -60,6 +61,7 @@ export const SnapshotView = ({
 
   const rollingFolder = snapshotData?.folders || [];
   const rollingSecrets = snapshotData?.secrets || [];
+  const isAllowedRollback = false;
 
   const folderDiffView = useMemo(() => {
     const folderGroupById = folders.reduce<Record<string, TSecretFolder>>(
@@ -153,6 +155,16 @@ export const SnapshotView = ({
 
   return (
     <>
+      <div className="my-2 flex w-full flex-row items-center rounded-md border border-primary-600/70 bg-primary/[.07] p-4 text-base text-white">
+        <FontAwesomeIcon icon={faWarning} className="pr-6 text-4xl text-white/80" />
+        <div className="flex w-full flex-col text-sm">
+          <span className="mb-1 text-lg font-semibold">Deprecation Notice</span>
+          <p>
+            Snapshots are being deprecated in favor of Commits. They will be officially removed on
+            November 2025.
+          </p>
+        </div>
+      </div>
       <div className="flex items-center space-x-4">
         <h6 className="text-2xl">Snapshot</h6>
         <Tag colorSchema="green">{new Date(snapshotData?.createdAt || "").toLocaleString()}</Tag>
@@ -168,17 +180,19 @@ export const SnapshotView = ({
           />
         </div>
         <div className="flex-grow" />
-        <div>
-          <Button
-            variant="outline_bg"
-            onClick={onClickListSnapshot}
-            leftIcon={<FontAwesomeIcon icon={faCodeCommit} />}
-            className="h-10"
-            isDisabled={isRollingBack}
-          >
-            {snapshotCount} Commits
-          </Button>
-        </div>
+        {isAllowedRollback && (
+          <div>
+            <Button
+              variant="outline_bg"
+              onClick={onClickListSnapshot}
+              leftIcon={<FontAwesomeIcon icon={faCodeCommit} />}
+              className="h-10"
+              isDisabled={isRollingBack}
+            >
+              {snapshotCount} Commits
+            </Button>
+          </div>
+        )}
         <div>
           <Button
             onClick={onGoBack}
@@ -190,24 +204,26 @@ export const SnapshotView = ({
             Go Back
           </Button>
         </div>
-        <div>
-          <ProjectPermissionCan
-            I={ProjectPermissionActions.Create}
-            a={ProjectPermissionSub.SecretRollback}
-          >
-            {(isAllowed) => (
-              <Button
-                onClick={handleClickRollback}
-                isDisabled={isRollingBack || !isAllowed}
-                isLoading={isRollingBack}
-                leftIcon={<FontAwesomeIcon icon={faUndo} />}
-                className="h-10"
-              >
-                Rollback
-              </Button>
-            )}
-          </ProjectPermissionCan>
-        </div>
+        {isAllowedRollback && (
+          <div>
+            <ProjectPermissionCan
+              I={ProjectPermissionActions.Create}
+              a={ProjectPermissionSub.SecretRollback}
+            >
+              {(isAllowed) => (
+                <Button
+                  onClick={handleClickRollback}
+                  isDisabled={isRollingBack || !isAllowed}
+                  isLoading={isRollingBack}
+                  leftIcon={<FontAwesomeIcon icon={faUndo} />}
+                  className="h-10"
+                >
+                  Rollback
+                </Button>
+              )}
+            </ProjectPermissionCan>
+          </div>
+        )}
       </div>
       <div className="mt-4 rounded-md bg-mineshaft-800 text-left text-sm text-bunker-300">
         <div className="flex flex-col">

frontend/src/pages/secret-manager/SettingsPage/components/ProjectGeneralTab/ProjectGeneralTab.tsx

@@ -11,6 +11,7 @@ import { EnvironmentSection } from "../EnvironmentSection";
 import { PointInTimeVersionLimitSection } from "../PointInTimeVersionLimitSection";
 import { RebuildSecretIndicesSection } from "../RebuildSecretIndicesSection/RebuildSecretIndicesSection";
 import { SecretSharingSection } from "../SecretSharingSection";
+import { SecretSnapshotsLegacySection } from "../SecretSnapshotsLegacySection";
 import { SecretTagsSection } from "../SecretTagsSection";
 
 export const ProjectGeneralTab = () => {
@@ -24,6 +25,7 @@ export const ProjectGeneralTab = () => {
       {isSecretManager && <SecretTagsSection />}
       {isSecretManager && <AutoCapitalizationSection />}
       {isSecretManager && <SecretSharingSection />}
+      {isSecretManager && <SecretSnapshotsLegacySection />}
       {isSecretManager && <PointInTimeVersionLimitSection />}
       <AuditLogsRetentionSection />
       {isSecretManager && <BackfillSecretReferenceSecretion />}

frontend/src/pages/secret-manager/SettingsPage/components/SecretSnapshotsLegacySection/SecretSnapshotsLegacySection.tsx

@@ -0,0 +1,65 @@
+import { useState } from "react";
+
+import { createNotification } from "@app/components/notifications";
+import { ProjectPermissionCan } from "@app/components/permissions";
+import { Checkbox } from "@app/components/v2";
+import { ProjectPermissionActions, ProjectPermissionSub, useWorkspace } from "@app/context";
+import { useUpdateProject } from "@app/hooks/api/workspace/queries";
+
+export const SecretSnapshotsLegacySection = () => {
+  const { currentWorkspace } = useWorkspace();
+  const { mutateAsync: updateProject } = useUpdateProject();
+
+  const [isLoading, setIsLoading] = useState(false);
+
+  const handleToggle = async (state: boolean) => {
+    setIsLoading(true);
+
+    try {
+      if (!currentWorkspace?.id) {
+        setIsLoading(false);
+        return;
+      }
+
+      await updateProject({
+        projectID: currentWorkspace.id,
+        showSnapshotsLegacy: state
+      });
+
+      createNotification({
+        text: `Successfully ${state ? "enabled" : "disabled"} secret snapshots legacy for this project`,
+        type: "success"
+      });
+    } catch (err) {
+      console.error(err);
+      createNotification({
+        text: "Failed to update secret snapshots legacy for this project",
+        type: "error"
+      });
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  return (
+    <div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
+      <p className="mb-3 text-xl font-semibold">Show Secret Snapshots Legacy</p>
+      <ProjectPermissionCan I={ProjectPermissionActions.Edit} a={ProjectPermissionSub.Settings}>
+        {(isAllowed) => (
+          <div className="w-max">
+            <Checkbox
+              className="data-[state=checked]:bg-primary"
+              id="showSnapshotsLegacy"
+              isDisabled={!isAllowed || isLoading}
+              isChecked={currentWorkspace?.showSnapshotsLegacy ?? false}
+              onCheckedChange={(state) => handleToggle(state as boolean)}
+            >
+              This feature enables your project members to view secret snapshots in the legacy
+              format.
+            </Checkbox>
+          </div>
+        )}
+      </ProjectPermissionCan>
+    </div>
+  );
+};

frontend/src/pages/secret-manager/SettingsPage/components/SecretSnapshotsLegacySection/index.tsx

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