From 11801fa1fc9dcf740c9e8c0891121be767a1c661 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Keviin=20=C3=85berg=20Kultalahti?= Date: Mon, 8 Mar 2021 17:05:42 +0100 Subject: [PATCH 01/16] fixes colorpicker bugs --- packages/builder/package.json | 2 +- .../PropertyControls/ColorPicker.svelte | 33 ++++++++++++++++++- packages/builder/yarn.lock | 8 ++--- 3 files changed, 37 insertions(+), 6 deletions(-) diff --git a/packages/builder/package.json b/packages/builder/package.json index 6d0bb15083..6a4f6eea4b 100644 --- a/packages/builder/package.json +++ b/packages/builder/package.json @@ -65,7 +65,7 @@ "dependencies": { "@budibase/bbui": "^1.58.13", "@budibase/client": "^0.8.3", - "@budibase/colorpicker": "1.0.1", + "@budibase/colorpicker": "1.1.2", "@budibase/string-templates": "^0.8.3", "@budibase/svelte-ag-grid": "^1.0.4", "@sentry/browser": "5.19.1", diff --git a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/ColorPicker.svelte b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/ColorPicker.svelte index 63ce8da6c4..3c4c7f22d7 100644 --- a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/ColorPicker.svelte +++ b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/ColorPicker.svelte @@ -1,7 +1,38 @@ - + diff --git a/packages/builder/yarn.lock b/packages/builder/yarn.lock index 593a2ed815..e5ded575b2 100644 --- a/packages/builder/yarn.lock +++ b/packages/builder/yarn.lock @@ -833,10 +833,10 @@ svelte-portal "^1.0.0" turndown "^7.0.0" -"@budibase/colorpicker@1.0.1": - version "1.0.1" - resolved "https://registry.yarnpkg.com/@budibase/colorpicker/-/colorpicker-1.0.1.tgz#940c180e7ebba0cb0756c4c8ef13f5dfab58e810" - integrity sha512-+DTHYhU0sTi5RfCyd7AAvMsLFwyF/wgs0owf7KyQU+ZILRW+YsWa7OQMz+hKQfgVAmvzwrNz8ATiBlG3Ac6Asg== +"@budibase/colorpicker@1.1.2": + version "1.1.2" + resolved "https://registry.yarnpkg.com/@budibase/colorpicker/-/colorpicker-1.1.2.tgz#f7436924ee746d7be9b2009c2fa193e710c30f89" + integrity sha512-2PlZBVkATDqDC4b4Ri8Xi8X3OxhuHOGfmZwtXbZL38lNIeofaQT3Qyc1ECzEY5N+HrdGrWhY9EnliF6QM+LIuA== "@budibase/svelte-ag-grid@^1.0.4": version "1.0.4" From e507c006e61640cd2cabbe9d8122b22f1707b435 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Keviin=20=C3=85berg=20Kultalahti?= Date: Tue, 9 Mar 2021 09:32:53 +0100 Subject: [PATCH 02/16] change default color of colorpicker --- .../design/PropertiesPanel/PropertyControls/ColorPicker.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/ColorPicker.svelte b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/ColorPicker.svelte index 3c4c7f22d7..6235e744f8 100644 --- a/packages/builder/src/components/design/PropertiesPanel/PropertyControls/ColorPicker.svelte +++ b/packages/builder/src/components/design/PropertiesPanel/PropertyControls/ColorPicker.svelte @@ -35,4 +35,4 @@ }, WAIT, true) - + From e909ff584af0b8b9b168f04a8a623d36a9487e8c Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Tue, 9 Mar 2021 19:06:25 +0000 Subject: [PATCH 03/16] Make screens searchable and make routes collapsible --- packages/builder/src/builderStore/index.js | 3 +- .../ComponentNavigationTree/PathTree.svelte | 92 +++++++++++++------ .../ComponentNavigationTree/index.svelte | 2 +- .../FrontendNavigatePane.svelte | 15 ++- 4 files changed, 77 insertions(+), 35 deletions(-) diff --git a/packages/builder/src/builderStore/index.js b/packages/builder/src/builderStore/index.js index 2e9ec1166c..8b0cde8658 100644 --- a/packages/builder/src/builderStore/index.js +++ b/packages/builder/src/builderStore/index.js @@ -2,7 +2,6 @@ import { getFrontendStore } from "./store/frontend" import { getBackendUiStore } from "./store/backend" import { getAutomationStore } from "./store/automation" import { getHostingStore } from "./store/hosting" - import { getThemeStore } from "./store/theme" import { derived, writable } from "svelte/store" import analytics from "analytics" @@ -66,3 +65,5 @@ export const initialise = async () => { console.log(err) } } + +export const screenSearchString = writable(null) diff --git a/packages/builder/src/components/design/NavigationPanel/ComponentNavigationTree/PathTree.svelte b/packages/builder/src/components/design/NavigationPanel/ComponentNavigationTree/PathTree.svelte index c9e9d27958..9a4b02a4f1 100644 --- a/packages/builder/src/components/design/NavigationPanel/ComponentNavigationTree/PathTree.svelte +++ b/packages/builder/src/components/design/NavigationPanel/ComponentNavigationTree/PathTree.svelte @@ -1,8 +1,11 @@ - +{#if !noSearchMatch} + (routeManuallyOpened = !routeManuallyOpened)} + opened={routeOpened} + {border} + withArrow={route.subpaths} /> -{#each Object.entries(route.subpaths) as [url, subpath]} - {#each Object.entries(subpath.screens) as [role, screenId]} - changeScreen(screenId)}> - - - {#if selectedScreen?._id === screenId} - - {/if} - {/each} -{/each} + {#if routeOpened} + {#each filteredScreens as screen (screen.id)} + changeScreen(screen.id)}> + + + {#if selectedScreen?._id === screen.id} + + {/if} + {/each} + {/if} +{/if} diff --git a/packages/builder/src/components/design/NavigationPanel/ComponentNavigationTree/index.svelte b/packages/builder/src/components/design/NavigationPanel/ComponentNavigationTree/index.svelte index 720b18f8f9..65425a5b9f 100644 --- a/packages/builder/src/components/design/NavigationPanel/ComponentNavigationTree/index.svelte +++ b/packages/builder/src/components/design/NavigationPanel/ComponentNavigationTree/index.svelte @@ -56,7 +56,7 @@
- {#each paths as path, idx} + {#each paths as path, idx (path)} 0} {path} route={routes[path]} /> {/each} diff --git a/packages/builder/src/components/design/NavigationPanel/FrontendNavigatePane.svelte b/packages/builder/src/components/design/NavigationPanel/FrontendNavigatePane.svelte index 147f32bb3e..2fcd4ebf1e 100644 --- a/packages/builder/src/components/design/NavigationPanel/FrontendNavigatePane.svelte +++ b/packages/builder/src/components/design/NavigationPanel/FrontendNavigatePane.svelte @@ -1,19 +1,19 @@ {#if !noSearchMatch} (routeManuallyOpened = !routeManuallyOpened)} + on:click={toggleManuallyOpened} opened={routeOpened} {border} withArrow={route.subpaths} /> From 768b03fc8a85a80d18279fb4d6edbc0c178e2df8 Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Wed, 10 Mar 2021 10:35:49 +0000 Subject: [PATCH 07/16] Don't close folders when selecting a new screen --- .../NavigationPanel/ComponentNavigationTree/PathTree.svelte | 3 --- 1 file changed, 3 deletions(-) diff --git a/packages/builder/src/components/design/NavigationPanel/ComponentNavigationTree/PathTree.svelte b/packages/builder/src/components/design/NavigationPanel/ComponentNavigationTree/PathTree.svelte index ad1b54d700..5f98a2b9ed 100644 --- a/packages/builder/src/components/design/NavigationPanel/ComponentNavigationTree/PathTree.svelte +++ b/packages/builder/src/components/design/NavigationPanel/ComponentNavigationTree/PathTree.svelte @@ -37,9 +37,6 @@ const changeScreen = screenId => { store.actions.screens.select(screenId) - - // Reset manually opened flag every time a new screen is selected - routeManuallyOpened = false } const getAllScreens = route => { From 8820edd1bcf342a7fd36588c27e24e5c7c68c84a Mon Sep 17 00:00:00 2001 From: Andrew Kingston Date: Thu, 11 Mar 2021 15:53:31 +0000 Subject: [PATCH 08/16] Add clear icon to screen search field --- .../FrontendNavigatePane.svelte | 34 ++++++++++++++++--- 1 file changed, 29 insertions(+), 5 deletions(-) diff --git a/packages/builder/src/components/design/NavigationPanel/FrontendNavigatePane.svelte b/packages/builder/src/components/design/NavigationPanel/FrontendNavigatePane.svelte index a64bf9f0ee..e235e3b254 100644 --- a/packages/builder/src/components/design/NavigationPanel/FrontendNavigatePane.svelte +++ b/packages/builder/src/components/design/NavigationPanel/FrontendNavigatePane.svelte @@ -85,11 +85,16 @@ {/each} - +
+ + ($screenSearchString = null)} /> +