From 2f69f723e70591f64f4182b433808a947c893392 Mon Sep 17 00:00:00 2001
From: liyasthomas <liyascthomas@gmail.com>
Date: Thu, 17 Feb 2022 21:00:13 +0530
Subject: [PATCH] fix: reactive key-value input placeholders

---
 packages/hoppscotch-app/components/graphql/RequestOptions.vue | 2 +-
 packages/hoppscotch-app/components/http/Headers.vue           | 2 +-
 packages/hoppscotch-app/components/http/Parameters.vue        | 2 +-
 packages/hoppscotch-app/components/http/URLEncodedParams.vue  | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/hoppscotch-app/components/graphql/RequestOptions.vue b/packages/hoppscotch-app/components/graphql/RequestOptions.vue
index bc29d315f..4e049a845 100644
--- a/packages/hoppscotch-app/components/graphql/RequestOptions.vue
+++ b/packages/hoppscotch-app/components/graphql/RequestOptions.vue
@@ -157,7 +157,7 @@
         <div v-else>
           <div
             v-for="(header, index) in workingHeaders"
-            :key="`header-${header.id}`"
+            :key="`header-${header.id}-${index}`"
             class="flex border-b divide-x divide-dividerLight border-dividerLight"
           >
             <SmartAutoComplete
diff --git a/packages/hoppscotch-app/components/http/Headers.vue b/packages/hoppscotch-app/components/http/Headers.vue
index ad975f43a..8ed22ef97 100644
--- a/packages/hoppscotch-app/components/http/Headers.vue
+++ b/packages/hoppscotch-app/components/http/Headers.vue
@@ -40,7 +40,7 @@
     <div v-else>
       <div
         v-for="(header, index) in workingHeaders"
-        :key="`header-${header.id}`"
+        :key="`header-${header.id}-${index}`"
         class="flex border-b divide-x divide-dividerLight border-dividerLight"
       >
         <SmartAutoComplete
diff --git a/packages/hoppscotch-app/components/http/Parameters.vue b/packages/hoppscotch-app/components/http/Parameters.vue
index 15b33e09d..fff3c3aa2 100644
--- a/packages/hoppscotch-app/components/http/Parameters.vue
+++ b/packages/hoppscotch-app/components/http/Parameters.vue
@@ -40,7 +40,7 @@
     <div v-else>
       <div
         v-for="(param, index) in workingParams"
-        :key="`param-${param.id}`"
+        :key="`param-${param.id}-${index}`"
         class="flex border-b divide-x divide-dividerLight border-dividerLight"
       >
         <SmartEnvInput
diff --git a/packages/hoppscotch-app/components/http/URLEncodedParams.vue b/packages/hoppscotch-app/components/http/URLEncodedParams.vue
index 137983162..882b405dd 100644
--- a/packages/hoppscotch-app/components/http/URLEncodedParams.vue
+++ b/packages/hoppscotch-app/components/http/URLEncodedParams.vue
@@ -40,7 +40,7 @@
     <div v-else>
       <div
         v-for="(param, index) in workingUrlEncodedParams"
-        :key="`param-${param.id}`"
+        :key="`param-${param.id}-${index}`"
         class="flex border-b divide-x divide-dividerLight border-dividerLight"
       >
         <SmartEnvInput