diff --git a/packages/builder/src/builderStore/store/index.js b/packages/builder/src/builderStore/store/index.js index be8da095f7..277f57584e 100644 --- a/packages/builder/src/builderStore/store/index.js +++ b/packages/builder/src/builderStore/store/index.js @@ -24,6 +24,7 @@ import { saveCurrentPreviewItem as _saveCurrentPreviewItem, saveScreenApi as _saveScreenApi, regenerateCssForCurrentScreen, + regenerateCssForScreen, generateNewIdsForComponent, getComponentDefinition, } from "../storeUtils" @@ -98,6 +99,29 @@ const setPackage = (store, initial) => async pkg => { }, } + // if the app has just been created + // we need to build the CSS and save + if (pkg.justCreated) { + const generateInitialPageCss = async name => { + const page = pkg.pages[name] + regenerateCssForScreen(page) + for (let screen of page._screens) { + regenerateCssForScreen(screen) + } + + await api.post(`/_builder/api/${pkg.application._id}/pages/${name}`, { + page: { + componentLibraries: pkg.application.componentLibraries, + ...page, + }, + screens: page._screens, + }) + } + generateInitialPageCss("main") + generateInitialPageCss("unauthenticated") + pkg.justCreated = false + } + initial.libraries = pkg.application.componentLibraries initial.components = await fetchComponentLibDefinitions(pkg.application._id) initial.name = pkg.application.name diff --git a/packages/builder/src/builderStore/storeUtils.js b/packages/builder/src/builderStore/storeUtils.js index 9111f06bd5..6155974d2b 100644 --- a/packages/builder/src/builderStore/storeUtils.js +++ b/packages/builder/src/builderStore/storeUtils.js @@ -79,10 +79,12 @@ export const walkProps = (props, action, cancelToken = null) => { } } +export const regenerateCssForScreen = screen => { + screen._css = generate_screen_css([screen.props]) +} + export const regenerateCssForCurrentScreen = state => { - state.currentPreviewItem._css = generate_screen_css([ - state.currentPreviewItem.props, - ]) + regenerateCssForScreen(state.currentPreviewItem) return state } diff --git a/packages/builder/src/components/start/CreateAppModal.svelte b/packages/builder/src/components/start/CreateAppModal.svelte index e171dc836e..7ee707d490 100644 --- a/packages/builder/src/components/start/CreateAppModal.svelte +++ b/packages/builder/src/components/start/CreateAppModal.svelte @@ -154,6 +154,7 @@ const pkg = await applicationPkg.json() if (applicationPkg.ok) { backendUiStore.actions.reset() + pkg.justCreated = true await store.setPackage(pkg) automationStore.actions.fetch() } else {