diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/LeftPanel/Screens/index.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/LeftPanel/Screens/index.svelte
index 47318c8530..2e993a5d93 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/LeftPanel/Screens/index.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/components/[componentId]/_components/LeftPanel/Screens/index.svelte
@@ -85,31 +85,32 @@
     </div>
   </div>
   <div on:scroll={handleScroll} bind:this={screensContainer} class="content">
-    {#each filteredScreens as screen (screen._id)}
-      <NavItem
-        icon={screen.routing.homeScreen ? "Home" : null}
-        indentLevel={0}
-        selected={$store.selectedScreenId === screen._id}
-        text={screen.routing.route}
-        on:click={() => store.actions.screens.select(screen._id)}
-        rightAlignIcon
-        showTooltip
-        selectedBy={$userSelectedResourceMap[screen._id]}
-      >
-        <DropdownMenu screenId={screen._id} />
-        <div slot="icon" class="icon">
-          <RoleIndicator roleId={screen.routing.roleId} />
-        </div>
-      </NavItem>
-    {/each}
+    {#if filteredScreens?.length}
+      {#each filteredScreens as screen (screen._id)}
+        <NavItem
+          icon={screen.routing.homeScreen ? "Home" : null}
+          indentLevel={0}
+          selected={$store.selectedScreenId === screen._id}
+          text={screen.routing.route}
+          on:click={() => store.actions.screens.select(screen._id)}
+          rightAlignIcon
+          showTooltip
+          selectedBy={$userSelectedResourceMap[screen._id]}
+        >
+          <DropdownMenu screenId={screen._id} />
+          <div slot="icon" class="icon">
+            <RoleIndicator roleId={screen.routing.roleId} />
+          </div>
+        </NavItem>
+      {/each}
+    {:else}
+      <Layout paddingY="L" paddingX="L">
+        <Body size="S">
+          There aren't any screens matching the current filters
+        </Body>
+      </Layout>
+    {/if}
   </div>
-  {#if !filteredScreens?.length}
-    <Layout paddingY="" paddingX="L">
-      <Body size="S">
-        There aren't any screens matching the current filters
-      </Body>
-    </Layout>
-  {/if}
 </div>
 
 <div class="newScreen" class:newScreenVisible={newScreen}>
