commit for merge

packages/hoppscotch-app/components/http/Request.vue

@@ -348,7 +348,8 @@ const newSendRequest = async () => {
 const ensureMethodInEndpoint = () => {
   if (
     !/^http[s]?:\/\//.test(newEndpoint.value) &&
-    !newEndpoint.value.startsWith("<<")
+    !newEndpoint.value.startsWith("<<") &&
+    !newEndpoint.value.startsWith("{{")
   ) {
     const domain = newEndpoint.value.split(/[/:#?]+/)[0]
     if (domain === "localhost" || /([0-9]+\.)*[0-9]/.test(domain)) {

packages/hoppscotch-app/components/http/Variables.vue

@@ -3,7 +3,7 @@
     <div
       class="sticky z-10 flex items-center justify-between pl-4 border-b bg-primary border-dividerLight top-upperMobileSecondaryStickyFold sm:top-upperSecondaryStickyFold"
     >
-      <label class="font-semibold text-secondaryLight"> Variables </label>
+      <label class="font-semibold text-secondaryLight"> My Variables </label>
       <div class="flex">
         <ButtonSecondary
           v-tippy="{ theme: 'tooltip' }"
@@ -15,28 +15,28 @@
     </div>
     <div>
       <div
-        v-for="(vari, index) in workingVars"
+        v-for="(variable, index) in workingVars"
-        :key="`vari-${vari.id}-${index}`"
+        :key="`vari-${variable.id}-${index}`"
         class="flex border-b divide-x divide-dividerLight border-dividerLight draggable-content group"
       >
         <SmartEnvInput
-          v-model="vari.key"
+          v-model="variable.key"
           :placeholder="`${t('count.parameter', { count: index + 1 })}`"
           @change="
             updateVar(index, {
-              id: vari.id,
+              id: variable.id,
               key: $event,
-              value: vari.value,
+              value: variable.value,
             })
           "
         />
         <SmartEnvInput
-          v-model="vari.value"
+          v-model="variable.value"
           :placeholder="`${t('count.value', { count: index + 1 })}`"
           @change="
             updateVar(index, {
-              id: vari.id,
+              id: variable.id,
-              key: vari.key,
+              key: variable.key,
               value: $event,
             })
           "

packages/hoppscotch-app/components/smart/EnvInput.vue

@@ -116,6 +116,8 @@ const aggregateEnvs = useReadonlyStream(aggregateEnvs$, []) as Ref<
 >
 const aggregateVars = useReadonlyStream(restVars$, []) as Ref<HoppRESTVar[]>
 
+const aggregateVars = useReadonlyStream(restVars$, []) as Ref<HoppRESTVar[]>
+
 const envVars = computed(() =>
   props.envs
     ? props.envs.map((x) => ({

packages/hoppscotch-app/helpers/utils/EffectiveURL.ts

@@ -14,7 +14,11 @@ import {
   HoppRESTHeader,
   HoppRESTParam,
 } from "@hoppscotch/data"
+<<<<<<< HEAD
 import { parseTemplateStringV } from "@hoppscotch/data/src/pathVariables"
+=======
+import { parseTemplateStringV } from "@hoppscotch/data/src/variables"
+>>>>>>> origin/codeday/main
 import { arrayFlatMap, arraySort } from "../functional/array"
 import { toFormData } from "../functional/formData"
 import { tupleToRecord } from "../functional/record"
@@ -302,6 +306,8 @@ export function getEffectiveRESTRequest(
   )
   const effectiveFinalVars = request.vars
 
+  const effectiveFinalVars = request.vars
+
   const effectiveFinalBody = getFinalBodyFromRequest(request, envVariables)
 
   return {

packages/hoppscotch-data/src/environment.ts

@@ -12,11 +12,18 @@ export type Environment = {
 export type Variables = {
   key: string
   value: string
+<<<<<<< HEAD
   }[]
 
 
 const REGEX_ENV_VAR = /<<([^>]*)>>/g // "<<myVariable>>"
 const REGEX_PATHVAR = /{{([^>]*)}}/g // "{{myVariable}}"
+=======
+}[]
+
+const REGEX_ENV_VAR = /<<([^>]*)>>/g // "<<myVariable>>"
+const REGEX_PATH_VAR = /{{([^>]*)}}/g // "{{myVariable}}"
+>>>>>>> origin/codeday/main
 
 /**
  * How much times can we expand environment variables

packages/hoppscotch-data/src/variables.ts

@@ -0,0 +1,78 @@
+import { pipe } from "fp-ts/function"
+import * as E from "fp-ts/Either"
+import {parseTemplateStringE} from "./environment";
+
+export type Environment = {
+  name: string
+  variables: {
+    key: string
+    value: string
+  }[]
+}
+
+export type Variables = {
+  key: string
+  value: string
+}[]
+
+const REGEX_ENV_VAR = /<<([^>]*)>>/g // "<<myVariable>>"
+const REGEX_MY_VAR = /{{([^}]*)}}/g // "{{myVariable}}"
+
+/**
+ * How much times can we expand environment variables
+ */
+const ENV_MAX_EXPAND_LIMIT = 10
+
+/**
+ * Error state when there is a suspected loop while
+ * recursively expanding variables
+ */
+const ENV_EXPAND_LOOP = "ENV_EXPAND_LOOP" as const
+
+export function parseTemplateStringEV(
+  str: string,
+  variables: Environment["variables"],
+  myVariables: Variables
+) {
+  if (!variables || !str || !myVariables) {
+    return E.right(str)
+  }
+
+  let result = str
+  let depth = 0
+
+  while (result.match(REGEX_ENV_VAR) != null && depth <= ENV_MAX_EXPAND_LIMIT) {
+    result = decodeURI(encodeURI(result)).replace(
+      REGEX_ENV_VAR,
+      (_, p1) => variables.find((x) => x.key === p1)?.value || ""
+    )
+    depth++
+  }
+
+  /**
+   * TODO: Create an error state when there is a suspected loop while recursively expanding these variables
+   */
+  while (result.match(REGEX_MY_VAR) != null && depth <= ENV_MAX_EXPAND_LIMIT) {
+    result = decodeURI(encodeURI(result)).replace(
+      REGEX_MY_VAR,
+      (_, p1) => myVariables.find((x) => x.key === p1)?.value || ""
+    )
+  }
+
+  return depth > ENV_MAX_EXPAND_LIMIT
+    ? E.left(ENV_EXPAND_LOOP)
+    : E.right(result)
+}
+
+/**
+ * @deprecated Use `parseTemplateStringEV` instead
+ */
+export const parseTemplateStringV = (
+  str: string,
+  variables: Environment["variables"],
+  myVariables: Variables
+) =>
+  pipe(
+    parseTemplateStringEV(str, variables, myVariables),
+    E.getOrElse(() => str)
+  )