increase blur timeout

Author: jpinsonneau

web/src/components/dropdowns/group-dropdown.tsx

@@ -38,7 +38,7 @@ export const GroupDropdown: React.FC<GroupDropdownProps> = ({
           isDisabled={disabled}
           isExpanded={isOpen}
           onClick={() => setOpen(!isOpen)}
-          onBlur={() => setTimeout(() => setOpen(false), 100)}
+          onBlur={() => setTimeout(() => setOpen(false), 500)}
         >
           {getGroupName(selected, scopes, t)}
         </MenuToggle>

web/src/components/dropdowns/layout-dropdown.tsx

@@ -53,7 +53,7 @@ export const LayoutDropdown: React.FC<LayoutDropdownProps> = ({ selected, setLay
           id={`${id}-dropdown`}
           isExpanded={isOpen}
           onClick={() => setOpen(!isOpen)}
-          onBlur={() => setTimeout(() => setOpen(false), 100)}
+          onBlur={() => setTimeout(() => setOpen(false), 500)}
         >
           {getLayoutDisplay(selected)}
         </MenuToggle>

web/src/components/dropdowns/metric-type-dropdown.tsx

@@ -56,7 +56,7 @@ export const MetricTypeDropdown: React.FC<MetricTypeDropdownProps> = ({
           id={`${id}-dropdown`}
           isExpanded={isOpen}
           onClick={() => setOpen(!isOpen)}
-          onBlur={() => setTimeout(() => setOpen(false), 100)}
+          onBlur={() => setTimeout(() => setOpen(false), 500)}
         >
           {getMetricDisplay(selected as MetricType)}
         </MenuToggle>

web/src/components/dropdowns/refresh-dropdown.tsx

@@ -58,7 +58,7 @@ export const RefreshDropdown: React.FC<RefreshDropdownProps> = ({ disabled, id,
             id={`${id}-dropdown`}
             isDisabled={disabled}
             onClick={() => setOpen(!isOpen)}
-            onBlur={() => setTimeout(() => setOpen(false), 100)}
+            onBlur={() => setTimeout(() => setOpen(false), 500)}
             isExpanded={isOpen}
           >
             {refreshOptions[selectedKey as keyof typeof refreshOptions]}

web/src/components/dropdowns/scope-dropdown.tsx

@@ -30,7 +30,7 @@ export const ScopeDropdown: React.FC<ScopeDropdownProps> = ({ selected, setScope
           id={`${id}-dropdown`}
           isExpanded={isOpen}
           onClick={() => setOpen(!isOpen)}
-          onBlur={() => setTimeout(() => setOpen(false), 100)}
+          onBlur={() => setTimeout(() => setOpen(false), 500)}
         >
           {scopes.find(sc => sc.id === selected)?.name || t('n/a')}
         </MenuToggle>

web/src/components/dropdowns/time-range-dropdown.tsx

@@ -91,7 +91,7 @@ export const TimeRangeDropdown: React.FC<TimeRangeDropdownProps> = ({ id, range,
             data-test={`${id}-dropdown`}
             id={`${id}-dropdown`}
             onClick={() => setOpen(!isOpen)}
-            onBlur={() => setTimeout(() => setOpen(false), 100)}
+            onBlur={() => setTimeout(() => setOpen(false), 500)}
           >
             {selectedKey === customTimeRangeKey
               ? textContent(false)

web/src/components/dropdowns/truncate-dropdown.tsx

@@ -50,7 +50,7 @@ export const TruncateDropdown: React.FC<TruncateDropdownProps> = ({ selected, se
           id={`${id}-dropdown`}
           isExpanded={isOpen}
           onClick={() => setOpen(!isOpen)}
-          onBlur={() => setTimeout(() => setOpen(false), 100)}
+          onBlur={() => setTimeout(() => setOpen(false), 500)}
         >
           {getTruncateDisplay(selected)}
         </MenuToggle>

web/src/components/toolbar/filters/compare-filter.tsx

@@ -99,7 +99,7 @@ export const CompareFilter: React.FC<CompareFilterProps> = ({ value, setValue, c
             }}
             onClick={() => setOpen(!isOpen)}
             isExpanded={isOpen}
-            onBlur={() => setTimeout(() => setOpen(false), 100)}
+            onBlur={() => setTimeout(() => setOpen(false), 500)}
           />
         )}
       >

web/src/components/toolbar/links-overflow.tsx

@@ -76,7 +76,7 @@ export const LinksOverflow: React.FC<LinksOverflowProps> = ({ id, items }) => {
               icon={<EllipsisVIcon />}
               isExpanded={isOpen}
               onClick={() => setOpen(!isOpen)}
-              onBlur={() => setTimeout(() => setOpen(false), 100)}
+              onBlur={() => setTimeout(() => setOpen(false), 500)}
             >
               <>
                 <EllipsisVIcon /> {t('More options')}