diff --git a/plane-src/apps/web/core/components/issues/issue-detail/label/select/label-select.tsx b/plane-src/apps/web/core/components/issues/issue-detail/label/select/label-select.tsx
index 575f44f..fc65572 100644
--- a/plane-src/apps/web/core/components/issues/issue-detail/label/select/label-select.tsx
+++ b/plane-src/apps/web/core/components/issues/issue-detail/label/select/label-select.tsx
@@ -127,97 +127,103 @@ export const IssueLabelSelect = observer(function IssueLabelSelect(props: IIssue
         onChange={(value) => onSelect(value)}
         multiple
       >
-        <Combobox.Button as={Fragment}>
-          <button
-            ref={setReferenceElement}
-            type="button"
-            className="flex h-7.5 items-center rounded-[1rem] border-0 bg-transparent py-0.5 pl-0 pr-2 text-body-xs-medium text-placeholder whitespace-nowrap shadow-none outline-none"
-            onClick={() => !projectLabels && fetchLabels()}
-          >
-            {label}
-          </button>
-        </Combobox.Button>
-
-        {typeof document !== "undefined" &&
-          createPortal(
-            <Combobox.Options className="fixed z-[760]" static>
-              <div
-                className="nodedc-dropdown-surface nodedc-external-popup-anchor z-10 my-1 w-56 whitespace-nowrap"
-                ref={setPopperElement}
-                style={styles.popper}
-                {...attributes.popper}
+        {({ open }) => (
+          <>
+            <Combobox.Button as={Fragment}>
+              <button
+                ref={setReferenceElement}
+                type="button"
+                className="flex h-7.5 items-center rounded-[1rem] border-0 bg-transparent py-0.5 pl-0 pr-2 text-body-xs-medium text-placeholder whitespace-nowrap shadow-none outline-none"
+                onClick={() => !projectLabels && fetchLabels()}
               >
-                <div>
-                  <div className="nodedc-dropdown-search">
-                    <SearchIcon className="h-3.5 w-3.5 text-tertiary" />
-                    <Combobox.Input
-                      className="w-full bg-transparent px-0 py-0 text-12 text-secondary placeholder:text-placeholder outline-none focus:outline-none"
-                      value={query}
-                      onChange={(e) => setQuery(e.target.value)}
-                      placeholder={t("common.search.label")}
-                      displayValue={(assigned: any) => assigned?.name}
-                      onKeyDown={searchInputKeyDown}
-                      tabIndex={baseTabIndex}
-                    />
-                  </div>
-                </div>
-                <div className={`vertical-scrollbar mt-2 scrollbar-sm max-h-56 space-y-1 overflow-y-auto`}>
-                  {isLoading ? (
-                    <p className="px-2 py-2 text-center text-secondary">{t("common.loading")}</p>
-                  ) : filteredOptions.length > 0 ? (
-                    filteredOptions.map((option) => (
-                      <Combobox.Option
-                        key={option.value}
-                        value={option.value}
-                        className={({ selected }) =>
-                          `nodedc-dropdown-option cursor-pointer ${
-                            selected ? "text-primary" : "text-secondary"
-                          }`
-                        }
-                      >
-                        {({ selected }) => (
-                          <>
-                            {option.content}
-                            {selected && (
-                              <div className="flex-shrink-0">
-                                <CheckIcon className={`h-3.5 w-3.5`} />
-                              </div>
+                {label}
+              </button>
+            </Combobox.Button>
+
+            {open &&
+              typeof document !== "undefined" &&
+              createPortal(
+                <Combobox.Options className="fixed z-[760]" static>
+                  <div
+                    data-prevent-outside-click
+                    className="nodedc-dropdown-surface nodedc-external-popup-anchor z-10 my-1 w-56 whitespace-nowrap"
+                    ref={setPopperElement}
+                    style={styles.popper}
+                    {...attributes.popper}
+                  >
+                    <div>
+                      <div className="nodedc-dropdown-search">
+                        <SearchIcon className="h-3.5 w-3.5 text-tertiary" />
+                        <Combobox.Input
+                          className="w-full bg-transparent px-0 py-0 text-12 text-secondary placeholder:text-placeholder outline-none focus:outline-none"
+                          value={query}
+                          onChange={(e) => setQuery(e.target.value)}
+                          placeholder={t("common.search.label")}
+                          displayValue={(assigned: any) => assigned?.name}
+                          onKeyDown={searchInputKeyDown}
+                          tabIndex={baseTabIndex}
+                        />
+                      </div>
+                    </div>
+                    <div className={`vertical-scrollbar mt-2 scrollbar-sm max-h-56 space-y-1 overflow-y-auto`}>
+                      {isLoading ? (
+                        <p className="px-2 py-2 text-center text-secondary">{t("common.loading")}</p>
+                      ) : filteredOptions.length > 0 ? (
+                        filteredOptions.map((option) => (
+                          <Combobox.Option
+                            key={option.value}
+                            value={option.value}
+                            className={({ selected }) =>
+                              `nodedc-dropdown-option cursor-pointer ${
+                                selected ? "text-primary" : "text-secondary"
+                              }`
+                            }
+                          >
+                            {({ selected }) => (
+                              <>
+                                {option.content}
+                                {selected && (
+                                  <div className="flex-shrink-0">
+                                    <CheckIcon className={`h-3.5 w-3.5`} />
+                                  </div>
+                                )}
+                              </>
                             )}
-                          </>
-                        )}
-                      </Combobox.Option>
-                    ))
-                  ) : submitting ? (
-                    <Loader className="spin mx-auto h-3.5 w-3.5" />
-                  ) : canCreateLabel ? (
-                    <Combobox.Option
-                      value={query}
-                      onClick={(e) => {
-                        e.preventDefault();
-                        e.stopPropagation();
-                        if (!query.length) return;
-                        handleAddLabel(query);
-                      }}
-                      className={`rounded-[0.9rem] px-2 py-2 text-left text-secondary ${query.length ? "cursor-pointer hover:bg-white/6" : "cursor-default"}`}
-                    >
-                      {query.length ? (
-                        <>
-                          + {t("label.create.type")} <span className="text-primary">&quot;{query}&quot;</span>
-                        </>
+                          </Combobox.Option>
+                        ))
+                      ) : submitting ? (
+                        <Loader className="spin mx-auto h-3.5 w-3.5" />
+                      ) : canCreateLabel ? (
+                        <Combobox.Option
+                          value={query}
+                          onClick={(e) => {
+                            e.preventDefault();
+                            e.stopPropagation();
+                            if (!query.length) return;
+                            handleAddLabel(query);
+                          }}
+                          className={`rounded-[0.9rem] px-2 py-2 text-left text-secondary ${query.length ? "cursor-pointer hover:bg-white/6" : "cursor-default"}`}
+                        >
+                          {query.length ? (
+                            <>
+                              + {t("label.create.type")} <span className="text-primary">&quot;{query}&quot;</span>
+                            </>
+                          ) : (
+                            t("label.create.type")
+                          )}
+                        </Combobox.Option>
                       ) : (
-                        t("label.create.type")
+                        <p className="rounded-[0.9rem] px-2 py-2 text-left text-secondary">
+                          {t("common.search.no_matching_results")}
+                        </p>
                       )}
-                    </Combobox.Option>
-                  ) : (
-                    <p className="rounded-[0.9rem] px-2 py-2 text-left text-secondary">
-                      {t("common.search.no_matching_results")}
-                    </p>
-                  )}
-                </div>
-              </div>
-            </Combobox.Options>,
-            document.body
-          )}
+                    </div>
+                  </div>
+                </Combobox.Options>,
+                document.body
+              )}
+          </>
+        )}
       </Combobox>
     </>
   );