From c77c98f06ce7e62bf464decaca50af66ca6cde52 Mon Sep 17 00:00:00 2001
From: Adria Navarro <adria@budibase.com>
Date: Tue, 4 Feb 2025 10:29:13 +0100
Subject: [PATCH] Return list instead of object

---
 .../_components/ScreenErrorsButton.svelte     |  7 +++--
 .../builder/src/stores/builder/components.ts  |  4 +--
 packages/builder/src/stores/builder/index.js  |  6 ++---
 .../src/stores/builder/screenComponent.ts     | 26 +++++++------------
 4 files changed, 18 insertions(+), 25 deletions(-)

diff --git a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/ScreenErrorsButton.svelte b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/ScreenErrorsButton.svelte
index 9d2cdba171..0efc429267 100644
--- a/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/ScreenErrorsButton.svelte
+++ b/packages/builder/src/pages/builder/app/[application]/design/[screenId]/_components/ScreenErrorsButton.svelte
@@ -4,7 +4,7 @@
     builderStore,
     componentStore,
     screenComponentErrorList,
-    screenComponents,
+    screenComponentsList,
   } from "@/stores/builder"
   import { ActionButton, Icon, Link, Popover } from "@budibase/bbui"
 
@@ -12,7 +12,10 @@
   let popover: any
 
   function getErrorTitle(error: UIComponentError) {
-    const titleParts = [$screenComponents[error.componentId]._instanceName]
+    const titleParts = [
+      $screenComponentsList.find(c => c._id === error.componentId)!
+        ._instanceName,
+    ]
     if (error.errorType === "setting") {
       titleParts.push(error.label)
     }
diff --git a/packages/builder/src/stores/builder/components.ts b/packages/builder/src/stores/builder/components.ts
index c4eaf0d640..b1198ca7b4 100644
--- a/packages/builder/src/stores/builder/components.ts
+++ b/packages/builder/src/stores/builder/components.ts
@@ -21,7 +21,7 @@ import {
   tables,
   componentTreeNodesStore,
   builderStore,
-  screenComponents,
+  screenComponentsList,
 } from "@/stores/builder"
 import { buildFormSchema, getSchemaForDatasource } from "@/dataBinding"
 import {
@@ -450,7 +450,7 @@ export class ComponentStore extends BudiStore<ComponentState> {
     }
 
     const componentName = getSequentialName(
-      Object.values(get(screenComponents)),
+      get(screenComponentsList),
       `New ${definition.friendlyName || definition.name}`,
       {
         getName: c => c._instanceName,
diff --git a/packages/builder/src/stores/builder/index.js b/packages/builder/src/stores/builder/index.js
index 5856a394e0..76679d8088 100644
--- a/packages/builder/src/stores/builder/index.js
+++ b/packages/builder/src/stores/builder/index.js
@@ -17,9 +17,8 @@ import { deploymentStore } from "./deployments.js"
 import { contextMenuStore } from "./contextMenu.js"
 import { snippets } from "./snippets"
 import {
-  screenComponents,
+  screenComponentsList,
   screenComponentErrors,
-  findComponentsBySettingsType,
   screenComponentErrorList,
 } from "./screenComponent"
 
@@ -73,9 +72,8 @@ export {
   snippets,
   rowActions,
   appPublished,
-  screenComponents,
+  screenComponentsList,
   screenComponentErrors,
-  findComponentsBySettingsType,
   screenComponentErrorList,
 }
 
diff --git a/packages/builder/src/stores/builder/screenComponent.ts b/packages/builder/src/stores/builder/screenComponent.ts
index 64574852d5..0ea89cc445 100644
--- a/packages/builder/src/stores/builder/screenComponent.ts
+++ b/packages/builder/src/stores/builder/screenComponent.ts
@@ -23,13 +23,10 @@ function reduceBy<TItem extends {}, TKey extends keyof TItem>(
   key: TKey,
   list: TItem[]
 ): Record<string, TItem> {
-  return list.reduce(
-    (result, item) => ({
-      ...result,
-      [item[key] as string]: item,
-    }),
-    {}
-  )
+  return list.reduce<Record<string, TItem>>((result, item) => {
+    result[item[key] as string] = item
+    return result
+  }, {})
 }
 
 const friendlyNameByType: Partial<Record<UIDatasourceType, string>> = {
@@ -253,7 +250,7 @@ function getMissingAncestors(
   return result
 }
 
-export function findComponentsBySettingsType(
+function findComponentsBySettingsType(
   screen: Screen,
   type: string | string[],
   definitions: Record<string, ComponentDefinition>
@@ -303,18 +300,13 @@ export const screenComponentErrorList = derived(
   }
 )
 
-export const screenComponents = derived(
+export const screenComponentsList = derived(
   [selectedScreen],
-  ([$selectedScreen]): Record<string, Component> => {
+  ([$selectedScreen]): Component[] => {
     if (!$selectedScreen) {
-      return {}
+      return []
     }
 
-    return findAllComponents($selectedScreen.props).reduce<
-      Record<string, Component>
-    >((obj, component) => {
-      obj[component._id] = component
-      return obj
-    }, {})
+    return findAllComponents($selectedScreen.props)
   }
 )