chore: root collection auth issue and ui update

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

@@ -249,7 +249,7 @@
               :icon="masking && header.source === 'auth' ? IconEye : IconEyeOff"
               @click="toggleMask()"
             />
-            <span class="aspect-square w-[2.05rem]"></span>
+            <span v-else class="aspect-square w-[2.05rem]"></span>
             <span>
               <HoppButtonSecondary
                 v-tippy="{ theme: 'tooltip' }"

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

@@ -102,14 +102,25 @@ export function cascaseParentCollectionForHeaderAuth(
 
     const isRootCollection = path.length === 1
 
-    // Check if authType is not 'inherit'
-    if (parentFolderAuth?.authType !== "inherit" || isRootCollection) {
+    if (parentFolderAuth?.authType === "inherit" && isRootCollection) {
+      auth = {
+        parentID: parentFolder.id ?? folderPath,
+        parentName: parentFolder.name,
+        inheritedAuth: {
+          authType: "none",
+          authActive: true,
+        },
+      }
+    }
+
+    if (parentFolderAuth?.authType !== "inherit") {
       auth = {
         parentID: parentFolder.id ?? folderPath,
         parentName: parentFolder.name,
         inheritedAuth: parentFolderAuth,
       }
     }
+
     // Update headers, overwriting duplicates by key
     if (parentFolderHeaders) {
       const activeHeaders = parentFolderHeaders.filter((h) => h.active)