From 0196fee7e3f899945c7e97e4d005d6168b57a9c1 Mon Sep 17 00:00:00 2001
From: Aaryan Khandelwal <65252264+aaryan610@users.noreply.github.com>
Date: Fri, 1 Sep 2023 20:54:14 +0530
Subject: [PATCH] fix: sidebar cycle and module select (#2056)

---
 .../issues/sidebar-select/blocked.tsx         |  2 +-
 .../issues/sidebar-select/blocker.tsx         |  2 +-
 .../issues/sidebar-select/cycle.tsx           | 34 ++++++++++--------
 .../issues/sidebar-select/module.tsx          | 36 ++++++++++---------
 4 files changed, 40 insertions(+), 34 deletions(-)

diff --git a/apps/app/components/issues/sidebar-select/blocked.tsx b/apps/app/components/issues/sidebar-select/blocked.tsx
index fbe58b4b2..02cfd3b16 100644
--- a/apps/app/components/issues/sidebar-select/blocked.tsx
+++ b/apps/app/components/issues/sidebar-select/blocked.tsx
@@ -124,7 +124,7 @@ export const SidebarBlockedSelect: React.FC<Props> = ({
           </div>
           <button
             type="button"
-            className={`bg-custom-background-80 text-xs rounded px-2.5 py-0.5 ${
+            className={`bg-custom-background-80 text-xs text-custom-text-200 rounded px-2.5 py-0.5 ${
               disabled ? "cursor-not-allowed" : "cursor-pointer hover:bg-custom-background-80"
             }`}
             onClick={() => setIsBlockedModalOpen(true)}
diff --git a/apps/app/components/issues/sidebar-select/blocker.tsx b/apps/app/components/issues/sidebar-select/blocker.tsx
index 49a6bc505..eb15e9ade 100644
--- a/apps/app/components/issues/sidebar-select/blocker.tsx
+++ b/apps/app/components/issues/sidebar-select/blocker.tsx
@@ -126,7 +126,7 @@ export const SidebarBlockerSelect: React.FC<Props> = ({
           </div>
           <button
             type="button"
-            className={`bg-custom-background-80 text-xs rounded px-2.5 py-0.5 ${
+            className={`bg-custom-background-80 text-xs text-custom-text-200 rounded px-2.5 py-0.5 ${
               disabled ? "cursor-not-allowed" : "cursor-pointer hover:bg-custom-background-80"
             }`}
             onClick={() => setIsBlockerModalOpen(true)}
diff --git a/apps/app/components/issues/sidebar-select/cycle.tsx b/apps/app/components/issues/sidebar-select/cycle.tsx
index 3451be2c3..8fbfcf707 100644
--- a/apps/app/components/issues/sidebar-select/cycle.tsx
+++ b/apps/app/components/issues/sidebar-select/cycle.tsx
@@ -62,23 +62,27 @@ export const SidebarCycleSelect: React.FC<Props> = ({
   return (
     <CustomSelect
       customButton={
-        <Tooltip
-          position="left"
-          tooltipContent={`${issueCycle ? issueCycle.cycle_detail.name : "No cycle"}`}
-        >
-          <button
-            type="button"
-            className={`bg-custom-background-80 text-xs rounded px-2.5 py-0.5 w-full flex ${
-              disabled ? "cursor-not-allowed" : ""
-            }`}
+        <div>
+          <Tooltip
+            position="left"
+            tooltipContent={`${issueCycle ? issueCycle.cycle_detail.name : "No cycle"}`}
           >
-            <span
-              className={`truncate ${issueCycle ? "text-custom-text-100" : "text-custom-text-200"}`}
+            <button
+              type="button"
+              className={`bg-custom-background-80 text-xs rounded px-2.5 py-0.5 w-full flex ${
+                disabled ? "cursor-not-allowed" : ""
+              }`}
             >
-              {issueCycle ? issueCycle.cycle_detail.name : "No cycle"}
-            </span>
-          </button>
-        </Tooltip>
+              <span
+                className={`truncate ${
+                  issueCycle ? "text-custom-text-100" : "text-custom-text-200"
+                }`}
+              >
+                {issueCycle ? issueCycle.cycle_detail.name : "No cycle"}
+              </span>
+            </button>
+          </Tooltip>
+        </div>
       }
       value={issueCycle ? issueCycle.cycle_detail.id : null}
       onChange={(value: any) => {
diff --git a/apps/app/components/issues/sidebar-select/module.tsx b/apps/app/components/issues/sidebar-select/module.tsx
index a183fe951..c9599bdf4 100644
--- a/apps/app/components/issues/sidebar-select/module.tsx
+++ b/apps/app/components/issues/sidebar-select/module.tsx
@@ -56,27 +56,29 @@ export const SidebarModuleSelect: React.FC<Props> = ({
   return (
     <CustomSelect
       customButton={
-        <Tooltip
-          position="left"
-          tooltipContent={`${
-            modules?.find((m) => m.id === issueModule?.module)?.name ?? "No module"
-          }`}
-        >
-          <button
-            type="button"
-            className={`bg-custom-background-80 text-xs rounded px-2.5 py-0.5 w-full flex ${
-              disabled ? "cursor-not-allowed" : ""
+        <div>
+          <Tooltip
+            position="left"
+            tooltipContent={`${
+              modules?.find((m) => m.id === issueModule?.module)?.name ?? "No module"
             }`}
           >
-            <span
-              className={`truncate ${
-                issueModule ? "text-custom-text-100" : "text-custom-text-200"
+            <button
+              type="button"
+              className={`bg-custom-background-80 text-xs rounded px-2.5 py-0.5 w-full flex ${
+                disabled ? "cursor-not-allowed" : ""
               }`}
             >
-              {modules?.find((m) => m.id === issueModule?.module)?.name ?? "No module"}
-            </span>
-          </button>
-        </Tooltip>
+              <span
+                className={`truncate ${
+                  issueModule ? "text-custom-text-100" : "text-custom-text-200"
+                }`}
+              >
+                {modules?.find((m) => m.id === issueModule?.module)?.name ?? "No module"}
+              </span>
+            </button>
+          </Tooltip>
+        </div>
       }
       value={issueModule ? issueModule.module_detail?.id : null}
       onChange={(value: any) => {