From b83d98ecc2c993d57533149ce3fcb8af7a6e5583 Mon Sep 17 00:00:00 2001
From: francesco <francesco@camberi.com>
Date: Fri, 13 Sep 2024 20:06:31 +0200
Subject: [PATCH] Fix for error when rendering multiple app checks. Fix for
 Cloud css not loading correctly between projects

---
 packages/firebase_firecms/src/hooks/useAppCheck.ts | 12 ++++++++++++
 packages/firecms_cloud/src/api/projects.ts         |  1 +
 packages/ui/src/components/Select.tsx              |  8 ++++----
 3 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/packages/firebase_firecms/src/hooks/useAppCheck.ts b/packages/firebase_firecms/src/hooks/useAppCheck.ts
index fd3924c65..7e47ca98c 100644
--- a/packages/firebase_firecms/src/hooks/useAppCheck.ts
+++ b/packages/firebase_firecms/src/hooks/useAppCheck.ts
@@ -69,6 +69,9 @@ export function useAppCheck({
             provider,
             isTokenAutoRefreshEnabled
         } = options;
+
+        removeCurrentAppCheckDiv();
+
         const appCheck = initializeAppCheck(firebaseApp, {
             provider,
             isTokenAutoRefreshEnabled
@@ -87,3 +90,12 @@ export function useAppCheck({
         error
     };
 }
+
+
+function removeCurrentAppCheckDiv() {
+    const div = document.getElementById("fire_app_check_[DEFAULT]");
+    if (div) {
+        div.remove();
+    }
+}
+
diff --git a/packages/firecms_cloud/src/api/projects.ts b/packages/firecms_cloud/src/api/projects.ts
index 12c5a4b70..a778cc3c3 100644
--- a/packages/firecms_cloud/src/api/projects.ts
+++ b/packages/firecms_cloud/src/api/projects.ts
@@ -212,6 +212,7 @@ export function buildProjectsApi(host: string, getBackendAuthToken: () => Promis
         doDelegatedLogin,
         getStripePortalLink,
 
+        host,
         getRemoteConfigUrl
     }
 }
diff --git a/packages/ui/src/components/Select.tsx b/packages/ui/src/components/Select.tsx
index 3c2ace714..09dc1c816 100644
--- a/packages/ui/src/components/Select.tsx
+++ b/packages/ui/src/components/Select.tsx
@@ -5,7 +5,8 @@ import {
     fieldBackgroundDisabledMixin,
     fieldBackgroundHoverMixin,
     fieldBackgroundInvisibleMixin,
-    fieldBackgroundMixin
+    fieldBackgroundMixin,
+    focusedDisabled
 } from "../styles";
 import { CheckIcon, ExpandMoreIcon } from "../icons";
 import { cls } from "../util";
@@ -161,7 +162,7 @@ export const Select = forwardRef<HTMLDivElement, SelectProps>(({
             </div>
             <SelectPrimitive.Portal>
                 <SelectPrimitive.Content position={position}
-                                         className={cls("z-50 relative overflow-hidden border bg-white dark:bg-gray-900 p-2 rounded-lg", defaultBorderMixin)}>
+                                         className={cls(focusedDisabled, "z-50 relative overflow-hidden border bg-white dark:bg-gray-900 p-2 rounded-lg", defaultBorderMixin)}>
                     <SelectPrimitive.Viewport className={"p-1"}
                                               style={{ maxHeight: "var(--radix-select-content-available-height)" }}>
                         {children}
@@ -205,8 +206,7 @@ export function SelectItem({
             "[&>*]:w-full",
             "overflow-visible",
             className
-        )}
-    >
+        )}>
         <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
         <div
             className="absolute left-1 data-[state=checked]:block hidden">