From 4c6b1fe26503c6a997b37033d0504bbc838dea6e Mon Sep 17 00:00:00 2001
From: wobsoriano <sorianorobertc@gmail.com>
Date: Wed, 19 Feb 2025 17:05:03 -0800
Subject: [PATCH] chore(astro): Make sure only one fallback slot renders

---
 .../astro-components/control/Protect.astro    | 12 +++++++++--
 .../astro-components/control/ProtectSSR.astro | 21 ++++++++++++-------
 2 files changed, 23 insertions(+), 10 deletions(-)

diff --git a/packages/astro/src/astro-components/control/Protect.astro b/packages/astro/src/astro-components/control/Protect.astro
index 33e87bb2bd..1868132bd3 100644
--- a/packages/astro/src/astro-components/control/Protect.astro
+++ b/packages/astro/src/astro-components/control/Protect.astro
@@ -27,10 +27,18 @@ type Props = ProtectProps & {
 const { isStatic, ...props } = Astro.props;
 
 const ProtectComponent = isStaticOutput(isStatic) ? ProtectCSR : ProtectSSR;
+
+// Note: Astro server islands also use a "fallback" slot for loading states
+// See: https://docs.astro.build/en/guides/server-islands/#server-island-fallback-content
+// We use "protect-fallback" as our preferred slot name to avoid conflicts
+const hasProtectFallback = Astro.slots.has('protect-fallback');
 ---
 
 <ProtectComponent {...props}>
   <slot />
-  <slot name="protect-fallback" slot="protect-fallback" />
-  <slot name="fallback" slot="fallback" />
+  {hasProtectFallback ? (
+    <slot name="protect-fallback" slot="protect-fallback" />
+  ) : (
+    <slot name="fallback" slot="fallback" />
+  )}
 </ProtectComponent>
diff --git a/packages/astro/src/astro-components/control/ProtectSSR.astro b/packages/astro/src/astro-components/control/ProtectSSR.astro
index 236e0b9f02..4a1199d207 100644
--- a/packages/astro/src/astro-components/control/ProtectSSR.astro
+++ b/packages/astro/src/astro-components/control/ProtectSSR.astro
@@ -9,13 +9,18 @@ const isUnauthorized =
   (typeof Astro.props.condition === "function" &&
     !Astro.props.condition(has)) ||
   ((Astro.props.role || Astro.props.permission) && !has(Astro.props));
-
-// Note: Astro server islands also use a "fallback" slot for loading states
-// See: https://docs.astro.build/en/guides/server-islands/#server-island-fallback-content
-// We use "protect-fallback" as our preferred slot name to avoid conflicts
-const fallbackSlot = Astro.slots.has('protect-fallback') 
-  ? 'protect-fallback' 
-  : 'fallback';
+  
+const hasProtectFallback = Astro.slots.has('protect-fallback');
 ---
 
-{isUnauthorized ? <slot name={fallbackSlot} /> : <slot />}
+{
+  isUnauthorized ? (
+    hasProtectFallback ? (
+      <slot name="protect-fallback" />
+    ) : (
+      <slot name="fallback" />
+    )
+  ) : (
+    <slot />
+  )
+}