feat: renamed old frontend and fixed some minor bugs

frontend/src/components/utilities/SecurityClient.ts

@@ -1,4 +1,4 @@
-import { getAuthToken, setAuthToken, setMfaTempToken, setSignupTempToken } from "@app/reactQuery";
+import { setAuthToken, setMfaTempToken, setSignupTempToken } from "@app/hooks/api/reactQuery";
 
 export const PROVIDER_AUTH_TOKEN_KEY = "infisical__provider-auth-token";
 
@@ -23,16 +23,4 @@ export default class SecurityClient {
   static setToken(tokenStr: string) {
     setAuthToken(tokenStr);
   }
-
-  static async fetchCall(resource: RequestInfo, options?: RequestInit | undefined) {
-    const req = new Request(resource, options);
-
-    const token = getAuthToken();
-
-    if (token) {
-      req.headers.set("Authorization", `Bearer ${token}`);
-    }
-
-    return fetch(req);
-  }
 }

frontend/src/components/utilities/attemptChangePassword.ts

@@ -38,7 +38,7 @@ const attemptChangePassword = ({ email, currentPassword, newPassword }: Params):
         const clientProof = clientOldPassword.getProof();
 
         clientNewPassword.init({ username: email, password: newPassword }, async () => {
-          clientNewPassword.createVerifier(async (err, result) => {
+          clientNewPassword.createVerifier(async (_err, result) => {
             try {
               const derivedKey = await deriveArgonKey({
                 password: newPassword,

frontend/src/components/utilities/attemptCliLogin.ts

@@ -1,8 +1,8 @@
 /* eslint-disable prefer-destructuring */
 import jsrp from "jsrp";
 
+import { decryptPrivateKeyHelper } from "@app/helpers/key";
 import { login1, login2 } from "@app/hooks/api/auth/queries";
-import KeyService from "@app/services/KeyService";
 
 import Telemetry from "./telemetry/Telemetry";
 import { saveTokenToLocalStorage } from "./saveTokenToLocalStorage";
@@ -101,7 +101,7 @@ const attemptLogin = async ({
             // set JWT token
             SecurityClient.setToken(token);
 
-            const privateKey = await KeyService.decryptPrivateKey({
+            const privateKey = await decryptPrivateKeyHelper({
               encryptionVersion,
               encryptedPrivateKey,
               iv,

frontend/src/components/utilities/attemptCliLoginMfa.ts

@@ -1,8 +1,8 @@
 /* eslint-disable prefer-destructuring */
 import jsrp from "jsrp";
 
+import { decryptPrivateKeyHelper } from "@app/helpers/key";
 import { login1, verifyMfaToken } from "@app/hooks/api/auth/queries";
-import KeyService from "@app/services/KeyService";
 
 import { saveTokenToLocalStorage } from "./saveTokenToLocalStorage";
 import SecurityClient from "./SecurityClient";
@@ -71,7 +71,7 @@ const attemptLoginMfa = async ({
           SecurityClient.setToken(token);
           SecurityClient.setProviderAuthToken("");
 
-          const privateKey = await KeyService.decryptPrivateKey({
+          const privateKey = await decryptPrivateKeyHelper({
             encryptionVersion,
             encryptedPrivateKey,
             iv,

frontend/src/components/utilities/attemptLogin.ts

@@ -1,8 +1,8 @@
 /* eslint-disable prefer-destructuring */
 import jsrp from "jsrp";
 
+import { decryptPrivateKeyHelper } from "@app/helpers/key";
 import { login1, login2 } from "@app/hooks/api/auth/queries";
-import KeyService from "@app/services/KeyService";
 
 import Telemetry from "./telemetry/Telemetry";
 import { saveTokenToLocalStorage } from "./saveTokenToLocalStorage";
@@ -86,7 +86,7 @@ const attemptLogin = async ({
     // set JWT token
     SecurityClient.setToken(token);
 
-    const privateKey = await KeyService.decryptPrivateKey({
+    const privateKey = await decryptPrivateKeyHelper({
       encryptionVersion,
       encryptedPrivateKey,
       iv,

frontend/src/components/utilities/attemptLoginMfa.ts

@@ -1,8 +1,8 @@
 /* eslint-disable prefer-destructuring */
 import jsrp from "jsrp";
 
+import { decryptPrivateKeyHelper } from "@app/helpers/key";
 import { login1, verifyMfaToken } from "@app/hooks/api/auth/queries";
-import KeyService from "@app/services/KeyService";
 
 import { saveTokenToLocalStorage } from "./saveTokenToLocalStorage";
 import SecurityClient from "./SecurityClient";
@@ -27,7 +27,7 @@ const attemptLoginMfa = async ({
   password: string;
   providerAuthToken?: string;
   mfaToken: string;
-}): Promise<Boolean> => {
+}): Promise<boolean> => {
   return new Promise((resolve, reject) => {
     client.init(
       {
@@ -63,7 +63,7 @@ const attemptLoginMfa = async ({
           SecurityClient.setToken(token);
           SecurityClient.setProviderAuthToken("");
 
-          const privateKey = await KeyService.decryptPrivateKey({
+          const privateKey = await decryptPrivateKeyHelper({
             encryptionVersion,
             encryptedPrivateKey,
             iv,

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

@@ -1,10 +1,11 @@
-import argon2 from "argon2-browser";
+// @ts-expect-error to avoid wasm dependencies
+// eslint-disable-next-line
+import argon2 from "argon2-browser/dist/argon2-bundled.min.js";
+import nacl from "tweetnacl";
+import { decodeBase64, decodeUTF8, encodeBase64, encodeUTF8 } from "tweetnacl-util";
 
 import aes from "./aes-256-gcm";
 
-const nacl = require("tweetnacl");
-nacl.util = require("tweetnacl-util");
-
 /**
  * Return new base64, NaCl, public-private key pair.
  * @returns {Object} obj
@@ -15,8 +16,8 @@ const generateKeyPair = () => {
   const pair = nacl.box.keyPair();
 
   return {
-    publicKey: nacl.util.encodeBase64(pair.publicKey),
-    privateKey: nacl.util.encodeBase64(pair.secretKey)
+    publicKey: encodeBase64(pair.publicKey),
+    privateKey: encodeBase64(pair.secretKey)
   };
 };
 
@@ -34,8 +35,8 @@ type EncryptAsymmetricProps = {
  * @param {String} - base64-encoded Nacl public key
  */
 const verifyPrivateKey = ({ privateKey, publicKey }: { privateKey: string; publicKey: string }) => {
-  const derivedPublicKey = nacl.util.encodeBase64(
-    nacl.box.keyPair.fromSecretKey(nacl.util.decodeBase64(privateKey)).publicKey
+  const derivedPublicKey = encodeBase64(
+    nacl.box.keyPair.fromSecretKey(decodeBase64(privateKey)).publicKey
   );
 
   if (derivedPublicKey !== publicKey) {
@@ -108,15 +109,15 @@ const encryptAssymmetric = ({
 } => {
   const nonce = nacl.randomBytes(24);
   const ciphertext = nacl.box(
-    nacl.util.decodeUTF8(plaintext),
+    decodeUTF8(plaintext),
     nonce,
-    nacl.util.decodeBase64(publicKey),
-    nacl.util.decodeBase64(privateKey)
+    decodeBase64(publicKey),
+    decodeBase64(privateKey)
   );
 
   return {
-    ciphertext: nacl.util.encodeBase64(ciphertext),
-    nonce: nacl.util.encodeBase64(nonce)
+    ciphertext: encodeBase64(ciphertext),
+    nonce: encodeBase64(nonce)
   };
 };
 
@@ -143,13 +144,13 @@ const decryptAssymmetric = ({
   privateKey
 }: DecryptAsymmetricProps): string => {
   const plaintext = nacl.box.open(
-    nacl.util.decodeBase64(ciphertext),
-    nacl.util.decodeBase64(nonce),
-    nacl.util.decodeBase64(publicKey),
-    nacl.util.decodeBase64(privateKey)
+    decodeBase64(ciphertext),
+    decodeBase64(nonce),
+    decodeBase64(publicKey),
+    decodeBase64(privateKey)
   );
 
-  return nacl.util.encodeUTF8(plaintext);
+  return encodeUTF8(plaintext!);
 };
 
 type EncryptSymmetricProps = {

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

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

frontend/src/components/utilities/intercom/intercom.ts

@@ -1,63 +0,0 @@
-/* eslint-disable prefer-template */
-/* eslint-disable prefer-rest-params */
-/* eslint-disable @typescript-eslint/no-unused-expressions */
-/* eslint-disable no-nested-ternary */
-/* eslint-disable no-unexpected-multiline */
-/* eslint-disable react-hooks/exhaustive-deps */
-/* eslint-disable vars-on-top */
-/* eslint-disable no-var */
-/* eslint-disable func-names */
-// eslint-disable-next-line @typescript-eslint/ban-ts-comment
-// @ts-nocheck
-
-import { INTERCOMid as APPid } from "@app/components/utilities/config";
-
-// Loads Intercom with the snippet
-// This must be run before boot, it initializes window.Intercom
-
-// prettier-ignore
-export const load = () => {
-  (function(){
-    var w=window;
-    var ic=w.Intercom;
-    
-    if(typeof ic==="function"){
-      ic("reattach_activator");
-      ic("update",w.intercomSettings);
-    } else {
-      var d=document;
-      var i=function() {
-        i.c(arguments);
-      };
-      i.q=[];
-      i.c=function(args) {
-        i.q.push(args);
-      };
-      w.Intercom=i;
-      var l=function() {
-        var s=d.createElement("script");
-        s.type="text/javascript";
-        s.async=true;
-        s.src="https://widget.intercom.io/widget/" + APPid;
-        var x=d.getElementsByTagName("script")[0];
-        x.parentNode.insertBefore(s, x);
-      };
-      if (document.readyState==="complete") {
-        l();
-      } else if (w.attachEvent) {
-        w.attachEvent("onload",l);
-      } else {
-        w.addEventListener("load",l,false);
-      }
-    }
-  })();
-}
-
-// Initializes Intercom
-export const boot = (options = {}) => {
-  window && window.Intercom && window.Intercom("boot", { appid: APPid, ...options });
-};
-
-export const update = () => {
-  window && window.Intercom && window.Intercom("update");
-};

frontend/src/components/utilities/intercom/intercomProvider.ts

@@ -1,40 +0,0 @@
-import { useEffect } from "react";
-import { useRouter } from "next/router";
-
-import { useUser } from "@app/context";
-
-import { boot as bootIntercom, load as loadIntercom, update as updateIntercom } from "./intercom";
-
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const IntercomProvider = ({ children }: { children: any }) => {
-  const { user } = useUser();
-  const router = useRouter();
-
-  if (typeof window !== "undefined") {
-    loadIntercom();
-    bootIntercom({
-      name: `${user?.firstName || ""} ${user?.lastName || ""}`,
-      email: user?.email || "",
-      created_at: Math.floor((new Date(user?.createdAt)?.getTime() || 0) / 1000)
-    });
-  }
-
-  useEffect(() => {
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    const handleRouteChange = (url: string) => {
-      if (typeof window !== "undefined") {
-        updateIntercom();
-      }
-    };
-
-    router.events.on("routeChangeStart", handleRouteChange);
-
-    // If the component is unmounted, unsubscribe
-    // from the event with the `off` method:
-    return () => {
-      router.events.off("routeChangeStart", handleRouteChange);
-    };
-  }, [router.events]);
-
-  return children;
-};

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

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

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

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

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

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

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

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