diff --git a/docs/framework/frontend-scripts.mdx b/docs/framework/frontend-scripts.mdx index 91ac3525f..b1fa0fa11 100644 --- a/docs/framework/frontend-scripts.mdx +++ b/docs/framework/frontend-scripts.mdx @@ -94,7 +94,7 @@ You can access Framework's front-end core via `globalThis.core`, unlocking all s ```js export function alertHueRotationValue() { - const state = globalThis.core.getUserState(); + const state = globalThis.core.userState.value. console.log("State is", state); } ``` diff --git a/src/ui/src/builder/BuilderEditor.vue b/src/ui/src/builder/BuilderEditor.vue index 7790b80dd..d302f54cf 100644 --- a/src/ui/src/builder/BuilderEditor.vue +++ b/src/ui/src/builder/BuilderEditor.vue @@ -163,9 +163,6 @@ const theme: Ref = ref( ); const isLogActive: Ref = ref(ssbm.getLogEntryCount() > 0); -const sessionTimestamp: ComputedRef = computed(() => - wf.getSessionTimestamp(), -); type StatusMessage = { ok: boolean | "processing"; @@ -211,7 +208,7 @@ onMounted(() => { wf.addMailSubscription("logEntry", handleLogEntry); const targetEl = editorContainer.value; editor = monaco.editor.create(targetEl, { - value: wf.getRunCode(), + value: wf.runCode.value, language: "python", theme: theme.value, }); @@ -226,12 +223,9 @@ onUnmounted(() => { window.removeEventListener("resize", updateDimensions.bind(this)); }); -watch( - () => wf.getRunCode(), - (newRunCode) => { - editor.getModel().setValue(newRunCode); - }, -); +watch(wf.runCode, (newRunCode) => { + editor.getModel().setValue(newRunCode); +}); watch( () => ssbm.getMode(), @@ -243,7 +237,7 @@ watch( }, ); -watch(sessionTimestamp, () => { +watch(wf.sessionTimestamp, () => { enableEditor(); }); diff --git a/src/ui/src/builder/BuilderSettingsHandlers.vue b/src/ui/src/builder/BuilderSettingsHandlers.vue index 81baf732c..fa1a71af1 100644 --- a/src/ui/src/builder/BuilderSettingsHandlers.vue +++ b/src/ui/src/builder/BuilderSettingsHandlers.vue @@ -199,7 +199,7 @@ const recognisedEvents: ComputedRef = return recEvents; }); -const userFunctions = computed(() => wf.getUserFunctions()); +const userFunctions = wf.userFunctions; const pageKeys = computed(() => { const pages = wf.getComponents("root"); diff --git a/src/ui/src/builder/BuilderStateExplorerTreeBranch.vue b/src/ui/src/builder/BuilderStateExplorerTreeBranch.vue index b7f95e0ae..f06017565 100644 --- a/src/ui/src/builder/BuilderStateExplorerTreeBranch.vue +++ b/src/ui/src/builder/BuilderStateExplorerTreeBranch.vue @@ -69,7 +69,7 @@ const areChildrenVisible: Ref = ref( ); function getStateValue(accessors: string[]) { - let state = wf.getUserState(); + let state = wf.userState.value; accessors.forEach((accessor) => { state = state[accessor]; }); diff --git a/src/ui/src/builder/BuilderTemplateInput.vue b/src/ui/src/builder/BuilderTemplateInput.vue index 0605d78cd..bb252a630 100644 --- a/src/ui/src/builder/BuilderTemplateInput.vue +++ b/src/ui/src/builder/BuilderTemplateInput.vue @@ -166,7 +166,7 @@ const showAutocomplete = () => { const keyword = full.at(-1); const path = full.slice(0, -1); - const allOptions = Object.entries(_get(ss.getUserState(), path) ?? {}).map( + const allOptions = Object.entries(_get(ss.userState.value, path) ?? {}).map( ([key, val]) => ({ text: key, type: typeToString(val), diff --git a/src/ui/src/components/core/root/CoreRoot.vue b/src/ui/src/components/core/root/CoreRoot.vue index 17a1db14e..b4239d1ac 100644 --- a/src/ui/src/components/core/root/CoreRoot.vue +++ b/src/ui/src/components/core/root/CoreRoot.vue @@ -105,7 +105,7 @@ const rootEl: Ref = ref(null); const { isComponentVisible } = useEvaluator(wf); const displayedPageId = computed(() => { - const activePageId = wf.getActivePageId(); + const activePageId = wf.activePageId.value; const activePageExists = Boolean(wf.getComponentById(activePageId)); if (activePageExists && wf.isChildOf("root", activePageId)) return activePageId; diff --git a/src/ui/src/components/workflows/WorkflowsRoot.vue b/src/ui/src/components/workflows/WorkflowsRoot.vue index fcbef3fd3..45b122022 100644 --- a/src/ui/src/components/workflows/WorkflowsRoot.vue +++ b/src/ui/src/components/workflows/WorkflowsRoot.vue @@ -38,7 +38,7 @@ const getChildrenVNodes = inject(injectionKeys.getChildrenVNodes); const rootEl: Ref = ref(null); const displayedWorkflowId = computed(() => { - const activePageId = wf.getActivePageId(); + const activePageId = wf.activePageId.value; const activePageExists = Boolean(wf.getComponentById(activePageId)); if (activePageExists && wf.isChildOf("workflows_root", activePageId)) return activePageId; diff --git a/src/ui/src/core/index.ts b/src/ui/src/core/index.ts index 72b9cefd2..9f0cb5bcb 100644 --- a/src/ui/src/core/index.ts +++ b/src/ui/src/core/index.ts @@ -25,6 +25,12 @@ const KEEP_ALIVE_DELAY_MS = 60000; export function generateCore() { let sessionId: string = null; const sessionTimestamp: Ref = ref(null); + /** + * Whether Writer Framework is running as builder or runner. + * The mode is enforced in the backend and used in the frontend for presentation purposes only. + * + * @returns + */ const mode: Ref<"run" | "edit"> = ref(null); const featureFlags = shallowRef([]); const runCode: Ref = ref(null); @@ -42,20 +48,6 @@ export function generateCore() { const mailSubscriptions: { mailType: string; fn: Function }[] = []; const activePageId: Ref = ref(null); - function getFrontendMessageMap() { - return frontendMessageMap.value; - } - - /** - * Whether Writer Framework is running as builder or runner. - * The mode is enforced in the backend and used in the frontend for presentation purposes only. - * - * @returns - */ - function getMode() { - return mode.value; - } - /** * Initialise the core. * @returns @@ -103,7 +95,7 @@ export function generateCore() { sessionTimestamp.value = new Date().getTime(); featureFlags.value = initData.featureFlags; loadAbstractTemplates(initData.abstractTemplates); - + // Only returned for edit (Builder) mode userFunctions.value = initData.userFunctions; @@ -127,10 +119,6 @@ export function generateCore() { ); } - function getSessionTimestamp() { - return sessionTimestamp.value; - } - function sendKeepAliveMessage() { setTimeout(() => { sendFrontendMessage("keepAlive", {}, sendKeepAliveMessage); @@ -381,10 +369,6 @@ export function generateCore() { sendFrontendMessage("stateEnquiry", {}, callback, true); } - function getRunCode() { - return runCode.value; - } - function setupMessageFollowUp(trackingId: number) { const INITIAL_FOLLOWUP_MS = 150; const SUBSEQUENT_FOLLOWUPS_MS = 150; @@ -489,10 +473,6 @@ export function generateCore() { }); } - function getUserFunctions() { - return userFunctions.value; - } - function getComponentById(componentId: Component["id"]): Component { return components.value[componentId]; } @@ -562,28 +542,20 @@ export function generateCore() { activePageId.value = componentId; } - function getActivePageId(): Component["id"] { - return activePageId.value; - } - function getContainableTypes(componentId: Component["id"]) { return typeHierarchy.getContainableTypes(components.value, componentId); } - function getUserState() { - return userState.value; - } - const core = { webSocket, syncHealth, - getFrontendMessageMap, - getMode, - getUserFunctions, + frontendMessageMap: readonly(frontendMessageMap), + mode: readonly(mode), + userFunctions: readonly(userFunctions), addMailSubscription, init, forwardEvent, - getRunCode, + runCode: readonly(runCode), sendCodeSaveRequest, sendCodeUpdate, sendComponentUpdate, @@ -592,13 +564,13 @@ export function generateCore() { getComponentById, getComponents, setActivePageId, - getActivePageId, + activePageId: readonly(activePageId), setActivePageFromKey, getComponentDefinition, getSupportedComponentTypes, getContainableTypes, - getSessionTimestamp, - getUserState, + sessionTimestamp: readonly(sessionTimestamp), + userState: readonly(userState), isChildOf, featureFlags: readonly(featureFlags), }; diff --git a/src/ui/src/main.ts b/src/ui/src/main.ts index 2afdf72b7..3c6ce47b2 100644 --- a/src/ui/src/main.ts +++ b/src/ui/src/main.ts @@ -36,7 +36,7 @@ globalThis.core = wf; async function load() { await wf.init(); - const mode = wf.getMode(); + const mode = wf.mode.value; const ssbm = mode == "edit" ? generateBuilderManager() : undefined; if (ssbm) { diff --git a/src/ui/src/renderer/ComponentRenderer.vue b/src/ui/src/renderer/ComponentRenderer.vue index 0729687eb..48fc3dfe7 100644 --- a/src/ui/src/renderer/ComponentRenderer.vue +++ b/src/ui/src/renderer/ComponentRenderer.vue @@ -69,10 +69,7 @@ const rootStyle = computed(() => { }; }); -const isMessagePending = computed(() => { - const frontendMessageMap = wf.getFrontendMessageMap(); - return frontendMessageMap.size > 0; -}); +const isMessagePending = computed(() => wf.frontendMessageMap.value.size > 0); watch( () => coreRootFields.appName?.value, @@ -83,7 +80,7 @@ watch( ); function updateTitle(appName: string) { - const mode = wf.getMode(); + const mode = wf.mode.value; let title: string; if (appName && mode == "edit") { title = `${appName} | Writer Framework | Builder`; diff --git a/src/ui/src/renderer/useEvaluator.ts b/src/ui/src/renderer/useEvaluator.ts index 69c6199b8..9da29eb28 100644 --- a/src/ui/src/renderer/useEvaluator.ts +++ b/src/ui/src/renderer/useEvaluator.ts @@ -58,7 +58,7 @@ export function useEvaluator(wf: Core) { ? getContextData(instancePath) : undefined; let contextRef = contextData; - let stateRef = wf.getUserState(); + let stateRef = wf.userState.value; const accessors = parseExpression(expr, instancePath); for (let i = 0; i < accessors.length; i++) {