From 9af8b04c995a51ab6c750cd1781b1265e393256c Mon Sep 17 00:00:00 2001
From: Andrew Kingston <aptkingston@ssl-mail.com>
Date: Mon, 9 Nov 2020 08:43:36 +0000
Subject: [PATCH] Fix case sensitive screen alphabetical sorting

---
 .../userInterface/ComponentsHierarchy.svelte           | 10 ++++++----
 1 file changed, 6 insertions(+), 4 deletions(-)

diff --git a/packages/builder/src/components/userInterface/ComponentsHierarchy.svelte b/packages/builder/src/components/userInterface/ComponentsHierarchy.svelte
index 1b1ddbb759..78f17613c5 100644
--- a/packages/builder/src/components/userInterface/ComponentsHierarchy.svelte
+++ b/packages/builder/src/components/userInterface/ComponentsHierarchy.svelte
@@ -10,10 +10,12 @@
 
   export let screens = []
 
-  $: sortedScreens = screens.sort((s1, s2) =>
-    s1.props._instanceName > s2.props._instanceName ? 1 : -1
-  )
-  /* 
+  $: sortedScreens = screens.sort((s1, s2) => {
+    const name1 = s1.props._instanceName?.toLowerCase() ?? ""
+    const name2 = s2.props._instanceName?.toLowerCase() ?? ""
+    return name1 > name2 ? 1 : -1
+  })
+  /*
   Using a store here seems odd.... 
   have a look in the <ComponentsHierarchyChildren /> code file to find out why. 
   I have commented the dragDropStore parameter