diff --git a/backend/src/services/integration-auth/integration-sync-secret.ts b/backend/src/services/integration-auth/integration-sync-secret.ts
index 449d2d14d..197c1f940 100644
--- a/backend/src/services/integration-auth/integration-sync-secret.ts
+++ b/backend/src/services/integration-auth/integration-sync-secret.ts
@@ -3632,15 +3632,13 @@ const syncSecretsBitBucket = async ({
 
   let hasNextPage = true;
 
-  let variablesUrl: string;
+  const rootUrl = integration.targetServiceId
+    ? // scope: deployment environment
+      `${IntegrationUrls.BITBUCKET_API_URL}/2.0/repositories/${integration.targetEnvironmentId}/${integration.appId}/deployments_config/environments/${integration.targetServiceId}/variables`
+    : // scope: repository
+      `${IntegrationUrls.BITBUCKET_API_URL}/2.0/repositories/${integration.targetEnvironmentId}/${integration.appId}/pipelines_config/variables`;
 
-  if (integration.targetServiceId) {
-    // scope: deployment environment
-    variablesUrl = `${IntegrationUrls.BITBUCKET_API_URL}/2.0/repositories/${integration.targetEnvironmentId}/${integration.appId}/deployments_config/environments/${integration.targetServiceId}/variables`;
-  } else {
-    // scope: repository
-    variablesUrl = `${IntegrationUrls.BITBUCKET_API_URL}/2.0/repositories/${integration.targetEnvironmentId}/${integration.appId}/pipelines_config/variables`;
-  }
+  let variablesUrl = rootUrl;
 
   while (hasNextPage) {
     const { data }: { data: VariablesResponse } = await request.get(variablesUrl, {
@@ -3667,7 +3665,7 @@ const syncSecretsBitBucket = async ({
     if (key in res) {
       // update existing secret
       await request.put(
-        `${variablesUrl}/${res[key].uuid}`,
+        `${rootUrl}/${res[key].uuid}`,
         {
           key,
           value: secrets[key].value,
@@ -3683,7 +3681,7 @@ const syncSecretsBitBucket = async ({
     } else {
       // create new secret
       await request.post(
-        variablesUrl,
+        rootUrl,
         {
           key,
           value: secrets[key].value,
diff --git a/frontend/src/components/v2/MultiSelect/MultiSelect.tsx b/frontend/src/components/v2/FilterableSelect/FilterableSelect.tsx
similarity index 92%
rename from frontend/src/components/v2/MultiSelect/MultiSelect.tsx
rename to frontend/src/components/v2/FilterableSelect/FilterableSelect.tsx
index 987dda90f..5333d79d2 100644
--- a/frontend/src/components/v2/MultiSelect/MultiSelect.tsx
+++ b/frontend/src/components/v2/FilterableSelect/FilterableSelect.tsx
@@ -7,7 +7,7 @@ import Select, {
   Props
 } from "react-select";
 import { faCheckCircle, faCircleXmark } from "@fortawesome/free-regular-svg-icons";
-import { faChevronDown, faX } from "@fortawesome/free-solid-svg-icons";
+import { faChevronDown, faXmark } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { twMerge } from "tailwind-merge";
 
@@ -30,7 +30,7 @@ const ClearIndicator = <T,>(props: ClearIndicatorProps<T>) => {
 const MultiValueRemove = (props: MultiValueRemoveProps) => {
   return (
     <components.MultiValueRemove {...props}>
-      <FontAwesomeIcon icon={faX} size="xs" />
+      <FontAwesomeIcon icon={faXmark} size="xs" />
     </components.MultiValueRemove>
   );
 };
@@ -46,10 +46,10 @@ const Option = <T,>({ isSelected, children, ...props }: OptionProps<T>) => {
   );
 };
 
-export const MultiSelect = <T,>({ isMulti = true, ...props }: Props<T>) => (
+export const FilterableSelect = <T,>({ isMulti, closeMenuOnSelect, ...props }: Props<T>) => (
   <Select
     isMulti={isMulti}
-    closeMenuOnSelect={false}
+    closeMenuOnSelect={closeMenuOnSelect ?? !isMulti}
     hideSelectedOptions={false}
     unstyled
     styles={{
diff --git a/frontend/src/components/v2/FilterableSelect/index.tsx b/frontend/src/components/v2/FilterableSelect/index.tsx
new file mode 100644
index 000000000..03113e4fd
--- /dev/null
+++ b/frontend/src/components/v2/FilterableSelect/index.tsx
@@ -0,0 +1 @@
+export * from "./FilterableSelect";
diff --git a/frontend/src/components/v2/MultiSelect/index.tsx b/frontend/src/components/v2/MultiSelect/index.tsx
deleted file mode 100644
index 22ee6bcf1..000000000
--- a/frontend/src/components/v2/MultiSelect/index.tsx
+++ /dev/null
@@ -1 +0,0 @@
-export * from "./MultiSelect";
diff --git a/frontend/src/components/v2/index.tsx b/frontend/src/components/v2/index.tsx
index 7a1ee61d5..725a27ed3 100644
--- a/frontend/src/components/v2/index.tsx
+++ b/frontend/src/components/v2/index.tsx
@@ -11,6 +11,7 @@ export * from "./Drawer";
 export * from "./Dropdown";
 export * from "./EmailServiceSetupModal";
 export * from "./EmptyState";
+export * from "./FilterableSelect";
 export * from "./FontAwesomeSymbol";
 export * from "./FormControl";
 export * from "./HoverCardv2";
@@ -18,7 +19,6 @@ export * from "./IconButton";
 export * from "./Input";
 export * from "./Menu";
 export * from "./Modal";
-export * from "./MultiSelect";
 export * from "./NoticeBanner";
 export * from "./Pagination";
 export * from "./Popoverv2";
diff --git a/frontend/src/layouts/AppLayout/AppLayout.tsx b/frontend/src/layouts/AppLayout/AppLayout.tsx
index 920c9eaca..d4d60d274 100644
--- a/frontend/src/layouts/AppLayout/AppLayout.tsx
+++ b/frontend/src/layouts/AppLayout/AppLayout.tsx
@@ -282,7 +282,7 @@ export const AppLayout = ({ children }: LayoutProps) => {
   );
 
   const { data: projectTemplates = [] } = useListProjectTemplates({
-    enabled: canReadProjectTemplates && subscription?.projectTemplates
+    enabled: Boolean(canReadProjectTemplates && subscription?.projectTemplates)
   });
 
   const onCreateProject = async ({ name, addMembers, kmsKeyId, template }: TAddProjectFormData) => {
diff --git a/frontend/src/pages/integrations/bitbucket/create.tsx b/frontend/src/pages/integrations/bitbucket/create.tsx
index 4075bfe5b..d641253dc 100644
--- a/frontend/src/pages/integrations/bitbucket/create.tsx
+++ b/frontend/src/pages/integrations/bitbucket/create.tsx
@@ -10,9 +10,9 @@ import {
   Button,
   Card,
   CardTitle,
+  FilterableSelect,
   FormControl,
   Input,
-  MultiSelect,
   Spinner
 } from "@app/components/v2";
 import { useWorkspace } from "@app/context";
@@ -174,9 +174,7 @@ export default function BitBucketCreateIntegrationPage() {
               isError={Boolean(error)}
               label="Project Environment"
             >
-              <MultiSelect
-                closeMenuOnSelect
-                isMulti={false}
+              <FilterableSelect
                 getOptionValue={(option) => option.slug}
                 value={value}
                 getOptionLabel={(option) => option.name}
@@ -210,9 +208,7 @@ export default function BitBucketCreateIntegrationPage() {
               isError={Boolean(error)}
               label="Bitbucket Workspace"
             >
-              <MultiSelect
-                closeMenuOnSelect
-                isMulti={false}
+              <FilterableSelect
                 getOptionValue={(option) => option.slug}
                 value={value}
                 getOptionLabel={(option) => option.name}
@@ -231,9 +227,7 @@ export default function BitBucketCreateIntegrationPage() {
           name="targetRepo"
           render={({ field: { value, onChange }, fieldState: { error } }) => (
             <FormControl errorText={error?.message} isError={Boolean(error)} label="Bitbucket Repo">
-              <MultiSelect
-                closeMenuOnSelect
-                isMulti={false}
+              <FilterableSelect
                 getOptionValue={(option) => option.appId!}
                 value={value}
                 getOptionLabel={(option) => option.name}
@@ -252,9 +246,7 @@ export default function BitBucketCreateIntegrationPage() {
           name="scope"
           render={({ field: { value, onChange }, fieldState: { error } }) => (
             <FormControl errorText={error?.message} isError={Boolean(error)} label="Scope">
-              <MultiSelect
-                closeMenuOnSelect
-                isMulti={false}
+              <FilterableSelect
                 value={value}
                 getOptionValue={(option) => option.value}
                 getOptionLabel={(option) => option.label}
@@ -275,9 +267,7 @@ export default function BitBucketCreateIntegrationPage() {
                 isError={Boolean(error)}
                 label="Bitbucket Deployment Environment"
               >
-                <MultiSelect
-                  closeMenuOnSelect
-                  isMulti={false}
+                <FilterableSelect
                   getOptionValue={(option) => option.uuid}
                   value={value}
                   getOptionLabel={(option) => option.name}
diff --git a/frontend/src/pages/org/[id]/overview/index.tsx b/frontend/src/pages/org/[id]/overview/index.tsx
index 89aec519e..af90f126d 100644
--- a/frontend/src/pages/org/[id]/overview/index.tsx
+++ b/frontend/src/pages/org/[id]/overview/index.tsx
@@ -589,7 +589,7 @@ const OrganizationPage = () => {
   );
 
   const { data: projectTemplates = [] } = useListProjectTemplates({
-    enabled: canReadProjectTemplates && subscription?.projectTemplates
+    enabled: Boolean(canReadProjectTemplates && subscription?.projectTemplates)
   });
 
   const isAddingProjectsAllowed = subscription?.workspaceLimit
diff --git a/frontend/src/views/Project/MembersPage/components/MembersTab/components/AddMemberModal.tsx b/frontend/src/views/Project/MembersPage/components/MembersTab/components/AddMemberModal.tsx
index d1356324b..389f71868 100644
--- a/frontend/src/views/Project/MembersPage/components/MembersTab/components/AddMemberModal.tsx
+++ b/frontend/src/views/Project/MembersPage/components/MembersTab/components/AddMemberModal.tsx
@@ -15,10 +15,10 @@ import {
   DropdownMenuContent,
   DropdownMenuItem,
   DropdownMenuTrigger,
+  FilterableSelect,
   FormControl,
   Modal,
-  ModalContent,
-  MultiSelect
+  ModalContent
 } from "@app/components/v2";
 import { useOrganization, useWorkspace } from "@app/context";
 import {
@@ -153,7 +153,7 @@ export const AddMemberModal = ({ popUp, handlePopUpToggle }: Props) => {
                     errorText={errors.orgMemberships?.[0]?.message}
                     label="Invite users to project"
                   >
-                    <MultiSelect
+                    <FilterableSelect
                       className="w-full"
                       placeholder="Add one or more users..."
                       isMulti
diff --git a/frontend/src/views/SecretMainPage/components/CreateSecretForm/CreateSecretForm.tsx b/frontend/src/views/SecretMainPage/components/CreateSecretForm/CreateSecretForm.tsx
index b8a49053d..06abc08e6 100644
--- a/frontend/src/views/SecretMainPage/components/CreateSecretForm/CreateSecretForm.tsx
+++ b/frontend/src/views/SecretMainPage/components/CreateSecretForm/CreateSecretForm.tsx
@@ -6,7 +6,7 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
 
 import { createNotification } from "@app/components/notifications";
-import { Button, FormControl, Input, MultiSelect } from "@app/components/v2";
+import { Button, FilterableSelect, FormControl, Input } from "@app/components/v2";
 import { InfisicalSecretInput } from "@app/components/v2/InfisicalSecretInput";
 import { ProjectPermissionActions, ProjectPermissionSub, useProjectPermission } from "@app/context";
 import { getKeyValue } from "@app/helpers/parseEnvVar";
@@ -148,7 +148,7 @@ export const CreateSecretForm = ({
               )
             }
           >
-            <MultiSelect
+            <FilterableSelect
               className="w-full"
               placeholder="Select tags to assign to secret..."
               isMulti
diff --git a/frontend/src/views/SecretOverviewPage/components/CreateSecretForm/CreateSecretForm.tsx b/frontend/src/views/SecretOverviewPage/components/CreateSecretForm/CreateSecretForm.tsx
index 4f675a099..0fd953a1f 100644
--- a/frontend/src/views/SecretOverviewPage/components/CreateSecretForm/CreateSecretForm.tsx
+++ b/frontend/src/views/SecretOverviewPage/components/CreateSecretForm/CreateSecretForm.tsx
@@ -10,10 +10,10 @@ import { createNotification } from "@app/components/notifications";
 import {
   Button,
   Checkbox,
+  FilterableSelect,
   FormControl,
   FormLabel,
   Input,
-  MultiSelect,
   Tooltip
 } from "@app/components/v2";
 import { InfisicalSecretInput } from "@app/components/v2/InfisicalSecretInput";
@@ -249,7 +249,7 @@ export const CreateSecretForm = ({ secretPath = "/", getSecretByKey, onClose }:
               )
             }
           >
-            <MultiSelect
+            <FilterableSelect
               className="w-full"
               placeholder="Select tags to assign to secrets..."
               isMulti