Merge pull request #1620 from Infisical/daniel/e2ee-button

Feat: Deprecate E2EE mode switching

frontend/src/components/v2/UpgradeProjectAlert/UpgradeProjectAlert.tsx

@@ -9,16 +9,22 @@ import { useNotificationContext } from "@app/components/context/Notifications/No
 import { useProjectPermission } from "@app/context";
 import { useGetUpgradeProjectStatus, useUpgradeProject } from "@app/hooks/api";
 import { Workspace } from "@app/hooks/api/types";
+import { workspaceKeys } from "@app/hooks/api/workspace/queries";
 import { ProjectVersion } from "@app/hooks/api/workspace/types";
+import { queryClient } from "@app/reactQuery";
 
 import { Button } from "../Button";
 import { Tooltip } from "../Tooltip";
 
 export type UpgradeProjectAlertProps = {
   project: Workspace;
+  transparent?: boolean;
 };
 
-export const UpgradeProjectAlert = ({ project }: UpgradeProjectAlertProps): JSX.Element | null => {
+export const UpgradeProjectAlert = ({
+  project,
+  transparent
+}: UpgradeProjectAlertProps): JSX.Element | null => {
   const { createNotification } = useNotificationContext();
   const router = useRouter();
   const { membership } = useProjectPermission();
@@ -48,6 +54,7 @@ export const UpgradeProjectAlert = ({ project }: UpgradeProjectAlertProps): JSX.
       }
 
       if (currentStatus !== null && data?.status === null) {
+        queryClient.invalidateQueries(workspaceKeys.getAllUserWorkspace);
         router.reload();
       }
     }
@@ -87,10 +94,25 @@ export const UpgradeProjectAlert = ({ project }: UpgradeProjectAlertProps): JSX.
 
   if (project.version !== ProjectVersion.V1) return null;
 
