diff --git a/packages/builder/src/stores/builder/rowActions.js b/packages/builder/src/stores/builder/rowActions.ts similarity index 71% rename from packages/builder/src/stores/builder/rowActions.js rename to packages/builder/src/stores/builder/rowActions.ts index 9cc4063b91..378579e41b 100644 --- a/packages/builder/src/stores/builder/rowActions.js +++ b/packages/builder/src/stores/builder/rowActions.ts @@ -6,18 +6,29 @@ import { automationStore } from "./automations" import { API } from "@/api" import { getSequentialName } from "@/helpers/duplicate" -const initialState = {} +interface RowAction { + id: string + name: string + tableId: string + allowedSources?: string[] +} -export class RowActionStore extends BudiStore { +interface RowActionState { + [tableId: string]: RowAction[] +} + +const initialState: RowActionState = {} + +export class RowActionStore extends BudiStore { constructor() { super(initialState) } reset = () => { - this.store.set(initialState) + this.set(initialState) } - refreshRowActions = async sourceId => { + refreshRowActions = async (sourceId: string) => { if (!sourceId) { return } @@ -34,26 +45,30 @@ export class RowActionStore extends BudiStore { // Fetch row actions for this table const res = await API.rowActions.fetch(tableId) - const actions = Object.values(res || {}) + const actions = Object.values(res || {}) as RowAction[] this.update(state => ({ ...state, [tableId]: actions, })) } - createRowAction = async (tableId, viewId, name) => { + createRowAction = async (tableId: string, viewId?: string, name?: string) => { if (!tableId) { return } // Get a unique name for this action if (!name) { - const existingRowActions = get(this.store)[tableId] || [] + const existingRowActions = get(this)[tableId] || [] name = getSequentialName(existingRowActions, "New row action ", { getName: x => x.name, }) } + if (!name) { + return + } + // Create the action const res = await API.rowActions.create(tableId, name) @@ -73,41 +88,35 @@ export class RowActionStore extends BudiStore { return res } - enableView = async (tableId, rowActionId, viewId) => { + enableView = async (tableId: string, rowActionId: string, viewId: string) => { await API.rowActions.enableView(tableId, rowActionId, viewId) await this.refreshRowActions(tableId) } - disableView = async (tableId, rowActionId, viewId) => { + disableView = async ( + tableId: string, + rowActionId: string, + viewId: string + ) => { await API.rowActions.disableView(tableId, rowActionId, viewId) await this.refreshRowActions(tableId) } - rename = async (tableId, rowActionId, name) => { - await API.rowActions.update({ - tableId, - rowActionId, - name, - }) - await this.refreshRowActions(tableId) - automationStore.actions.fetch() - } - - delete = async (tableId, rowActionId) => { + delete = async (tableId: string, rowActionId: string) => { await API.rowActions.delete(tableId, rowActionId) await this.refreshRowActions(tableId) // We don't need to refresh automations as we can only delete row actions // from the automations store, so we already handle the state update there } - trigger = async (sourceId, rowActionId, rowId) => { + trigger = async (sourceId: string, rowActionId: string, rowId: string) => { await API.rowActions.trigger(sourceId, rowActionId, rowId) } } const store = new RowActionStore() -const derivedStore = derived(store, $store => { - let map = {} +const derivedStore = derived(store, $store => { + const map: RowActionState = {} // Generate an entry for every view as well Object.keys($store || {}).forEach(tableId => { @@ -115,7 +124,7 @@ const derivedStore = derived(store, $store => { map[tableId] = $store[tableId] for (let action of $store[tableId]) { const otherSources = (action.allowedSources || []).filter( - sourceId => sourceId !== tableId + (sourceId: string) => sourceId !== tableId ) for (let source of otherSources) { map[source] ??= [] diff --git a/packages/builder/src/stores/builder/snippets.js b/packages/builder/src/stores/builder/snippets.js deleted file mode 100644 index 4e98ef1bdc..0000000000 --- a/packages/builder/src/stores/builder/snippets.js +++ /dev/null @@ -1,35 +0,0 @@ -import { writable, get } from "svelte/store" -import { API } from "@/api" -import { appStore } from "./app" - -const createsnippets = () => { - const store = writable([]) - - const syncMetadata = metadata => { - store.set(metadata?.snippets || []) - } - - const saveSnippet = async updatedSnippet => { - const snippets = [ - ...get(store).filter(snippet => snippet.name !== updatedSnippet.name), - updatedSnippet, - ] - const app = await API.saveAppMetadata(get(appStore).appId, { snippets }) - syncMetadata(app) - } - - const deleteSnippet = async snippetName => { - const snippets = get(store).filter(snippet => snippet.name !== snippetName) - const app = await API.saveAppMetadata(get(appStore).appId, { snippets }) - syncMetadata(app) - } - - return { - ...store, - syncMetadata, - saveSnippet, - deleteSnippet, - } -} - -export const snippets = createsnippets() diff --git a/packages/builder/src/stores/builder/snippets.ts b/packages/builder/src/stores/builder/snippets.ts new file mode 100644 index 0000000000..a6a63f7c89 --- /dev/null +++ b/packages/builder/src/stores/builder/snippets.ts @@ -0,0 +1,32 @@ +import { get } from "svelte/store" +import { API } from "@/api" +import { appStore } from "./app" +import { BudiStore } from "../BudiStore" +import { Snippet, UpdateAppResponse } from "@budibase/types" + +export class SnippetStore extends BudiStore { + constructor() { + super([]) + } + + syncMetadata = (metadata: UpdateAppResponse) => { + this.set(metadata?.snippets || []) + } + + saveSnippet = async (updatedSnippet: Snippet) => { + const snippets = [ + ...get(this).filter(snippet => snippet.name !== updatedSnippet.name), + updatedSnippet, + ] + const app = await API.saveAppMetadata(get(appStore).appId, { snippets }) + this.syncMetadata(app) + } + + deleteSnippet = async (snippetName: string) => { + const snippets = get(this).filter(snippet => snippet.name !== snippetName) + const app = await API.saveAppMetadata(get(appStore).appId, { snippets }) + this.syncMetadata(app) + } +} + +export const snippets = new SnippetStore() diff --git a/packages/builder/src/stores/builder/theme.js b/packages/builder/src/stores/builder/theme.js deleted file mode 100644 index ed46e9095a..0000000000 --- a/packages/builder/src/stores/builder/theme.js +++ /dev/null @@ -1,58 +0,0 @@ -import { writable, get } from "svelte/store" -import { API } from "@/api" -import { ensureValidTheme, DefaultAppTheme } from "@budibase/shared-core" - -export const createThemeStore = () => { - const store = writable({ - theme: DefaultAppTheme, - customTheme: {}, - }) - - const syncAppTheme = app => { - store.update(state => { - const theme = ensureValidTheme(app.theme, DefaultAppTheme) - return { - ...state, - theme, - customTheme: app.customTheme, - } - }) - } - - const save = async (theme, appId) => { - const app = await API.saveAppMetadata(appId, { theme }) - store.update(state => { - state.theme = app.theme - return state - }) - } - - const saveCustom = async (theme, appId) => { - const updated = { ...get(store).customTheme, ...theme } - const app = await API.saveAppMetadata(appId, { customTheme: updated }) - store.update(state => { - state.customTheme = app.customTheme - return state - }) - } - - const syncMetadata = metadata => { - const { theme, customTheme } = metadata - store.update(state => ({ - ...state, - theme: ensureValidTheme(theme, DefaultAppTheme), - customTheme, - })) - } - - return { - subscribe: store.subscribe, - update: store.update, - syncMetadata, - syncAppTheme, - save, - saveCustom, - } -} - -export const themeStore = createThemeStore() diff --git a/packages/builder/src/stores/builder/theme.ts b/packages/builder/src/stores/builder/theme.ts new file mode 100644 index 0000000000..b3ac202a5d --- /dev/null +++ b/packages/builder/src/stores/builder/theme.ts @@ -0,0 +1,67 @@ +import { get } from "svelte/store" +import { API } from "@/api" +import { BudiStore } from "../BudiStore" +import { ensureValidTheme, DefaultAppTheme } from "@budibase/shared-core" +import { App, UpdateAppResponse, Theme, AppCustomTheme } from "@budibase/types" + +interface ThemeState { + theme: Theme + customTheme: AppCustomTheme +} + +export class ThemeStore extends BudiStore { + constructor() { + super({ + theme: DefaultAppTheme as Theme, + customTheme: {}, + }) + } + + syncAppTheme = (app: App) => { + this.update(state => { + const theme = ensureValidTheme( + app.theme as Theme | undefined, + DefaultAppTheme + ) as Theme + return { + ...state, + theme, + customTheme: app.customTheme || {}, + } + }) + } + + save = async (theme: Theme, appId: string) => { + const app = await API.saveAppMetadata(appId, { theme }) + this.update(state => ({ + ...state, + theme: ensureValidTheme( + app.theme as Theme | undefined, + DefaultAppTheme + ) as Theme, + })) + } + + saveCustom = async (theme: Partial, appId: string) => { + const updated = { ...get(this).customTheme, ...theme } + const app = await API.saveAppMetadata(appId, { customTheme: updated }) + this.update(state => ({ + ...state, + customTheme: app.customTheme || {}, + })) + } + + syncMetadata = (metadata: UpdateAppResponse) => { + const { theme, customTheme } = metadata + this.update(state => ({ + ...state, + theme: ensureValidTheme( + theme as Theme | undefined, + DefaultAppTheme + ) as Theme, + customTheme: customTheme || {}, + })) + } +} + +export const themeStore = new ThemeStore()