refactor: ensure empty string IDs fall back to the unique ID variant

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

@@ -165,7 +165,7 @@ import { environmentsStore } from "~/newstore/environments"
 import { platform } from "~/platform"
 import { useService } from "dioc/vue"
 import { SecretEnvironmentService } from "~/services/secret-environment.service"
-import { uniqueId } from "lodash-es"
+import { uniqueID } from "~/helpers/utils/uniqueID"
 
 type EnvironmentVariable = {
   id: number
@@ -277,7 +277,7 @@ const workingEnv = computed(() => {
     } as Environment
   } else if (props.action === "new") {
     return {
-      id: uniqueId(),
+      id: uniqueID(),
       name: "",
       variables: props.envVars(),
     }
@@ -331,7 +331,7 @@ watch(
         : "variables"
 
       if (props.editingEnvironmentIndex !== "Global") {
-        editingID.value = workingEnv.value?.id ?? uniqueId()
+        editingID.value = workingEnv.value?.id || uniqueID()
       }
       vars.value = pipe(
         workingEnv.value?.variables ?? [],
@@ -416,14 +416,12 @@ const saveEnvironment = () => {
 
   const variables = pipe(
     filteredVariables,
-    A.map((e) =>
-      e.secret ? { key: e.key, secret: e.secret, value: undefined } : e
-    )
+    A.map((e) => (e.secret ? { key: e.key, secret: e.secret } : e))
   )
 
   const environmentUpdated: Environment = {
     v: 1,
-    id: uniqueId(),
+    id: uniqueID(),
     name: editingName.value,
     variables,
   }

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

@@ -360,7 +360,7 @@ const saveEnvironment = async () => {
     return
   }
 
-  const filterdVariables = pipe(
+  const filteredVariables = pipe(
     vars.value,
     A.filterMap(
       flow(
@@ -371,17 +371,15 @@ const saveEnvironment = async () => {
   )
 
   const secretVariables = pipe(
-    filterdVariables,
+    filteredVariables,
     A.filterMapWithIndex((i, e) =>
       e.secret ? O.some({ key: e.key, value: e.value, varIndex: i }) : O.none
     )
   )
 
   const variables = pipe(
-    filterdVariables,
-    A.map((e) =>
-      e.secret ? { key: e.key, secret: e.secret, value: undefined } : e
-    )
+    filteredVariables,
+    A.map((e) => (e.secret ? { key: e.key, secret: e.secret } : e))
   )
 
   const environmentUpdated: Environment = {

packages/hoppscotch-common/src/helpers/import-export/import/insomniaEnv.ts

@@ -6,7 +6,7 @@ import { IMPORTER_INVALID_FILE_FORMAT } from "."
 import { z } from "zod"
 import { NonSecretEnvironment } from "@hoppscotch/data"
 import { safeParseJSONOrYAML } from "~/helpers/functional/yaml"
-import { uniqueId } from "lodash-es"
+import { uniqueID } from "~/helpers/utils/uniqueID"
 
 const insomniaResourcesSchema = z.object({
   resources: z.array(
@@ -67,7 +67,7 @@ export const insomniaEnvImporter = (contents: string[]) => {
 
     if (parsedInsomniaEnv.success) {
       const environment: NonSecretEnvironment = {
-        id: uniqueId(),
+        id: uniqueID(),
         v: 1,
         name: parsedInsomniaEnv.data.name,
         variables: Object.entries(parsedInsomniaEnv.data.data).map(

packages/hoppscotch-common/src/helpers/import-export/import/postmanEnv.ts

@@ -1,11 +1,11 @@
 import { Environment } from "@hoppscotch/data"
 import * as O from "fp-ts/Option"
 import * as TE from "fp-ts/TaskEither"
-import { uniqueId } from "lodash-es"
 import { z } from "zod"
 
 import { safeParseJSON } from "~/helpers/functional/json"
 import { IMPORTER_INVALID_FILE_FORMAT } from "."
+import { uniqueID } from "~/helpers/utils/uniqueID"
 
 const postmanEnvSchema = z.object({
   name: z.string(),
@@ -49,7 +49,7 @@ export const postmanEnvImporter = (contents: string[]) => {
   // Convert `values` to `variables` to match the format expected by the system
   const environments: Environment[] = validationResult.data.map(
     ({ name, values }) => ({
-      id: uniqueId(),
+      id: uniqueID(),
       v: 1,
       name,
       variables: values.map((entires) => ({ ...entires, secret: false })),

packages/hoppscotch-common/src/helpers/utils/uniqueID.ts

@@ -0,0 +1,3 @@
+export const uniqueID = (length = 16) => {
+  return Math.random().toString(36).substring(2, length)
+}

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

@@ -1,7 +1,8 @@
 import { Environment } from "@hoppscotch/data"
-import { cloneDeep, isEqual, uniqueId } from "lodash-es"
+import { cloneDeep, isEqual } from "lodash-es"
 import { combineLatest, Observable } from "rxjs"
 import { distinctUntilChanged, map, pluck } from "rxjs/operators"
+import { uniqueID } from "~/helpers/utils/uniqueID"
 import { getService } from "~/modules/dioc"
 import DispatchingStore, {
   defineDispatchers,
@@ -22,7 +23,7 @@ const defaultEnvironmentsState = {
   environments: [
     {
       v: 1,
-      id: uniqueId(),
+      id: uniqueID(),
       name: "My Environment Variables",
       variables: [],
     },
@@ -100,7 +101,7 @@ const dispatchers = defineDispatchers({
             }
           : {
               v: 1,
-              id: "",
+              id: uniqueID(),
               name,
               variables,
             },
@@ -123,7 +124,7 @@ const dispatchers = defineDispatchers({
         ...environments,
         {
           ...cloneDeep(newEnvironment),
-          id: uniqueId(),
+          id: uniqueID(),
           name: `${newEnvironment.name} - Duplicate`,
         },
       ],

packages/hoppscotch-data/src/environment/index.ts

@@ -5,7 +5,7 @@ import { InferredEntity, createVersionedEntity } from "verzod"
 import { z } from "zod"
 
 import V0_VERSION from "./v/0"
-import V1_VERSION from "./v/1"
+import V1_VERSION, { uniqueID } from "./v/1"
 
 const versionedObject = z.object({
   v: z.number(),
@@ -165,7 +165,7 @@ export const translateToNewEnvironment = (x: any): Environment => {
   if (x.v && x.v === EnvironmentSchemaVersion) return x
 
   // Legacy
-  const id = x.id ?? ""
+  const id = x.id || uniqueID()
   const name = x.name ?? "Untitled"
   const variables = (x.variables ?? []).map(translateToNewEnvironmentVariables)
 

packages/hoppscotch-data/src/environment/v/1.ts

@@ -2,6 +2,8 @@ import { z } from "zod"
 import { defineVersion } from "verzod"
 import { V0_SCHEMA } from "./0"
 
+export const uniqueID = () => Math.random().toString(36).substring(2, 16)
+
 export const V1_SCHEMA = z.object({
   v: z.literal(1),
   id: z.string(),
@@ -28,7 +30,7 @@ export default defineVersion({
     const result: z.infer<typeof V1_SCHEMA> = {
       ...old,
       v: 1,
-      id: old.id ?? "",
+      id: old.id || uniqueID(),
       variables: old.variables.map((variable) => {
         return {
           ...variable,