Merge branch 'develop' into release/2023.5.0-beta.0

packages/insomnia/src/models/__tests__/request.test.ts

@@ -1,5 +1,6 @@
 import { beforeEach, describe, expect, it, jest } from '@jest/globals';
 
+import { version } from '../../../package.json';
 import { globalBeforeEach } from '../../__jest__/before-each';
 import { CONTENT_TYPE_GRAPHQL } from '../../common/constants';
 import { newBodyGraphQL, updateMimeType } from '../../ui/components/panes/request-pane';
@@ -94,7 +95,7 @@ describe('updateMimeType()', () => {
         value: 'text/html',
       }, {
         'name': 'User-Agent',
-        'value': 'Insomnia/2023.4.0',
+        'value': `Insomnia/${version}`,
       },
     ]);
   });
@@ -134,7 +135,7 @@ describe('updateMimeType()', () => {
       },
       null, {
         'name': 'User-Agent',
-        'value': 'Insomnia/2023.4.0',
+        'value': `Insomnia/${version}`,
       },
     ]);
   });
@@ -158,7 +159,7 @@ describe('updateMimeType()', () => {
         value: 'text/html',
       }, {
         'name': 'User-Agent',
-        'value': 'Insomnia/2023.4.0',
+        'value': `Insomnia/${version}`,
       },
     ]);
   });
@@ -179,7 +180,7 @@ describe('updateMimeType()', () => {
     expect(newRequest.body).toEqual({});
     expect(newRequest.headers).toEqual([{
       'name': 'User-Agent',
-      'value': 'Insomnia/2023.4.0',
+      'value': `Insomnia/${version}`,
     }]);
   });
 

packages/insomnia/src/ui/components/base/dropdown/dropdown.tsx

@@ -44,11 +44,12 @@ export const Dropdown = forwardRef<DropdownHandle, DropdownProps>((props: Dropdo
     dataTestId = 'DropdownButton',
     isDisabled = false,
     onOpen,
+    onClose,
   } = props;
 
   const state: MenuTriggerState = useMenuTriggerState({
     ...props,
-    onOpenChange: isOpen => isOpen && onOpen?.(),
+    onOpenChange: isOpen => isOpen ? onOpen?.() : onClose?.(),
   });
 
   const triggerRef = useRef<HTMLButtonElement>(ref);

packages/insomnia/src/ui/components/dropdowns/environments-dropdown.tsx

@@ -1,4 +1,4 @@
-import React, { FC, useCallback, useRef } from 'react';
+import React, { FC, useRef, useState } from 'react';
 import { useSelector } from 'react-redux';
 import { useFetcher, useParams, useRouteLoaderData } from 'react-router-dom';
 
@@ -28,13 +28,10 @@ export const EnvironmentsDropdown: FC<Props> = () => {
   const hotKeyRegistry = useSelector(selectHotKeyRegistry);
   const setActiveEnvironmentFetcher = useFetcher();
   const dropdownRef = useRef<DropdownHandle>(null);
-
-  const toggleSwitchMenu = useCallback(() => {
-    dropdownRef.current?.toggle(true);
-  }, []);
+  const [isDropdownOpen, setIsDropdownOpen] = useState(false);
 
   useDocBodyKeyboardShortcuts({
-    environment_showSwitchMenu: toggleSwitchMenu,
+    environment_showSwitchMenu: () => setIsDropdownOpen(true),
   });
 
   // NOTE: Base environment might not exist if the users hasn't managed environments yet.
@@ -43,6 +40,9 @@ export const EnvironmentsDropdown: FC<Props> = () => {
   return (
     <Dropdown
       ref={dropdownRef}
+      isOpen={isDropdownOpen}
+      onOpen={() => setIsDropdownOpen(true)}
+      onClose={() => setIsDropdownOpen(false)}
       triggerButton={
         <DropdownButton
           className="btn btn--super-compact no-wrap"