chore: introduce docker buildx for multi-platform build

.github/workflows/release-push-docker.yml

@@ -18,6 +18,9 @@ jobs:
       - name: Setup QEMU
         uses: docker/setup-qemu-action@v3
 
+      - name: Setup Docker Buildx
+        uses: docker/setup-buildx-action@v3
+
       - name: Log in to Docker Hub
         uses: docker/login-action@v2
         with:

.github/workflows/ui.yml

@@ -36,7 +36,7 @@ jobs:
 
       # Deploy the ui site with netlify-cli
       - name: Deploy to Netlify (ui)
-        run: npx netlify-cli deploy --dir=packages/hoppscotch-ui/.histoire/dist --prod
+        run: npx netlify-cli@15.11.0 deploy --dir=packages/hoppscotch-ui/.histoire/dist --prod
         env:
           NETLIFY_SITE_ID: ${{ secrets.NETLIFY_UI_SITE_ID }}
           NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}

packages/hoppscotch-cli/src/commands/test.ts

@@ -14,10 +14,9 @@ import { isHoppCLIError } from "../utils/checks";
 export const test = (path: string, options: TestCmdOptions) => async () => {
   try {
     const delay = options.delay ? parseDelayOption(options.delay) : 0
-    const envName = options.envName
+    const envs = options.env ? await parseEnvsData(options.env) : <HoppEnvs>{ global: [], selected: [] }
-    const envs = options.env ? await parseEnvsData(options.env, envName) : <HoppEnvs>{ global: [], selected: [] }
     const collections = await parseCollectionData(path)
-    
+
     const report = await collectionsRunner({collections, envs, delay})
     const hasSucceeded = collectionsRunnerResult(report)
     collectionsRunnerExit(hasSucceeded)

packages/hoppscotch-cli/src/handlers/error.ts

@@ -51,9 +51,6 @@ export const handleError = <T extends HoppErrorCode>(error: HoppError<T>) => {
     case "MALFORMED_COLLECTION":
       ERROR_MSG = `${error.path}\n${parseErrorData(error.data)}`;
       break;
-    case "ENVIRONMENT_NAME_NOT_FOUND":
-      ERROR_MSG = `\n${parseErrorData(error.data)}`;
-      break;
     case "NO_FILE_PATH":
       ERROR_MSG = `Please provide a hoppscotch-collection file path.`;
       break;

packages/hoppscotch-cli/src/index.ts

@@ -50,7 +50,6 @@ program
     "path to a hoppscotch collection.json file for CI testing"
   )
   .option("-e, --env <file_path>", "path to an environment variables json file")
-  .option("-eN, --envName <environment_name>","Specific Name of the environment")
   .option(
     "-d, --delay <delay_in_ms>",
     "delay in milliseconds(ms) between consecutive requests within a collection"

packages/hoppscotch-cli/src/interfaces/request.ts

@@ -33,5 +33,4 @@ export interface EffectiveHoppRESTRequest extends HoppRESTRequest {
   effectiveFinalHeaders: { key: string; value: string; active: boolean }[];
   effectiveFinalParams: { key: string; value: string; active: boolean }[];
   effectiveFinalBody: FormData | string | null;
-  effectiveFinalMaskedURL: string;
 }

packages/hoppscotch-cli/src/options/test/env.ts

@@ -5,46 +5,23 @@ import { readJsonFile } from "../../utils/mutators";
 /**
  * Parses env json file for given path and validates the parsed env json object.
  * @param path Path of env.json file to be parsed.
- * @param envName Name of the environment that should be used. If undefined first environment is used.
  * @returns For successful parsing we get HoppEnvs object.
  */
-export async function parseEnvsData(path: string, envName: string | undefined) {
+export async function parseEnvsData(path: string) {
   const contents = await readJsonFile(path)
-  if(!(contents && typeof contents === "object" && Array.isArray(contents))) {
+
+  if(!(contents && typeof contents === "object" && !Array.isArray(contents))) {
     throw error({ code: "MALFORMED_ENV_FILE", path, data: null })
   }
 
   const envPairs: Array<HoppEnvPair> = []
 
-  const contentEntries = Object.entries(contents)
+  for( const [key,value] of Object.entries(contents)) {
-  let environmentFound = false;
+    if(typeof value !== "string") {
+      throw error({ code: "MALFORMED_ENV_FILE", path, data: {value: value} })
+    }
 
-  for(const [key, obj] of contentEntries) {
+    envPairs.push({key, value})
-    if(!(typeof obj === "object" && "name" in obj && "variables" in obj)) {
-      throw error({ code: "MALFORMED_ENV_FILE", path, data: { value: obj } })
-    }
-    if(envName && envName !== obj.name) {
-      continue
-    }
-    environmentFound = true;
-    for(const variable of obj.variables) {
-      if(
-        !(
-          typeof variable === "object" &&
-          "key" in variable &&
-          "value" in variable &&
-          "secret" in variable
-        )
-      ) {
-        throw error({ code: "MALFORMED_ENV_FILE", path, data: { value: variable } });
-      }
-      const { key, value, secret } = variable;
-      envPairs.push({ key: key, value: value, secret: secret });
-    }
-    break
-  }
-  if(envName && !environmentFound) {
-    throw error({ code: "ENVIRONMENT_NAME_NOT_FOUND", data: envName });
   }
   return <HoppEnvs>{ global: [], selected: envPairs }
 }

packages/hoppscotch-cli/src/types/commands.ts

@@ -1,7 +1,6 @@
 export type TestCmdOptions = {
   env: string | undefined;
   delay: string | undefined;
-  envName: string | undefined;
 };
 
 export type HOPP_ENV_FILE_EXT = "json";

packages/hoppscotch-cli/src/types/errors.ts

@@ -15,7 +15,6 @@ type HoppErrors = {
   FILE_NOT_FOUND: HoppErrorPath;
   UNKNOWN_COMMAND: HoppErrorCmd;
   MALFORMED_COLLECTION: HoppErrorPath & HoppErrorData;
-  ENVIRONMENT_NAME_NOT_FOUND: HoppErrorData;
   NO_FILE_PATH: {};
   PRE_REQUEST_SCRIPT_ERROR: HoppErrorData;
   PARSING_ERROR: HoppErrorData;

packages/hoppscotch-cli/src/types/request.ts

@@ -7,7 +7,7 @@ export type FormDataEntry = {
   value: string | Blob;
 };
 
-export type HoppEnvPair = { key: string; value: string; secret: boolean };
+export type HoppEnvPair = { key: string; value: string };
 
 export type HoppEnvs = {
   global: HoppEnvPair[];

packages/hoppscotch-cli/src/utils/display.ts

@@ -1,7 +1,7 @@
 import { bold } from "chalk";
 import { groupEnd, group, log } from "console";
 import { handleError } from "../handlers/error";
-import { Method } from "axios";
+import { RequestConfig } from "../interfaces/request";
 import { RequestRunnerResponse, TestReport } from "../interfaces/response";
 import { HoppCLIError } from "../types/errors";
 import {
@@ -172,12 +172,11 @@ export const printFailedTestsReport = (
 export const printRequestRunner = {
   /**
    * Request-runner starting message.
-   * @param requestMethod Provides request's method
+   * @param requestConfig Provides request's method and url.
-   * @param maskedURL Provides the URL with secrets masked with asterisks
    */
-  start: (requestMethod: Method | undefined, maskedURL: string) => {
+  start: (requestConfig: RequestConfig) => {
-    const METHOD = BG_INFO(` ${requestMethod} `);
+    const METHOD = BG_INFO(` ${requestConfig.method} `);
-    const ENDPOINT = maskedURL;
+    const ENDPOINT = requestConfig.url;
 
     process.stdout.write(`${METHOD} ${ENDPOINT}`);
   },

packages/hoppscotch-cli/src/utils/pre-request.ts

@@ -50,9 +50,9 @@ export const preRequestScriptRunner = (
       isHoppCLIError(reason)
         ? reason
         : error({
-          code: "PRE_REQUEST_SCRIPT_ERROR",
+            code: "PRE_REQUEST_SCRIPT_ERROR",
-          data: reason,
+            data: reason,
-        })
+          })
     )
   );
 
@@ -151,12 +151,6 @@ export function getEffectiveRESTRequest(
     request.endpoint,
     envVariables
   );
-
-  const maskedEnvVariables = setAllEnvironmentValuesToAsterisk(envVariables)
-  const _effectiveFinalMaskedURL = parseTemplateStringE(
-    request.endpoint,
-    maskedEnvVariables)
-
   if (E.isLeft(_effectiveFinalURL)) {
     return E.left(
       error({
@@ -166,7 +160,6 @@ export function getEffectiveRESTRequest(
     );
   }
   const effectiveFinalURL = _effectiveFinalURL.right;
-  const effectiveFinalMaskedURL = E.isLeft(_effectiveFinalMaskedURL) ? request.endpoint : _effectiveFinalMaskedURL.right;
 
   return E.right({
     ...request,
@@ -174,7 +167,6 @@ export function getEffectiveRESTRequest(
     effectiveFinalHeaders,
     effectiveFinalParams,
     effectiveFinalBody,
-    effectiveFinalMaskedURL,
   });
 }
 
@@ -250,15 +242,15 @@ function getFinalBodyFromRequest(
       arrayFlatMap((x) =>
         x.isFile
           ? x.value.map((v) => ({
-            key: parseTemplateString(x.key, envVariables),
-            value: v as string | Blob,
-          }))
-          : [
-            {
               key: parseTemplateString(x.key, envVariables),
-              value: parseTemplateString(x.value, envVariables),
+              value: v as string | Blob,
-            },
+            }))
-          ]
+          : [
+              {
+                key: parseTemplateString(x.key, envVariables),
+                value: parseTemplateString(x.value, envVariables),
+              },
+            ]
       ),
       toFormData,
       E.right
@@ -295,22 +287,3 @@ export const getPreRequestMetrics = (
       hasPreReqErrors ? { failed: 1, passed: 0 } : { failed: 0, passed: 1 },
     (scripts) => <PreRequestMetrics>{ scripts, duration }
   );
-
-/**
- * Mask all environment values with asterisks
- * @param variables Environment variable array
- * @returns Environment variable array with masked values
- */
-const setAllEnvironmentValuesToAsterisk = (
-  variables: Environment["variables"]
-): Environment["variables"] => {
-  const envVariables: Environment["variables"] = [];
-  for (const variable of variables) {
-    let value = variable.value
-    if (variable.secret) {
-      value = "******"
-    }
-    envVariables.push({ key: variable.key, secret: variable.secret, value: value })
-  }
-  return envVariables
-}

packages/hoppscotch-cli/src/utils/request.ts

@@ -220,7 +220,6 @@ export const processRequest =
       effectiveFinalHeaders: [],
       effectiveFinalParams: [],
       effectiveFinalURL: "",
-      effectiveFinalMaskedURL:"",
     };
 
     // Executing pre-request-script
@@ -238,8 +237,8 @@ export const processRequest =
 
     // Creating request-config for request-runner.
     const requestConfig = createRequest(effectiveRequest);
-    
+
-    printRequestRunner.start(requestConfig.method, effectiveRequest.effectiveFinalMaskedURL);
+    printRequestRunner.start(requestConfig);
 
     // Default value for request-runner's response.
     let _requestRunnerRes: RequestRunnerResponse = {

packages/hoppscotch-common/locales/de.json

@@ -48,8 +48,7 @@
     "turn_off": "Ausschalten",
     "turn_on": "Einschalten",
     "undo": "Rückgängig machen",
-    "yes": "Ja",
+    "yes": "Ja"
-    "secret": "Als Secret speichern"
   },
   "add": {
     "new": "Neue hinzufügen",
@@ -881,4 +880,4 @@
     "team": "Team Workspace",
     "title": "Workspaces"
   }
-}
+}

packages/hoppscotch-common/locales/en.json

@@ -48,8 +48,7 @@
     "turn_off": "Turn off",
     "turn_on": "Turn on",
     "undo": "Undo",
-    "yes": "Yes",
+    "yes": "Yes"
-    "secret": "Save as secret"
   },
   "add": {
     "new": "Add new",

packages/hoppscotch-common/src/components.d.ts

@@ -96,6 +96,7 @@ declare module 'vue' {
     HoppSmartExpand: typeof import('@hoppscotch/ui')['HoppSmartExpand']
     HoppSmartFileChip: typeof import('@hoppscotch/ui')['HoppSmartFileChip']
     HoppSmartInput: typeof import('@hoppscotch/ui')['HoppSmartInput']
+    HoppSmartIntersection: typeof import('@hoppscotch/ui')['HoppSmartIntersection']
     HoppSmartItem: typeof import('@hoppscotch/ui')['HoppSmartItem']
     HoppSmartLink: typeof import('@hoppscotch/ui')['HoppSmartLink']
     HoppSmartModal: typeof import('@hoppscotch/ui')['HoppSmartModal']
@@ -142,6 +143,7 @@ declare module 'vue' {
     IconLucideAlertTriangle: typeof import('~icons/lucide/alert-triangle')['default']
     IconLucideArrowLeft: typeof import('~icons/lucide/arrow-left')['default']
     IconLucideArrowUpRight: typeof import('~icons/lucide/arrow-up-right')['default']
+    IconLucideBrush: typeof import('~icons/lucide/brush')['default']
     IconLucideCheckCircle: typeof import('~icons/lucide/check-circle')['default']
     IconLucideChevronRight: typeof import('~icons/lucide/chevron-right')['default']
     IconLucideGlobe: typeof import('~icons/lucide/globe')['default']
@@ -151,8 +153,10 @@ declare module 'vue' {
     IconLucideLayers: typeof import('~icons/lucide/layers')['default']
     IconLucideListEnd: typeof import('~icons/lucide/list-end')['default']
     IconLucideMinus: typeof import('~icons/lucide/minus')['default']
+    IconLucideRss: typeof import('~icons/lucide/rss')['default']
     IconLucideSearch: typeof import('~icons/lucide/search')['default']
     IconLucideUsers: typeof import('~icons/lucide/users')['default']
+    IconLucideVerified: typeof import('~icons/lucide/verified')['default']
     InterceptorsExtensionSubtitle: typeof import('./components/interceptors/ExtensionSubtitle.vue')['default']
     LensesHeadersRenderer: typeof import('./components/lenses/HeadersRenderer.vue')['default']
     LensesHeadersRendererEntry: typeof import('./components/lenses/HeadersRendererEntry.vue')['default']

packages/hoppscotch-common/src/components/environments/my/Details.vue

@@ -60,17 +60,7 @@
               :placeholder="`${t('count.value', { count: index + 1 })}`"
               :envs="liveEnvs"
               :name="'value' + index"
-              :secret="env.secret"
             />
-            <div class="flex">
-              <HoppButtonSecondary
-                id="variable"
-                v-tippy="{ theme: 'tooltip' }"
-                :title="t('action.secret')"
-                :icon="env.secret ? IconEyeOff : IconEye"
-                @click="toggleEnvironmentSecret(index)"
-              />
-            </div>
             <div class="flex">
               <HoppButtonSecondary
                 id="variable"
@@ -120,8 +110,6 @@ import IconTrash2 from "~icons/lucide/trash-2"
 import IconDone from "~icons/lucide/check"
 import IconPlus from "~icons/lucide/plus"
 import IconTrash from "~icons/lucide/trash"
-import IconEye from "~icons/lucide/eye"
-import IconEyeOff from "~icons/lucide/eye-off"
 import { clone } from "lodash-es"
 import { computed, ref, watch } from "vue"
 import * as E from "fp-ts/Either"
@@ -152,7 +140,6 @@ type EnvironmentVariable = {
   env: {
     key: string
     value: string
-    secret: boolean
   }
 }
 
@@ -185,7 +172,7 @@ const idTicker = ref(0)
 
 const editingName = ref<string | null>(null)
 const vars = ref<EnvironmentVariable[]>([
-  { id: idTicker.value++, env: { key: "", value: "", secret: false } },
+  { id: idTicker.value++, env: { key: "", value: "" } },
 ])
 
 const clearIcon = refAutoReset<typeof IconTrash2 | typeof IconDone>(
@@ -216,8 +203,6 @@ const workingEnv = computed(() => {
   }
 })
 
-const oldEnvironments = ref<string[]>([])
-
 const envList = useReadonlyStream(environments$, []) || props.envVars()
 
 const evnExpandError = computed(() => {
@@ -249,28 +234,6 @@ const liveEnvs = computed(() => {
   }
 })
 
-watch(liveEnvs, (newLiveEnv, oldLiveEnv) => {
-  const oldEnvLength = oldLiveEnv.length
-  const newEnvLength = newLiveEnv.length
-  if (oldEnvLength === newEnvLength) {
-    const _oldEnvironments = []
-    for (let i = 0; i < newEnvLength; i++) {
-      const newVar = newLiveEnv[i]
-      const oldVar = oldLiveEnv[i]
-      let newValue = ""
-      if (!newVar.secret) {
-        newValue = newVar.value
-      } else if (!oldVar.secret) {
-        newValue = oldVar.value
-      } else {
-        newValue = oldEnvironments.value[i]
-      }
-      _oldEnvironments.push(newValue)
-    }
-    oldEnvironments.value = _oldEnvironments
-  }
-})
-
 watch(
   () => props.show,
   (show) => {
@@ -299,7 +262,6 @@ const addEnvironmentVariable = () => {
     env: {
       key: "",
       value: "",
-      secret: false,
     },
   })
 }
@@ -308,23 +270,12 @@ const removeEnvironmentVariable = (index: number) => {
   vars.value.splice(index, 1)
 }
 
-const toggleEnvironmentSecret = (index: number) => {
-  vars.value[index].env.secret = !vars.value[index].env.secret
-}
-
 const saveEnvironment = () => {
   if (!editingName.value) {
     toast.error(`${t("environment.invalid_name")}`)
     return
   }
-  const _vars = vars.value
+
-  for (let i = 0; i < vars.value.length; i++) {
-    const value = oldEnvironments.value[i]
-    if (value) {
-      _vars[i].env.value = value
-    }
-  }
-  vars.value = _vars
   const filterdVariables = pipe(
     vars.value,
     A.filterMap(

packages/hoppscotch-common/src/components/environments/teams/Details.vue

@@ -63,17 +63,7 @@
               :envs="liveEnvs"
               :name="'value' + index"
               :readonly="isViewer"
-              :secret="env.secret"
             />
-            <div v-if="!isViewer" class="flex">
-              <HoppButtonSecondary
-                id="variable"
-                v-tippy="{ theme: 'tooltip' }"
-                :title="t('action.secret')"
-                :icon="env.secret ? IconEyeOff : IconEye"
-                @click="toggleEnvironmentSecret(index)"
-              />
-            </div>
             <div v-if="!isViewer" class="flex">
               <HoppButtonSecondary
                 id="variable"
@@ -149,8 +139,6 @@ import IconTrash from "~icons/lucide/trash"
 import IconTrash2 from "~icons/lucide/trash-2"
 import IconDone from "~icons/lucide/check"
 import IconPlus from "~icons/lucide/plus"
-import IconEye from "~icons/lucide/eye"
-import IconEyeOff from "~icons/lucide/eye-off"
 import { platform } from "~/platform"
 
 type EnvironmentVariable = {
@@ -158,7 +146,6 @@ type EnvironmentVariable = {
   env: {
     key: string
     value: string
-    secret: boolean
   }
 }
 
@@ -195,10 +182,9 @@ const idTicker = ref(0)
 
 const editingName = ref<string | null>(null)
 const vars = ref<EnvironmentVariable[]>([
-  { id: idTicker.value++, env: { key: "", value: "", secret: false } },
+  { id: idTicker.value++, env: { key: "", value: "" } },
 ])
 
-const oldEnvironments = ref<string[]>([])
 const clearIcon = refAutoReset<typeof IconTrash2 | typeof IconDone>(
   IconTrash2,
   1000
@@ -226,28 +212,6 @@ const liveEnvs = computed(() => {
   }
 })
 
-watch(liveEnvs, (newLiveEnv, oldLiveEnv) => {
-  const oldEnvLength = oldLiveEnv.length
-  const newEnvLength = newLiveEnv.length
-  if (oldEnvLength === newEnvLength) {
-    const _oldEnvironments = []
-    for (let i = 0; i < newEnvLength; i++) {
-      const newVar = newLiveEnv[i]
-      const oldVar = oldLiveEnv[i]
-      let newValue = ""
-      if (!newVar.secret) {
-        newValue = newVar.value
-      } else if (!oldVar.secret) {
-        newValue = oldVar.value
-      } else {
-        newValue = oldEnvironments.value[i]
-      }
-      _oldEnvironments.push(newValue)
-    }
-    oldEnvironments.value = _oldEnvironments
-  }
-})
-
 watch(
   () => props.show,
   (show) => {
@@ -256,7 +220,7 @@ watch(
         editingName.value = null
         vars.value = pipe(
           props.envVars() ?? [],
-          A.map((e: { key: string; value: string; secret: boolean }) => ({
+          A.map((e: { key: string; value: string }) => ({
             id: idTicker.value++,
             env: clone(e),
           }))
@@ -265,7 +229,7 @@ watch(
         editingName.value = props.editingEnvironment.environment.name ?? null
         vars.value = pipe(
           props.editingEnvironment.environment.variables ?? [],
-          A.map((e: { key: string; value: string; secret: boolean }) => ({
+          A.map((e: { key: string; value: string }) => ({
             id: idTicker.value++,
             env: clone(e),
           }))
@@ -287,7 +251,6 @@ const addEnvironmentVariable = () => {
     env: {
       key: "",
       value: "",
-      secret: false,
     },
   })
 }
@@ -296,10 +259,6 @@ const removeEnvironmentVariable = (index: number) => {
   vars.value.splice(index, 1)
 }
 
-const toggleEnvironmentSecret = (index: number) => {
-  vars.value[index].env.secret = !vars.value[index].env.secret
-}
-
 const isLoading = ref(false)
 
 const saveEnvironment = async () => {
@@ -310,15 +269,6 @@ const saveEnvironment = async () => {
     return
   }
 
-  const _vars = vars.value
-  for (let i = 0; i < vars.value.length; i++) {
-    const value = oldEnvironments.value[i]
-    if (value) {
-      _vars[i].env.value = value
-    }
-  }
-  vars.value = _vars
-
   const filterdVariables = pipe(
     vars.value,
     A.filterMap(

packages/hoppscotch-common/src/components/http/TestResult.vue

@@ -279,7 +279,6 @@ const globalEnvVars = useReadonlyStream(globalEnv$, []) as Ref<
   Array<{
     key: string
     value: string
-    secret: boolean
   }>
 >
 

packages/hoppscotch-common/src/components/http/TestResultEnv.vue

@@ -48,7 +48,6 @@ type Props = {
   env: {
     key: string
     value: string
-    secret: boolean
     previousValue?: string
   }
   status: Status

packages/hoppscotch-common/src/components/smart/EnvInput.vue

@@ -55,12 +55,7 @@ import {
   keymap,
   tooltips,
 } from "@codemirror/view"
-import {
+import { EditorSelection, EditorState, Extension } from "@codemirror/state"
-  EditorSelection,
-  EditorState,
-  Extension,
-  StateEffect,
-} from "@codemirror/state"
 import { clone } from "lodash-es"
 import { history, historyKeymap } from "@codemirror/commands"
 import { inputTheme } from "~/helpers/editor/themes/baseTheme"
@@ -77,17 +72,13 @@ const props = withDefaults(
     modelValue?: string
     placeholder?: string
     styles?: string
-    envs?:
+    envs?: { key: string; value: string; source: string }[] | null
-      | { key: string; value: string; secret: boolean; source: string }[]
-      | null
     focus?: boolean
     selectTextOnMount?: boolean
     environmentHighlights?: boolean
     readonly?: boolean
     autoCompleteSource?: string[]
     inspectionResults?: InspectorResult[] | undefined
-    defaultValue?: string
-    secret?: boolean
   }>(),
   {
     modelValue: "",
@@ -100,8 +91,6 @@ const props = withDefaults(
     autoCompleteSource: undefined,
     inspectionResult: undefined,
     inspectionResults: undefined,
-    defaultValue: "",
-    secret: false,
   }
 )
 
@@ -115,8 +104,6 @@ const emit = defineEmits<{
   (e: "click", ev: any): void
 }>()
 
-const asterikedText = computed(() => "*".repeat(props.modelValue.length))
-
 const cachedValue = ref(props.modelValue)
 
 const view = ref<EditorView>()
@@ -276,22 +263,6 @@ watch(
   }
 )
 
-const prevModelValue = ref(props.modelValue)
-
-watch(
-  () => props.secret,
-  (newValue) => {
-    let visibleValue = asterikedText.value
-    if (!newValue) {
-      visibleValue = prevModelValue.value
-    } else {
-      prevModelValue.value = props.modelValue
-    }
-    emit("update:modelValue", visibleValue)
-    updateEditorViewTheme(newValue)
-  }
-)
-
 /**
  * Used to scroll the active suggestion into view
  */
@@ -313,6 +284,7 @@ watch(
   () => props.modelValue,
   (newVal) => {
     const singleLinedText = newVal.replaceAll("\n", "")
+
     const currDoc = view.value?.state.doc
       .toJSON()
       .join(view.value.state.lineBreak)
@@ -348,7 +320,6 @@ const envVars = computed(() =>
     ? props.envs.map((x) => ({
         key: x.key,
         value: x.value,
-        secret: x.secret,
         sourceEnv: x.source,
       }))
     : aggregateEnvs.value
@@ -383,14 +354,6 @@ function handleTextSelection() {
     }
   }
 }
-const updateEditorViewTheme = (readonly: boolean) => {
-  if (view.value) {
-    const extensions: Extension = getExtensions(readonly)
-    view.value.dispatch({
-      effects: [StateEffect.reconfigure.of(extensions)],
-    })
-  }
-}
 
 const initView = (el: any) => {
   // Debounce to prevent double click from selecting the word
@@ -401,31 +364,17 @@ const initView = (el: any) => {
   el.addEventListener("mouseup", debounceFn)
   el.addEventListener("keyup", debounceFn)
 
-  if (props.secret) {
-    emit("update:modelValue", asterikedText.value)
-  }
-  const extensions: Extension = getExtensions(props.readonly || props.secret)
-  view.value = new EditorView({
-    parent: el,
-    state: EditorState.create({
-      doc: props.modelValue,
-      extensions,
-    }),
-  })
-}
-
-const getExtensions = (readonly: boolean): Extension => {
   const extensions: Extension = [
     EditorView.contentAttributes.of({ "aria-label": props.placeholder }),
     EditorView.contentAttributes.of({ "data-enable-grammarly": "false" }),
     EditorView.updateListener.of((update) => {
-      if (readonly) {
+      if (props.readonly) {
         update.view.contentDOM.inputMode = "none"
       }
     }),
-    EditorState.changeFilter.of(() => !readonly),
+    EditorState.changeFilter.of(() => !props.readonly),
     inputTheme,
-    readonly
+    props.readonly
       ? EditorView.theme({
           ".cm-content": {
             caretColor: "var(--secondary-dark-color)",
@@ -457,7 +406,7 @@ const getExtensions = (readonly: boolean): Extension => {
     ViewPlugin.fromClass(
       class {
         update(update: ViewUpdate) {
-          if (readonly) return
+          if (props.readonly) return
 
           if (update.docChanged) {
             const prevValue = clone(cachedValue.value)
@@ -469,14 +418,9 @@ const getExtensions = (readonly: boolean): Extension => {
             // We do not update the cache directly in this case (to trigger value watcher to dispatch)
             // So, we desync cachedValue a bit so we can trigger updates
             const value = clone(cachedValue.value).replaceAll("\n", "")
-            if (props.secret) {
+
-              const asterikedValue = "*".repeat(value.length)
+            emit("update:modelValue", value)
-              emit("update:modelValue", asterikedValue)
+            emit("change", value)
-              emit("change", asterikedValue)
-            } else {
-              emit("update:modelValue", value)
-              emit("change", value)
-            }
 
             const pasted = !!update.transactions.find((txn) =>
               txn.isUserEvent("input.paste")
@@ -501,7 +445,14 @@ const getExtensions = (readonly: boolean): Extension => {
     history(),
     keymap.of([...historyKeymap]),
   ]
-  return extensions
+
+  view.value = new EditorView({
+    parent: el,
+    state: EditorState.create({
+      doc: props.modelValue,
+      extensions,
+    }),
+  })
 }
 
 const triggerTextSelection = () => {

packages/hoppscotch-common/src/helpers/editor/extensions/HoppEnvironment.ts

@@ -66,10 +66,7 @@ const cursorTooltipField = (aggregateEnvs: AggregateEnvironment[]) =>
 
       const envName = tooltipEnv?.sourceEnv ?? "Choose an Environment"
 
-      let envValue = tooltipEnv?.value ?? "Not found"
+      const envValue = tooltipEnv?.value ?? "Not found"
-      if (tooltipEnv?.secret) {
-        envValue = "******"
-      }
 
       const result = parseTemplateStringE(envValue, aggregateEnvs)
 

packages/hoppscotch-common/src/helpers/terndoc/pw-pre.json

@@ -2,7 +2,7 @@
   "!name": "pw-pre",
   "pw": {
     "env": {
-      "set": "fn(key: string, value: string, secret: boolean)",
+      "set": "fn(key: string, value: string)",
       "get": "fn(key: string) -> string",
       "getResolve": "fn(key: string) -> string",
       "resolve": "fn(value: string) -> string"

packages/hoppscotch-common/src/helpers/terndoc/pw-test.json

@@ -21,7 +21,7 @@
       "body": "?"
     },
     "env": {
-      "set": "fn(key: string, value: string, secret:boolean)",
+      "set": "fn(key: string, value: string)",
       "get": "fn(key: string) -> string",
       "getResolve": "fn(key: string) -> string",
       "resolve": "fn(value: string) -> string"

packages/hoppscotch-common/src/newstore/environments.ts

@@ -186,19 +186,14 @@ const dispatchers = defineDispatchers({
   },
   addEnvironmentVariable(
     { environments }: EnvironmentStore,
-    {
+    { envIndex, key, value }: { envIndex: number; key: string; value: string }
-      envIndex,
-      key,
-      value,
-      secret,
-    }: { envIndex: number; key: string; value: string; secret: boolean }
   ) {
     return {
       environments: environments.map((env, index) =>
         index === envIndex
           ? {
               ...env,
-              variables: [...env.variables, { key, value, secret }],
+              variables: [...env.variables, { key, value }],
             }
           : env
       ),
@@ -226,10 +221,7 @@ const dispatchers = defineDispatchers({
     {
       envIndex,
       vars,
-    }: {
+    }: { envIndex: number; vars: { key: string; value: string }[] }
-      envIndex: number
-      vars: { key: string; value: string; secret: boolean }[]
-    }
   ) {
     return {
       environments: environments.map((env, index) =>
@@ -249,13 +241,11 @@ const dispatchers = defineDispatchers({
       variableIndex,
       updatedKey,
       updatedValue,
-      updatedSecret,
     }: {
       envIndex: number
       variableIndex: number
       updatedKey: string
       updatedValue: string
-      updatedSecret: boolean
     }
   ) {
     return {
@@ -265,11 +255,7 @@ const dispatchers = defineDispatchers({
               ...env,
               variables: env.variables.map((v, vIndex) =>
                 vIndex === variableIndex
-                  ? {
+                  ? { key: updatedKey, value: updatedValue }
-                      key: updatedKey,
-                      value: updatedValue,
-                      secret: updatedSecret,
-                    }
                   : v
               ),
             }
@@ -373,7 +359,6 @@ export const currentEnvironment$: Observable<Environment | undefined> =
 export type AggregateEnvironment = {
   key: string
   value: string
-  secret: boolean
   sourceEnv: string
 }
 
@@ -388,11 +373,11 @@ export const aggregateEnvs$: Observable<AggregateEnvironment[]> = combineLatest(
   map(([selectedEnv, globalVars]) => {
     const results: AggregateEnvironment[] = []
 
-    selectedEnv?.variables.forEach(({ key, value, secret }) =>
+    selectedEnv?.variables.forEach(({ key, value }) =>
-      results.push({ key, value, secret, sourceEnv: selectedEnv.name })
+      results.push({ key, value, sourceEnv: selectedEnv.name })
     )
-    globalVars.forEach(({ key, value, secret }) =>
+    globalVars.forEach(({ key, value }) =>
-      results.push({ key, value, secret, sourceEnv: "Global" })
+      results.push({ key, value, sourceEnv: "Global" })
     )
 
     return results
@@ -608,7 +593,7 @@ export function updateEnvironment(envIndex: number, updatedEnv: Environment) {
 
 export function setEnvironmentVariables(
   envIndex: number,
-  vars: { key: string; value: string; secret: boolean }[]
+  vars: { key: string; value: string }[]
 ) {
   environmentsStore.dispatch({
     dispatcher: "setEnvironmentVariables",
@@ -621,7 +606,7 @@ export function setEnvironmentVariables(
 
 export function addEnvironmentVariable(
   envIndex: number,
-  { key, value, secret }: { key: string; value: string; secret: boolean }
+  { key, value }: { key: string; value: string }
 ) {
   environmentsStore.dispatch({
     dispatcher: "addEnvironmentVariable",
@@ -629,7 +614,6 @@ export function addEnvironmentVariable(
       envIndex,
       key,
       value,
-      secret,
     },
   })
 }
@@ -650,7 +634,7 @@ export function removeEnvironmentVariable(
 export function updateEnvironmentVariable(
   envIndex: number,
   variableIndex: number,
-  { key, value, secret }: { key: string; value: string; secret: boolean }
+  { key, value }: { key: string; value: string }
 ) {
   environmentsStore.dispatch({
     dispatcher: "updateEnvironmentVariable",
@@ -659,7 +643,6 @@ export function updateEnvironmentVariable(
       variableIndex,
       updatedKey: key,
       updatedValue: value,
-      updatedSecret: secret,
     },
   })
 }

packages/hoppscotch-data/src/environment.ts

@@ -7,7 +7,6 @@ export type Environment = {
   variables: {
     key: string
     value: string
-    secret: boolean
   }[]
 }
 

packages/hoppscotch-js-sandbox/src/__tests__/preRequest.spec.ts

@@ -11,16 +11,16 @@ describe("execPreRequestScript", () => {
         {
           global: [],
           selected: [
-            { key: "bob", value: "oldbob", secret: false },
+            { key: "bob", value: "oldbob" },
-            { key: "foo", value: "bar", secret: false },
+            { key: "foo", value: "bar" },
           ],
         }
       )()
     ).resolves.toEqualRight({
       global: [],
       selected: [
-        { key: "bob", value: "newbob", secret: false },
+        { key: "bob", value: "newbob" },
-        { key: "foo", value: "bar", secret: false },
+        { key: "foo", value: "bar" },
       ],
     })
   })
@@ -34,8 +34,8 @@ describe("execPreRequestScript", () => {
         {
           global: [],
           selected: [
-            { key: "bob", value: "oldbob", secret: false },
+            { key: "bob", value: "oldbob" },
-            { key: "foo", value: "bar", secret: false },
+            { key: "foo", value: "bar" },
           ],
         }
       )()
@@ -51,8 +51,8 @@ describe("execPreRequestScript", () => {
         {
           global: [],
           selected: [
-            { key: "bob", value: "oldbob", secret: false },
+            { key: "bob", value: "oldbob" },
-            { key: "foo", value: "bar", secret: false },
+            { key: "foo", value: "bar" },
           ],
         }
       )()
@@ -68,8 +68,8 @@ describe("execPreRequestScript", () => {
         {
           global: [],
           selected: [
-            { key: "bob", value: "oldbob", secret: false },
+            { key: "bob", value: "oldbob" },
-            { key: "foo", value: "bar", secret: false },
+            { key: "foo", value: "bar" },
           ],
         }
       )()
@@ -86,7 +86,7 @@ describe("execPreRequestScript", () => {
       )()
     ).resolves.toEqualRight({
       global: [],
-      selected: [{ key: "foo", value: "bar", secret: false }],
+      selected: [{ key: "foo", value: "bar" }],
     })
   })
 })

packages/hoppscotch-js-sandbox/src/__tests__/testing/envs/get.spec.ts

@@ -30,7 +30,6 @@ describe("pw.env.get", () => {
             {
               key: "a",
               value: "b",
-              secret: false,
             },
           ],
         }
@@ -59,7 +58,6 @@ describe("pw.env.get", () => {
             {
               key: "a",
               value: "b",
-              secret: false,
             },
           ],
           selected: [],
@@ -113,14 +111,12 @@ describe("pw.env.get", () => {
             {
               key: "a",
               value: "global val",
-              secret: false,
             },
           ],
           selected: [
             {
               key: "a",
               value: "selected val",
-              secret: false,
             },
           ],
         }
@@ -150,7 +146,6 @@ describe("pw.env.get", () => {
             {
               key: "a",
               value: "<<hello>>",
-              secret: false,
             },
           ],
         }

packages/hoppscotch-js-sandbox/src/__tests__/testing/envs/getResolve.spec.ts

@@ -30,7 +30,6 @@ describe("pw.env.getResolve", () => {
             {
               key: "a",
               value: "b",
-              secret: false,
             },
           ],
         }
@@ -59,7 +58,6 @@ describe("pw.env.getResolve", () => {
             {
               key: "a",
               value: "b",
-              secret: false,
             },
           ],
           selected: [],
@@ -113,14 +111,12 @@ describe("pw.env.getResolve", () => {
             {
               key: "a",
               value: "global val",
-              secret: false,
             },
           ],
           selected: [
             {
               key: "a",
               value: "selected val",
-              secret: false,
             },
           ],
         }
@@ -150,12 +146,10 @@ describe("pw.env.getResolve", () => {
             {
               key: "a",
               value: "<<hello>>",
-              secret: false,
             },
             {
               key: "hello",
               value: "there",
-              secret: false,
             },
           ],
         }
@@ -185,12 +179,10 @@ describe("pw.env.getResolve", () => {
             {
               key: "a",
               value: "<<hello>>",
-              secret: false,
             },
             {
               key: "hello",
               value: "<<a>>",
-              secret: false,
             },
           ],
         }

packages/hoppscotch-js-sandbox/src/__tests__/testing/envs/resolve.spec.ts

@@ -41,7 +41,6 @@ describe("pw.env.resolve", () => {
             {
               key: "hello",
               value: "there",
-              secret: false,
             },
           ],
           selected: [],
@@ -72,7 +71,6 @@ describe("pw.env.resolve", () => {
             {
               key: "hello",
               value: "there",
-              secret: false,
             },
           ],
         }
@@ -101,14 +99,12 @@ describe("pw.env.resolve", () => {
             {
               key: "hello",
               value: "yo",
-              secret: false,
             },
           ],
           selected: [
             {
               key: "hello",
               value: "there",
-              secret: false,
             },
           ],
         }
@@ -138,12 +134,10 @@ describe("pw.env.resolve", () => {
             {
               key: "hello",
               value: "<<there>>",
-              secret: false,
             },
             {
               key: "there",
               value: "<<hello>>",
-              secret: false,
             },
           ],
         }

packages/hoppscotch-js-sandbox/src/__tests__/testing/envs/set.spec.ts

@@ -33,7 +33,6 @@ describe("pw.env.set", () => {
             {
               key: "a",
               value: "b",
-              secret: false,
             },
           ],
         }
@@ -44,7 +43,6 @@ describe("pw.env.set", () => {
           {
             key: "a",
             value: "c",
-            secret: false,
           },
         ],
       })
@@ -62,7 +60,6 @@ describe("pw.env.set", () => {
             {
               key: "a",
               value: "b",
-              secret: false,
             },
           ],
           selected: [],
@@ -74,7 +71,6 @@ describe("pw.env.set", () => {
           {
             key: "a",
             value: "c",
-            secret: false,
           },
         ],
       })
@@ -92,14 +88,12 @@ describe("pw.env.set", () => {
             {
               key: "a",
               value: "b",
-              secret: false,
             },
           ],
           selected: [
             {
               key: "a",
               value: "d",
-              secret: false,
             },
           ],
         }
@@ -110,14 +104,12 @@ describe("pw.env.set", () => {
           {
             key: "a",
             value: "b",
-            secret: false,
           },
         ],
         selected: [
           {
             key: "a",
             value: "c",
-            secret: false,
           },
         ],
       })
@@ -142,7 +134,6 @@ describe("pw.env.set", () => {
           {
             key: "a",
             value: "c",
-            secret: false,
           },
         ],
       })

packages/hoppscotch-js-sandbox/src/preRequest.ts

@@ -87,32 +87,28 @@ export const execPreRequestScript = (
         }
       })
 
-      const envSetHandle = vm.newFunction(
+      const envSetHandle = vm.newFunction("set", (keyHandle, valueHandle) => {
-        "set",
+        const key: unknown = vm.dump(keyHandle)
-        (keyHandle, valueHandle, secretHandle) => {
+        const value: unknown = vm.dump(valueHandle)
-          const key: unknown = vm.dump(keyHandle)
-          const value: unknown = vm.dump(valueHandle)
-          const secret: boolean = vm.dump(secretHandle)
-
-          if (typeof key !== "string") {
-            return {
-              error: vm.newString("Expected key to be a string"),
-            }
-          }
-
-          if (typeof value !== "string") {
-            return {
-              error: vm.newString("Expected value to be a string"),
-            }
-          }
-
-          currentEnvs = setEnv(key, value, secret, currentEnvs)
 
+        if (typeof key !== "string") {
           return {
-            value: vm.undefined,
+            error: vm.newString("Expected key to be a string"),
           }
         }
-      )
+
+        if (typeof value !== "string") {
+          return {
+            error: vm.newString("Expected value to be a string"),
+          }
+        }
+
+        currentEnvs = setEnv(key, value, currentEnvs)
+
+        return {
+          value: vm.undefined,
+        }
+      })
 
       const envResolveHandle = vm.newFunction("resolve", (valueHandle) => {
         const value: unknown = vm.dump(valueHandle)

packages/hoppscotch-js-sandbox/src/test-runner.ts

@@ -527,32 +527,28 @@ export const execTestScript = (
           }
         )
 
-        const envSetHandle = vm.newFunction(
+        const envSetHandle = vm.newFunction("set", (keyHandle, valueHandle) => {
-          "set",
+          const key: unknown = vm.dump(keyHandle)
-          (keyHandle, valueHandle, secretHandle) => {
+          const value: unknown = vm.dump(valueHandle)
-            const key: unknown = vm.dump(keyHandle)
-            const value: unknown = vm.dump(valueHandle)
-            const secret: boolean = vm.dump(secretHandle)
-
-            if (typeof key !== "string") {
-              return {
-                error: vm.newString("Expected key to be a string"),
-              }
-            }
-
-            if (typeof value !== "string") {
-              return {
-                error: vm.newString("Expected value to be a string"),
-              }
-            }
-
-            currentEnvs = setEnv(key, value, secret, currentEnvs)
 
+          if (typeof key !== "string") {
             return {
-              value: vm.undefined,
+              error: vm.newString("Expected key to be a string"),
             }
           }
-        )
+
+          if (typeof value !== "string") {
+            return {
+              error: vm.newString("Expected value to be a string"),
+            }
+          }
+
+          currentEnvs = setEnv(key, value, currentEnvs)
+
+          return {
+            value: vm.undefined,
+          }
+        })
 
         const envResolveHandle = vm.newFunction("resolve", (valueHandle) => {
           const value: unknown = vm.dump(valueHandle)

packages/hoppscotch-js-sandbox/src/utils.ts

@@ -50,7 +50,6 @@ export function getEnv(envName: string, envs: TestResult["envs"]) {
 export function setEnv(
   envName: string,
   envValue: string,
-  envSecret: boolean,
   envs: TestResult["envs"]
 ): TestResult["envs"] {
   const indexInSelected = envs.selected.findIndex((x) => x.key === envName)
@@ -81,7 +80,6 @@ export function setEnv(
   envs.selected.push({
     key: envName,
     value: envValue,
-    secret: envSecret,
   })
 
   return {