From f1cb417a5ee29c9d06d019ef19e3a911a319e254 Mon Sep 17 00:00:00 2001
From: Dmitry <mukovkin@yandex.ru>
Date: Mon, 19 Aug 2024 17:12:35 +0700
Subject: [PATCH] fix: improvement for body tab and RawBody empty string bug
 (#4273)

* feat(body-label): added label that showing tab is not empty

* fix(body-raw): value is not updated when was empty

---------

Co-authored-by: Dmitry Mukovkin <d.mukovkin@cft.ru>
---
 packages/hoppscotch-common/src/components/http/RawBody.vue   | 2 +-
 .../hoppscotch-common/src/components/http/RequestOptions.vue | 5 +++++
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/packages/hoppscotch-common/src/components/http/RawBody.vue b/packages/hoppscotch-common/src/components/http/RawBody.vue
index 07c639cb..7def623d 100644
--- a/packages/hoppscotch-common/src/components/http/RawBody.vue
+++ b/packages/hoppscotch-common/src/components/http/RawBody.vue
@@ -143,7 +143,7 @@ watch(rawParamsBody, (newVal) => {
 
 // propagate the edits from codemirror back to the body
 watch(codemirrorValue, (updatedValue) => {
-  if (updatedValue && updatedValue !== rawParamsBody.value) {
+  if (updatedValue !== undefined && updatedValue !== rawParamsBody.value) {
     rawParamsBody.value = updatedValue
   }
 })
diff --git a/packages/hoppscotch-common/src/components/http/RequestOptions.vue b/packages/hoppscotch-common/src/components/http/RequestOptions.vue
index 6f9afe1b..55c079e1 100644
--- a/packages/hoppscotch-common/src/components/http/RequestOptions.vue
+++ b/packages/hoppscotch-common/src/components/http/RequestOptions.vue
@@ -16,6 +16,7 @@
       v-if="properties?.includes('bodyParams') ?? true"
       :id="'bodyParams'"
       :label="`${t('tab.body')}`"
+      :indicator="isBodyFilled"
     >
       <HttpBody
         v-model:headers="request.headers"
@@ -154,6 +155,10 @@ const newActiveRequestVariablesCount = computed(() => {
   return count ? count : null
 })
 
+const isBodyFilled = computed(() => {
+  return Boolean(request.value.body.body && request.value.body.body.length > 0)
+})
+
 defineActionHandler("request.open-tab", ({ tab }) => {
   selectedOptionTab.value = tab as RESTOptionTabs
 })