Skip to content

Commit 9a50258

Browse files
papadopanpamfilos
papadopan
authored and
pamfilos
committed
ui: add dynamic schema for all the simple field types
Signed-off-by: papadopan <[email protected]>
1 parent fe83180 commit 9a50258

File tree

4 files changed

+193
-29
lines changed

4 files changed

+193
-29
lines changed

‎ui/cap-react/src/components/cms/components/SchemaWizard/PropertyEditor/customizeField.js‎

Lines changed: 19 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -123,7 +123,7 @@ class CustomizeField extends React.Component {
123123
});
124124
};
125125

126-
getSchemaForm = uiSchema => {
126+
getSchemaForm = (uiSchema, schema) => {
127127
// check if there is not uiSchema
128128
if (!uiSchema) return;
129129
let type;
@@ -143,6 +143,12 @@ class CustomizeField extends React.Component {
143143
type = uiSchema["ui:object"];
144144
}
145145

146+
// in case we can not define the type of the element from the uiSchema,
147+
// extract the type from the schema
148+
if (!uiSchema["ui:widget"] && !uiSchema["ui:field"]) {
149+
type = schema.type;
150+
}
151+
146152
// if there is no type then there is nothing to return
147153
if (!type) return;
148154
const objs = {
@@ -174,7 +180,7 @@ class CustomizeField extends React.Component {
174180
);
175181
};
176182

177-
getUISchemaForm = uiSchema => {
183+
getUISchemaForm = (uiSchema, schema) => {
178184
// check if there is not uiSchema
179185
if (!uiSchema) return;
180186
let type;
@@ -193,6 +199,11 @@ class CustomizeField extends React.Component {
193199
if (uiSchema["ui:object"]) {
194200
type = uiSchema["ui:object"];
195201
}
202+
// in case we can not define the type of the element from the uiSchema,
203+
// fetch the schema and extract the type from there
204+
if (!uiSchema["ui:widget"] && !uiSchema["ui:field"]) {
205+
type = schema.type;
206+
}
196207

197208
// if there is no type then there is nothing to return
198209
if (!type) return;
@@ -236,7 +247,10 @@ class CustomizeField extends React.Component {
236247
this.setState({ showDeleteLayer: false });
237248
}}
238249
/>
239-
{this.getSchemaForm(this.props.uiSchema && this.props.uiSchema.toJS())}
250+
{this.getSchemaForm(
251+
this.props.uiSchema && this.props.uiSchema.toJS(),
252+
this.props.schema && this.props.schema.toJS()
253+
)}
240254
<Box>
241255
<Box colorIndex="accent-2" flex={false} pad="small">
242256
<Label size="medium" margin="none">
@@ -307,7 +321,8 @@ class CustomizeField extends React.Component {
307321
))}
308322
</Box>
309323
{this.getUISchemaForm(
310-
this.props.uiSchema && this.props.uiSchema.toJS()
324+
this.props.uiSchema && this.props.uiSchema.toJS(),
325+
this.props.schema && this.props.schema.toJS()
311326
)}
312327
<Box
313328
direction="row"

‎ui/cap-react/src/components/cms/components/SchemaWizard/SchemaPreview/SchemaTree/ArrayFieldTemplate.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ const ArrayFieldTemplate = props => {
2424
};
2525

2626
let __path = {
27-
schema: [...props.formContext.schema, ...schemaPath, "items"],
27+
schema: [...props.formContext.schema, ...schemaPath],
2828
uiSchema: [...props.formContext.uiSchema, ...uiSchemaPath]
2929
};
3030

‎ui/cap-react/src/components/cms/components/SchemaWizard/SchemaPreview/SchemaTree/SchemaTreeItem.js‎

Lines changed: 1 addition & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -13,19 +13,11 @@ class SchemaTreeItem extends React.Component {
1313
super(props);
1414
}
1515

16+
// selects the item for the property editor
1617
_onClick = () => {
17-
// this.props.selectProperty(this.props.rawErrors[0]);
1818
this.props.selectProperty(this.props.path);
1919
};
2020

21-
_addProperty = () => {
22-
this.props.addProperty(this.props.path);
23-
};
24-
25-
_addItem = () => {
26-
this.props.addItem(this.props.path);
27-
};
28-
2921
shouldBoxAcceptChildren = uiSchema => {
3022
return uiSchema["ui:field"] !== undefined;
3123
};

‎ui/cap-react/src/components/cms/components/utils/fieldTypes.js‎

Lines changed: 172 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -595,27 +595,60 @@ const simple = {
595595
title: "JSON Object",
596596
description: "Data in JSON format, Grouped section",
597597
child: {},
598-
default: {
599-
schema: {
600-
type: "object",
601-
properties: {}
602-
},
603-
uiSchema: {
598+
optionsSchema: {
599+
type: "object",
600+
title: "Object Widget Properties",
601+
properties: {
602+
title: {
603+
type: "string",
604+
title: "Title",
605+
description:
606+
"Provide the title you want to be displayed to your object"
607+
},
608+
description: {
609+
type: "string",
610+
title: "Description",
611+
description:
612+
"Provide the description you want to be displayed to your object"
613+
}
614+
}
615+
},
616+
optionsUiSchema: {
617+
type: "object",
618+
title: "Object UI Options",
619+
properties: {
604620
"ui:options": {
605-
grid: {
606-
gridColumns: "1/5"
621+
type: "object",
622+
title: "UI Options",
623+
properties: {
624+
grid: {
625+
type: "object",
626+
title: "Grid Options",
627+
properties: {
628+
gridColumns: {
629+
title: "Grid Columns",
630+
type: "string"
631+
}
632+
}
633+
}
607634
}
608635
}
609636
}
610-
}
611-
},
612-
reference: {
613-
title: "Reference",
614-
description: "For example, an analysis can reference its author(s)",
615-
child: {},
637+
},
638+
optionsUiSchemaUiSchema: {
639+
"ui:options": {
640+
grid: {
641+
gridColumns: {
642+
"ui:widget": "selectColumns"
643+
}
644+
}
645+
}
646+
},
647+
optionsSchemaUiSchema: {},
616648
default: {
617649
schema: {
618-
type: "string"
650+
type: "object",
651+
properties: {}
619652
},
620653
uiSchema: {
621654
"ui:options": {
@@ -626,10 +659,85 @@ const simple = {
626659
}
627660
}
628661
},
662+
// reference: {
663+
// title: "Reference",
664+
// description: "For example, an analysis can reference its author(s)",
665+
// child: {},
666+
// default: {
667+
// schema: {
668+
// type: "string"
669+
// },
670+
// uiSchema: {
671+
// "ui:options": {
672+
// grid: {
673+
// gridColumns: "1/5"
674+
// }
675+
// }
676+
// }
677+
// }
678+
// },
629679
boolean: {
630680
title: "Boolean",
631681
description: "Yes or no, 1 or 0, true or false",
632682
child: {},
683+
optionsSchema: {
684+
type: "object",
685+
title: "Boolean Schema Options",
686+
properties: {
687+
title: {
688+
type: "string",
689+
title: "Provide a title for the element",
690+
description: "This title will be used for the form"
691+
},
692+
description: {
693+
type: "string",
694+
title: "Provide a desctiption for the element",
695+
description: "This description will be used for the form"
696+
},
697+
readOnly: {
698+
type: "boolean",
699+
title: "Do you want this field to be read only?",
700+
enum: [true, false],
701+
enumNames: ["ReadOnly", "Editable"]
702+
}
703+
}
704+
},
705+
optionsSchemaUiSchema: {
706+
readOnly: {
707+
"ui:widget": "select"
708+
}
709+
},
710+
optionsUiSchema: {
711+
type: "object",
712+
title: "Switch Widget UI Options",
713+
properties: {
714+
"ui:options": {
715+
type: "object",
716+
title: "UI Options",
717+
properties: {
718+
grid: {
719+
type: "object",
720+
title: "Grid Options",
721+
properties: {
722+
gridColumns: {
723+
title: "Grid Columns",
724+
type: "string"
725+
}
726+
}
727+
}
728+
}
729+
}
730+
}
731+
},
732+
optionsUiSchemaUiSchema: {
733+
"ui:options": {
734+
grid: {
735+
gridColumns: {
736+
"ui:widget": "selectColumns"
737+
}
738+
}
739+
}
740+
},
633741
default: {
634742
schema: {
635743
type: "boolean"
@@ -648,6 +756,55 @@ const simple = {
648756
description:
649757
"A list of things. List of strings, numbers, objects, references",
650758
child: {},
759+
optionsSchema: {
760+
type: "object",
761+
title: "Array Schema Options",
762+
properties: {
763+
title: {
764+
type: "string",
765+
title: "Provide a title for your array",
766+
description: "This is the title that will be displayed for the array"
767+
},
768+
description: {
769+
title: "Provide a descritpion for the element",
770+
type: "string",
771+
description:
772+
"This description will be provided for this specific element"
773+
}
774+
}
775+
},
776+
optionsSchemaUiSchema: {},
777+
optionsUiSchema: {
778+
type: "object",
779+
title: "Array UI Options",
780+
properties: {
781+
"ui:options": {
782+
type: "object",
783+
title: "UI Options",
784+
properties: {
785+
grid: {
786+
type: "object",
787+
title: "Grid Options",
788+
properties: {
789+
gridColumns: {
790+
title: "Grid Columns",
791+
type: "string"
792+
}
793+
}
794+
}
795+
}
796+
}
797+
}
798+
},
799+
optionsUiSchemaUiSchema: {
800+
"ui:options": {
801+
grid: {
802+
gridColumns: {
803+
"ui:widget": "selectColumns"
804+
}
805+
}
806+
}
807+
},
651808
default: {
652809
schema: {
653810
type: "array",

0 commit comments

Comments
 (0)