diff --git a/packages/builder/src/builderStore/store/frontend.js b/packages/builder/src/builderStore/store/frontend.js index d0414b5733..8af6a87787 100644 --- a/packages/builder/src/builderStore/store/frontend.js +++ b/packages/builder/src/builderStore/store/frontend.js @@ -61,6 +61,9 @@ const INITIAL_FRONTEND_STATE = { showNotificationAction: false, sidePanel: false, }, + features: { + componentValidation: false, + }, errors: [], hasAppPackage: false, libraries: null, @@ -145,6 +148,10 @@ export const getFrontendStore = () => { navigation: application.navigation || {}, usedPlugins: application.usedPlugins || [], hasLock, + features: { + ...INITIAL_FRONTEND_STATE.features, + ...application.features, + }, initialised: true, })) screenHistoryStore.reset() @@ -280,9 +287,12 @@ export const getFrontendStore = () => { } }, save: async screen => { - // Validate screen structure - // Temporarily disabled to accommodate migration issues - // store.actions.screens.validate(screen) + const state = get(store) + + // Validate screen structure if the app supports it + if (state.features?.componentValidation) { + store.actions.screens.validate(screen) + } // Check screen definition for any component settings which need updated store.actions.screens.enrichEmptySettings(screen) @@ -293,7 +303,6 @@ export const getFrontendStore = () => { const routesResponse = await API.fetchAppRoutes() // If plugins changed we need to fetch the latest app metadata - const state = get(store) let usedPlugins = state.usedPlugins if (savedScreen.pluginAdded) { const { application } = await API.fetchAppPackage(state.appId) diff --git a/packages/client/manifest.json b/packages/client/manifest.json index 76d7aff229..0a38cc315a 100644 --- a/packages/client/manifest.json +++ b/packages/client/manifest.json @@ -2216,7 +2216,7 @@ "name": "Form", "icon": "Form", "hasChildren": true, - "illegalChildren": ["section", "form"], + "illegalChildren": ["section", "form", "formblock"], "actions": [ "ValidateForm", "ClearForm", @@ -2304,7 +2304,7 @@ "name": "Form Step", "icon": "AssetsAdded", "hasChildren": true, - "illegalChildren": ["section", "form", "form step"], + "illegalChildren": ["section", "form", "formstep", "formblock"], "styles": ["size"], "size": { "width": 400, diff --git a/packages/server/src/api/controllers/application.ts b/packages/server/src/api/controllers/application.ts index cf7e8e122b..53453b8538 100644 --- a/packages/server/src/api/controllers/application.ts +++ b/packages/server/src/api/controllers/application.ts @@ -308,6 +308,9 @@ async function performAppCreate(ctx: UserCtx) { customTheme: { buttonBorderRadius: "16px", }, + features: { + componentValidation: true, + }, } // If we used a template or imported an app there will be an existing doc. diff --git a/packages/types/src/documents/app/app.ts b/packages/types/src/documents/app/app.ts index c91d575714..258eaef297 100644 --- a/packages/types/src/documents/app/app.ts +++ b/packages/types/src/documents/app/app.ts @@ -20,6 +20,7 @@ export interface App extends Document { navigation?: AppNavigation automationErrors?: AppMetadataErrors icon?: AppIcon + features?: AppFeatures } export interface AppInstance { @@ -60,3 +61,7 @@ export interface AppIcon { name: string color: string } + +export interface AppFeatures { + componentValidation?: boolean +}