From f5a4ad58ab08beb5e6090173ba708fa7f4a2644b Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 12 May 2023 08:02:21 +0100
Subject: [PATCH 1/2] Fix alphabetical sorting for tables

---
 .../components/backend/TableNavigator/TableNavigator.svelte    | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/builder/src/components/backend/TableNavigator/TableNavigator.svelte b/packages/builder/src/components/backend/TableNavigator/TableNavigator.svelte
index 94b9020203..f1337e88d4 100644
--- a/packages/builder/src/components/backend/TableNavigator/TableNavigator.svelte
+++ b/packages/builder/src/components/backend/TableNavigator/TableNavigator.svelte
@@ -6,7 +6,8 @@
   import NavItem from "components/common/NavItem.svelte"
   import { goto, isActive } from "@roxi/routify"
 
-  const alphabetical = (a, b) => a.name?.toLowerCase() > b.name?.toLowerCase()
+  const alphabetical = (a, b) =>
+    a.name?.toLowerCase() > b.name?.toLowerCase() ? 1 : -1
 
   export let sourceId
 

From a00d502acbec98fd6e6a84df3273d68b8189fa99 Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Fri, 12 May 2023 08:04:34 +0100
Subject: [PATCH 2/2] Add title attribute to reveal full screen URLs when
 hovering in screen list panel

---
 packages/builder/src/components/common/NavItem.svelte          | 3 ++-
 .../[screenId]/screens/_components/ScreenListPanel.svelte      | 1 +
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/builder/src/components/common/NavItem.svelte b/packages/builder/src/components/common/NavItem.svelte
index 1fd43e2c70..73a8d3d647 100644
--- a/packages/builder/src/components/common/NavItem.svelte
+++ b/packages/builder/src/components/common/NavItem.svelte
@@ -17,6 +17,7 @@
   export let highlighted = false
   export let rightAlignIcon = false
   export let id
+  export let showTooltip = false
 
   const scrollApi = getContext("scroll")
   const dispatch = createEventDispatcher()
@@ -84,7 +85,7 @@
         <Icon color={iconColor} size="S" name={icon} />
       </div>
     {/if}
-    <div class="text">{text}</div>
+    <div class="text" title={showTooltip ? text : null}>{text}</div>
     {#if withActions}
       <div class="actions">
         <slot />
diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/screens/_components/ScreenListPanel.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/screens/_components/ScreenListPanel.svelte
index a6fd9089b1..06f9f86eb6 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/screens/_components/ScreenListPanel.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/screens/_components/ScreenListPanel.svelte
@@ -59,6 +59,7 @@
       text={screen.routing.route}
       on:click={() => store.actions.screens.select(screen._id)}
       rightAlignIcon
+      showTooltip
     >
       <ScreenDropdownMenu screenId={screen._id} />
       <RoleIndicator slot="right" roleId={screen.routing.roleId} />