From cbc410f2c3bc44b4182207ea97f83a8197b7e041 Mon Sep 17 00:00:00 2001
From: sourcegraph-release-guild-bot
 <107104610+sourcegraph-release-guild-bot@users.noreply.github.com>
Date: Wed, 29 Nov 2023 09:39:59 -0500
Subject: [PATCH] [Backport 5.2] code-search: properly display disabled bulk
 operations (#58476)

code-search: properly display disabled bulk operations (#58461)

* properly display disabled menu items

* prettier

(cherry picked from commit db520b0871863a8f7b376c4bb7373a061b1ac9a6)

Co-authored-by: Bolaji Olajide <25608335+BolajiOlajide@users.noreply.github.com>
---
 .../enterprise/batches/DropdownButton.module.scss    | 12 +++++++++++-
 client/web/src/enterprise/batches/DropdownButton.tsx |  7 ++++++-
 2 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/client/web/src/enterprise/batches/DropdownButton.module.scss b/client/web/src/enterprise/batches/DropdownButton.module.scss
index c57c795d01f..77f2b9e0d1f 100644
--- a/client/web/src/enterprise/batches/DropdownButton.module.scss
+++ b/client/web/src/enterprise/batches/DropdownButton.module.scss
@@ -12,8 +12,18 @@
 
 .menu-list-item {
     padding: 0.5rem 1rem;
+    cursor: pointer;
 
-    &[data-reach-menu-item]:active {
+    &[data-reach-menu-item][aria-disabled='false']:active {
         --text-muted: var(--white);
     }
+
+    &[data-reach-menu-item][aria-disabled='true']:hover {
+        background-color: transparent;
+    }
+
+    &[data-reach-menu-item][aria-disabled='true'] {
+        cursor: not-allowed;
+        opacity: 0.7;
+    }
 }
diff --git a/client/web/src/enterprise/batches/DropdownButton.tsx b/client/web/src/enterprise/batches/DropdownButton.tsx
index fe81562b813..d5a1ed64b73 100644
--- a/client/web/src/enterprise/batches/DropdownButton.tsx
+++ b/client/web/src/enterprise/batches/DropdownButton.tsx
@@ -2,6 +2,7 @@ import React, { useCallback, useEffect, useMemo, useState } from 'react'
 
 import { mdiChevronDown } from '@mdi/js'
 import { VisuallyHidden } from '@reach/visually-hidden'
+import classNames from 'classnames'
 
 import {
     ProductStatusBadge,
@@ -179,7 +180,11 @@ const DropdownItem: React.FunctionComponent<React.PropsWithChildren<DropdownItem
 
     return (
         <MenuItem className={styles.menuListItem} onSelect={onSelect} disabled={action.disabled}>
-            <H4 className="mb-1">
+            <H4
+                className={classNames('mb-1', {
+                    'text-muted': action.disabled,
+                })}
+            >
                 {action.dropdownTitle}
                 {action.experimental && (
                     <>