fix auth indicator

Author: gatzjames

packages/insomnia/src/ui/components/panes/request-group-pane.tsx

@@ -3,6 +3,7 @@ import { Tab, TabList, TabPanel, Tabs } from 'react-aria-components';
 import { useRouteLoaderData } from 'react-router-dom';
 
 import { Settings } from '../../../models/settings';
+import { getAuthObjectOrNull } from '../../../network/authentication';
 import { useRequestGroupPatcher } from '../../hooks/use-request';
 import { useActiveRequestSyncVCSVersion, useGitVCSVersion } from '../../hooks/use-vcs-version';
 import { RequestGroupLoaderData } from '../../routes/request-group';
@@ -45,6 +46,9 @@ export const RequestGroupPane: FC<{ settings: Settings }> = ({ settings }) => {
     }
   };
 
+  const requestGroupAuth = getAuthObjectOrNull(activeRequestGroup.authentication);
+  const isNoneOrInherited = requestGroupAuth?.type === 'none' || requestGroupAuth === null;
+
   return (
     <>
       <Tabs aria-label='Request group tabs' className="flex-1 w-full h-full flex flex-col">
@@ -53,7 +57,12 @@ export const RequestGroupPane: FC<{ settings: Settings }> = ({ settings }) => {
             className='flex-shrink-0 h-full flex items-center justify-between cursor-pointer gap-2 outline-none select-none px-3 py-1 text-[--hl] aria-selected:text-[--color-font]  hover:bg-[--hl-sm] hover:text-[--color-font] aria-selected:bg-[--hl-xs] aria-selected:focus:bg-[--hl-sm] aria-selected:hover:bg-[--hl-sm] focus:bg-[--hl-sm] transition-colors duration-300'
             id='auth'
           >
-            Auth
+            <span>Auth</span>
+            {!isNoneOrInherited && (
+              <span className='p-1 min-w-6 h-6 flex items-center justify-center text-xs rounded-lg border border-solid border-[--hl]'>
+                <span className='w-2 h-2 bg-green-500 rounded-full' />
+              </span>
+            )}
           </Tab>
           <Tab
             className='flex-shrink-0 h-full flex items-center justify-between cursor-pointer gap-2 outline-none select-none px-3 py-1 text-[--hl] aria-selected:text-[--color-font]  hover:bg-[--hl-sm] hover:text-[--color-font] aria-selected:bg-[--hl-xs] aria-selected:focus:bg-[--hl-sm] aria-selected:hover:bg-[--hl-sm] focus:bg-[--hl-sm] transition-colors duration-300'

packages/insomnia/src/ui/components/panes/request-pane.tsx

@@ -95,7 +95,8 @@ export const RequestPane: FC<Props> = ({
     getContentTypeFromHeaders(activeRequest.headers) ||
     activeRequest.body.mimeType;
   const isBodyEmpty = Boolean(typeof activeRequest.body.mimeType !== 'string' && !activeRequest.body.text);
-  const hasAuthentication = getAuthObjectOrNull(activeRequest.authentication)?.type !== 'none';
+  const requestAuth = getAuthObjectOrNull(activeRequest.authentication);
+  const isNoneOrInherited = requestAuth?.type === 'none' || requestAuth === null;
 
   return (
     <Pane type="request">
@@ -140,7 +141,7 @@ export const RequestPane: FC<Props> = ({
           >
             <span>Auth</span>
 
-            {hasAuthentication && (
+            {!isNoneOrInherited && (
               <span className='p-1 min-w-6 h-6 flex items-center justify-center text-xs rounded-lg border border-solid border-[--hl]'>
                 <span className='w-2 h-2 bg-green-500 rounded-full' />
               </span>

packages/insomnia/src/ui/components/websockets/websocket-request-pane.tsx

@@ -281,7 +281,8 @@ export const WebSocketRequestPane: FC<Props> = ({ environment }) => {
   const urlHasQueryParameters = activeRequest.url.indexOf('?') >= 0;
   // Reset the response pane state when we switch requests, the environment gets modified, or the (Git|Sync)VCS version changes
   const uniqueKey = `${environment?.modified}::${requestId}::${gitVersion}::${activeRequestSyncVersion}::${activeRequestMeta.activeResponseId}`;
-  const hasAuthentication = getAuthObjectOrNull(activeRequest.authentication)?.type !== 'none';
+  const requestAuth = getAuthObjectOrNull(activeRequest.authentication);
+  const isNoneOrInherited = requestAuth?.type === 'none' || requestAuth === null;
 
   return (
     <Pane type="request">
@@ -322,7 +323,7 @@ export const WebSocketRequestPane: FC<Props> = ({ environment }) => {
             id='auth'
           >
             <span>Auth</span>
-            {hasAuthentication && (
+            {!isNoneOrInherited && (
               <span className='p-1 min-w-6 h-6 flex items-center justify-center text-xs rounded-lg border border-solid border-[--hl]'>
                 <span className='w-2 h-2 bg-green-500 rounded-full' />
               </span>