Skip to content

Commit

Permalink
fix(schema-formio): support custom label on nested form
Browse files Browse the repository at this point in the history
  • Loading branch information
Romakita committed Jul 19, 2023
1 parent 9452700 commit 3fd9333
Show file tree
Hide file tree
Showing 5 changed files with 268 additions and 4 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,7 @@ export function propertiesToComponents(schema: any, options: any): any[] {

Object.entries(schema.properties).forEach(([key, propSchema]: [string, any]) => {
const tabsOptions = propSchema["x-formiotabs"];
const base = execMapper("any", propSchema, {parentKey: key, ...options});
const base = execMapper("any", propSchema, {...options, parentKey: key});

let component = cleanObject({
key,
Expand Down
4 changes: 3 additions & 1 deletion packages/third-parties/schema-formio/src/decorators/form.ts
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
import {nameOf, StoreSet, useDecorators} from "@tsed/core";
import {Name} from "@tsed/schema";
import {FormioForm} from "@tsed/formio-types";
import {Name} from "@tsed/schema";
import {paramCase} from "change-case";
import {FormsContainer} from "../registries/FormsContainer";
import {Label} from "./label";

/**
* Expose the model as Formio Form.
Expand All @@ -17,6 +18,7 @@ export function Form(form: Partial<Omit<FormioForm, "components" | "_id">> = {})
FormsContainer.set(machineName, target as any);
},
form.name && Name(form.name),
form.label && Label(form.label),
form && StoreSet("formio:form", form)
);
}
9 changes: 7 additions & 2 deletions packages/third-parties/schema-formio/src/decorators/label.ts
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import {CustomKey, JsonEntityFn} from "@tsed/schema";
import {Component} from "./component";

/**
Expand All @@ -9,7 +10,11 @@ import {Component} from "./component";
* @param label
*/
export function Label(label: string) {
return Component({
label
return JsonEntityFn((entity) => {
return entity.decoratorType === "property"
? Component({
label
})
: CustomKey("x-formio-label", label);
});
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,188 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`Deep Nested form integration should generate form and nested form 1`] = `
Object {
"access": Array [],
"components": Array [
Object {
"components": Array [
Object {
"collapsible": false,
"components": Array [
Object {
"components": Array [
Object {
"collapsible": false,
"components": Array [
Object {
"defaultValue": true,
"disabled": false,
"input": true,
"key": "deliverNotifications",
"label": "Remind subscribers",
"type": "checkbox",
"validate": Object {
"required": false,
},
},
],
"disabled": false,
"input": false,
"key": "panel",
"label": "One hour before this maintenance",
"tableView": false,
},
],
"disabled": false,
"display": "form",
"input": true,
"key": "oneHourBefore",
"tableView": false,
"type": "form",
"validate": Object {
"required": false,
},
},
Object {
"components": Array [
Object {
"collapsible": false,
"components": Array [
Object {
"defaultValue": true,
"disabled": false,
"input": true,
"key": "updateStatus",
"label": "Set status to 'In Progress'",
"type": "checkbox",
"validate": Object {
"required": false,
},
},
Object {
"defaultValue": true,
"disabled": false,
"input": true,
"key": "setComponentStatus",
"label": "Set affected components' status to 'Under Maintenance'",
"type": "checkbox",
"validate": Object {
"required": false,
},
},
Object {
"defaultValue": true,
"disabled": false,
"input": true,
"key": "deliverNotifications",
"label": "Notify subscribers",
"type": "checkbox",
"validate": Object {
"required": false,
},
},
],
"disabled": false,
"input": false,
"key": "panel",
"label": "At the start time for this maintenance",
"tableView": false,
},
],
"disabled": false,
"display": "form",
"input": true,
"key": "atStartTime",
"tableView": false,
"type": "form",
"validate": Object {
"required": false,
},
},
Object {
"components": Array [
Object {
"collapsible": false,
"components": Array [
Object {
"defaultValue": true,
"disabled": false,
"input": true,
"key": "updateStatus",
"label": "Set status to 'Completed'",
"type": "checkbox",
"validate": Object {
"required": false,
},
},
Object {
"defaultValue": true,
"disabled": false,
"input": true,
"key": "setComponentStatus",
"label": "Set affected components' status to 'Under Maintenance'",
"type": "checkbox",
"validate": Object {
"required": false,
},
},
Object {
"defaultValue": true,
"disabled": false,
"input": true,
"key": "deliverNotifications",
"label": "Notify subscribers",
"type": "checkbox",
"validate": Object {
"required": false,
},
},
],
"disabled": false,
"input": false,
"key": "panel",
"label": "At the end of time for this maintenance",
"tableView": false,
},
],
"disabled": false,
"display": "form",
"input": true,
"key": "atEndTime",
"tableView": false,
"type": "form",
"validate": Object {
"required": false,
},
},
],
"disabled": false,
"input": false,
"key": "panel",
"label": "Automation options test",
"tableView": false,
},
],
"disabled": false,
"display": "form",
"input": true,
"key": "automationOptions",
"tableView": false,
"type": "form",
"validate": Object {
"required": false,
},
},
],
"display": "form",
"included": Object {
"components": "/components",
},
"machineName": "scheduled-maintenance",
"name": "scheduled-maintenance",
"submissionAccess": Array [],
"tags": Array [],
"title": "ScheduledMaintenance",
"type": "form",
}
`;
Original file line number Diff line number Diff line change
@@ -0,0 +1,69 @@
import {Default, Property} from "@tsed/schema";
import {Form, getFormioSchema, Label} from "../src";

@Form({label: "One hour before this maintenance"})
export class AutomationOneHourBefore {
@Label("Remind subscribers")
@Default(true)
deliverNotifications: boolean = true;
}

@Form({label: "At the start time for this maintenance"})
export class AutomationAtStartTime {
@Label("Set status to 'In Progress'")
@Default(true)
updateStatus: boolean = true;

@Label("Set affected components' status to 'Under Maintenance'")
@Default(true)
setComponentStatus: boolean = true;

@Label("Notify subscribers")
@Default(true)
deliverNotifications: boolean = true;
}

@Label("At the end of time for this maintenance")
export class AutomationAtEndTime {
@Label("Set status to 'Completed'")
@Default(true)
updateStatus: boolean = true;

@Label("Set affected components' status to 'Under Maintenance'")
@Default(true)
setComponentStatus: boolean = true;

@Label("Notify subscribers")
@Default(true)
deliverNotifications: boolean = true;
}

@Label("Automation options test")
export class AutomationOptions {
@Property()
oneHourBefore: AutomationOneHourBefore;

@Property()
atStartTime: AutomationAtStartTime;

@Property()
atEndTime: AutomationAtEndTime;
}

@Form({
included: {
components: `/components`
}
})
export class ScheduledMaintenance {
@Property()
automationOptions: AutomationOptions;
}

describe("Deep Nested form integration", () => {
it("should generate form and nested form", async () => {
const form = await getFormioSchema(ScheduledMaintenance);

expect(form).toMatchSnapshot();
});
});

0 comments on commit 3fd9333

Please sign in to comment.