diff --git a/packages/builder/src/stores/BudiStore.ts b/packages/builder/src/stores/BudiStore.ts index 706fa9474a..d5bbc99328 100644 --- a/packages/builder/src/stores/BudiStore.ts +++ b/packages/builder/src/stores/BudiStore.ts @@ -1,7 +1,21 @@ import { writable, Writable, Readable } from "svelte/store" +import { + createLocalStorageStore, + createSessionStorageStore, +} from "@budibase/frontend-core" + +export enum PersistenceType { + NONE = "none", + LOCAL = "local", + SESSION = "session", +} interface BudiStoreOpts { debug?: boolean + persistence?: { + type: PersistenceType + key: string + } } export class BudiStore { @@ -11,7 +25,21 @@ export class BudiStore { set: Writable["set"] constructor(init: T, opts?: BudiStoreOpts) { - this.store = writable(init) + if (opts?.persistence) { + switch (opts.persistence.type) { + case PersistenceType.LOCAL: + this.store = createLocalStorageStore(opts.persistence.key, init) + break + case PersistenceType.SESSION: + this.store = createSessionStorageStore(opts.persistence.key, init) + break + default: + this.store = writable(init) + } + } else { + this.store = writable(init) + } + this.subscribe = this.store.subscribe this.update = this.store.update this.set = this.store.set diff --git a/packages/builder/src/stores/builder/componentTreeNodes.ts b/packages/builder/src/stores/builder/componentTreeNodes.ts index 6d2d524a79..6c6f522ce1 100644 --- a/packages/builder/src/stores/builder/componentTreeNodes.ts +++ b/packages/builder/src/stores/builder/componentTreeNodes.ts @@ -1,27 +1,25 @@ import { get } from "svelte/store" -import { createSessionStorageStore } from "@budibase/frontend-core" import { selectedScreen as selectedScreenStore } from "./screens" import { findComponentPath } from "helpers/components" import { Screen, Component } from "@budibase/types" -import { BudiStore } from "stores/BudiStore" +import { BudiStore, PersistenceType } from "stores/BudiStore" interface OpenNodesState { [key: string]: boolean } export class ComponentTreeNodesStore extends BudiStore { - private baseStore = createSessionStorageStore( - "openNodes", - {} as OpenNodesState - ) - constructor() { - super({}) - this.subscribe = this.baseStore.subscribe + super({} as OpenNodesState, { + persistence: { + type: PersistenceType.SESSION, + key: "openNodes", + }, + }) } toggleNode(componentId: string) { - this.baseStore.update((openNodes: OpenNodesState) => { + this.update((openNodes: OpenNodesState) => { openNodes[`nodeOpen-${componentId}`] = !openNodes[`nodeOpen-${componentId}`] @@ -30,7 +28,7 @@ export class ComponentTreeNodesStore extends BudiStore { } expandNodes(componentIds: string[]) { - this.baseStore.update((openNodes: OpenNodesState) => { + this.update((openNodes: OpenNodesState) => { const newNodes = Object.fromEntries( componentIds.map(id => [`nodeOpen-${id}`, true]) ) @@ -40,7 +38,7 @@ export class ComponentTreeNodesStore extends BudiStore { } collapseNodes(componentIds: string[]) { - this.baseStore.update((openNodes: OpenNodesState) => { + this.update((openNodes: OpenNodesState) => { const newNodes = Object.fromEntries( componentIds.map(id => [`nodeOpen-${id}`, false]) ) @@ -57,7 +55,7 @@ export class ComponentTreeNodesStore extends BudiStore { const componentIds = path.map((component: Component) => component._id) - this.baseStore.update((openNodes: OpenNodesState) => { + this.update((openNodes: OpenNodesState) => { const newNodes = Object.fromEntries( componentIds.map((id: string) => [`nodeOpen-${id}`, true]) ) @@ -67,7 +65,7 @@ export class ComponentTreeNodesStore extends BudiStore { } isNodeExpanded(componentId: string): boolean { - const openNodes = get(this.baseStore) + const openNodes = get(this) return !!openNodes[`nodeOpen-${componentId}`] } }