UX: Allow a default value to be specified for enum properties (#26529)

Why this change?

For a `typed: objects` theme setting with an enum property, we are
adding a `default` key for `type: enum` fields which will be used
as the default value on the client side.

```
some_objects_setting:
  type: objects
  schema:
    name: field
    properties:
      enum_field:
        type: enum
        default: awesome
        choices:
          - nice
          - cool
          - awesome
```
This commit is contained in:
Alan Guo Xiang Tan 2024-04-05 11:44:39 +08:00 committed by GitHub
parent 67a8080e33
commit de5ca63eb5
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 29 additions and 8 deletions

View File

@ -5,7 +5,7 @@ import FieldInputDescription from "admin/components/schema-theme-setting/field-i
import ComboBox from "select-kit/components/combo-box";
export default class SchemaThemeSettingTypeEnum extends Component {
@tracked value = this.args.value;
@tracked value = this.args.value || this.args.spec.default;
get content() {
return this.args.spec.choices.map((choice) => {

View File

@ -179,10 +179,6 @@ export default function schemaAndData(version = 1) {
boolean_field: {
type: "boolean",
},
enum_field: {
type: "enum",
choices: ["nice", "awesome", "cool"]
},
category_field: {
type: "categories",
},
@ -199,13 +195,11 @@ export default function schemaAndData(version = 1) {
name: "lamb",
integer_field: 92,
boolean_field: true,
enum_field: "awesome"
},
{
name: "cow",
integer_field: 820,
boolean_field: false,
enum_field: "cool"
},
];
} else {

View File

@ -641,20 +641,43 @@ module(
});
test("input fields of type enum", async function (assert) {
const setting = schemaAndData(3);
const setting = ThemeSettings.create({
setting: "objects_setting",
objects_schema: {
name: "something",
properties: {
enum_field: {
type: "enum",
default: "awesome",
choices: ["nice", "cool", "awesome"],
},
},
},
value: [
{
enum_field: "awesome",
},
{
enum_field: "cool",
},
],
});
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
const inputFields = new InputFieldsFromDOM();
const enumSelector = selectKit(
`${inputFields.fields.enum_field.selector} .select-kit`
);
assert.strictEqual(enumSelector.header().value(), "awesome");
await enumSelector.expand();
await enumSelector.selectRowByValue("nice");
assert.strictEqual(enumSelector.header().value(), "nice");
const tree = new TreeFromDOM();
@ -665,6 +688,10 @@ module(
await click(tree.nodes[0].element);
assert.strictEqual(enumSelector.header().value(), "nice");
await click(TOP_LEVEL_ADD_BTN);
assert.strictEqual(enumSelector.header().value(), "awesome");
});
test("input fields of type categories that is not required with min and max validations", async function (assert) {