+  if (transparent) {
+    return (
+      <Button
+        colorSchema="primary"
+        variant="solid"
+        size="md"
+        isLoading={isLoading}
+        isDisabled={isLoading || membership.role !== "admin"}
+        onClick={onUpgradeProject}
+      >
+        Upgrade
+      </Button>
+    );
+  }
+
   return (
     <div
       className={twMerge(
-        "mt-4 flex w-full flex-row items-center rounded-md border border-primary-600/70 bg-primary/[.07] p-4 text-base text-white",
+        "mt-4 flex w-full flex-row items-center rounded-md border border-primary-600/70  bg-primary/[.07] p-4 text-base text-white",
         membership.role !== "admin" && "opacity-80"
       )}
     >

frontend/src/views/Settings/ProjectSettingsPage/components/E2EESection/E2EESection.tsx

@@ -1,121 +1,36 @@
-import { ProjectPermissionCan } from "@app/components/permissions";
-import {
-  decryptAssymmetric,
-  encryptAssymmetric
-} from "@app/components/utilities/cryptography/crypto";
-import { Alert, AlertDescription, Checkbox } from "@app/components/v2";
-import { ProjectPermissionActions, ProjectPermissionSub, useWorkspace } from "@app/context";
-import { useGetUserWsKey, useGetWorkspaceBot, useUpdateBotActiveStatus } from "@app/hooks/api";
+import Link from "next/link";
+
+import { UpgradeProjectAlert } from "@app/components/v2/UpgradeProjectAlert";
+import { useWorkspace } from "@app/context";
+import { useGetWorkspaceBot } from "@app/hooks/api";
 import { ProjectVersion } from "@app/hooks/api/workspace/types";
 
 export const E2EESection = () => {
   const { currentWorkspace } = useWorkspace();
   const { data: bot } = useGetWorkspaceBot(currentWorkspace?.id ?? "");
-  const { mutateAsync: updateBotActiveStatus } = useUpdateBotActiveStatus();
-  const { data: wsKey } = useGetUserWsKey(currentWorkspace?.id ?? "");
-
-  /**
-   * Activate bot for project by performing the following steps:
-   * 1. Get the (encrypted) project key
-   * 2. Decrypt project key with user's private key
-   * 3. Encrypt project key with bot's public key
-   * 4. Send encrypted project key to backend and set bot status to active
-   */
-
-  const toggleBotActivate = async () => {
-    let botKey;
-    try {
-      if (!currentWorkspace?.id) return;
-
-      if (bot && wsKey) {
-        // case: there is a bot
-
-        if (!bot.isActive) {
-          // bot is not active -> activate bot
-
-          const PRIVATE_KEY = localStorage.getItem("PRIVATE_KEY");
-
-          if (!PRIVATE_KEY) {
-            throw new Error("Private Key missing");
-          }
-
-          const WORKSPACE_KEY = decryptAssymmetric({
-            ciphertext: wsKey.encryptedKey,
-            nonce: wsKey.nonce,
-            publicKey: wsKey.sender.publicKey,
-            privateKey: PRIVATE_KEY
-          });
-
-          const { ciphertext, nonce } = encryptAssymmetric({
-            plaintext: WORKSPACE_KEY,
-            publicKey: bot.publicKey,
-            privateKey: PRIVATE_KEY
-          });
-
-          botKey = {
-            encryptedKey: ciphertext,
-            nonce
-          };
-
-          await updateBotActiveStatus({
-            workspaceId: currentWorkspace.id,
-            botKey,
-            isActive: true,
-            botId: bot.id
-          });
-        } else {
-          // bot is active -> deactivate bot
-          await updateBotActiveStatus({
-            isActive: false,
-            botId: bot.id,
-            workspaceId: currentWorkspace.id
-          });
-        }
-      }
-    } catch (err) {
-      console.error(err);
-    }
-  };
 
   if (!currentWorkspace) return null;
 
   return bot && currentWorkspace.version === ProjectVersion.V1 ? (
     <div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
-      <p className="mb-3 text-xl font-semibold">End-to-End Encryption</p>
-      <p className="mb-8 text-gray-400">
-        Disabling, end-to-end encryption (E2EE) unlocks capabilities like native integrations to
-        cloud providers as well as HTTP calls to get secrets back raw but enables the server to
-        read/decrypt your secret values.
+      <div className="flex w-full items-center justify-between">
+        <p className="text-xl font-semibold">End-to-End Encryption</p>
+        <UpgradeProjectAlert transparent project={currentWorkspace} />
+      </div>
+
+      <p className="mt-5 max-w-2xl text-sm text-gray-400">
+        We are updating our encryption logic to make sure that Infisical can be the most versatile
+        secret management platform. <br />
+        <br />
+        Upgrading the project version is required to continue receiving the latest improvements and
+        patches.
       </p>
-      <p className="mb-8 text-gray-400">
-        Note that, even with E2EE disabled, your secrets are always encrypted at rest.
-      </p>
-      <ProjectPermissionCan I={ProjectPermissionActions.Edit} a={ProjectPermissionSub.Settings}>
-        {(isAllowed) => (
-          <div className="flex w-full flex-col gap-y-3">
-            <div className="w-max">
-              <Checkbox
-                className="data-[state=checked]:bg-primary"
-                id="end-to-end-encryption"
-                isChecked={!bot.isActive}
-                isDisabled={!isAllowed}
-                onCheckedChange={async () => {
-                  await toggleBotActivate();
-                }}
-              >
-                End-to-end encryption enabled
-              </Checkbox>
-            </div>
-            <div>
-              <Alert variant="warning">
-                <AlertDescription>
-                  Enabling End-to-end encryption disables all the integrations
-                </AlertDescription>
-              </Alert>
-            </div>
-          </div>
-        )}
-      </ProjectPermissionCan>
+
+      <Link href="https://infisical.com/docs/documentation/platform/project-upgrade">
+        <a target="_blank" className="text-sm text-primary-400">
+          Learn more about project upgrades
+        </a>
+      </Link>
     </div>
   ) : (
     <div />