mirror of
https://github.com/discourse/discourse.git
synced 2024-12-02 18:43:44 +08:00
6dac187785
Why this change?
In cdba864598, we added support for adding
a description which will be displayed under the input of each property
on the client side.
Currently this convention in the locale file is followed:
```
en:
theme_metadata:
settings:
objects_setting:
description: <description> for the setting
schema:
properties:
name: <description for the name property>
links:
name: <description for the name property in link>
url: <description for the url property in link>
```
Since we now want to allow the label to be translated as well, we will
be changing the convention to the following:
```
en:
theme_metadata:
settings:
objects_setting:
description: <description> for the setting
schema:
properties:
name:
label: <label for the name property>
description: <description for the name property>
links:
name:
label: <label for the name property>
description: <description for the name property in link>
url:
label: <label for the url property>
description: <description for the url property in link>
```
If the locale file does not provide a `label` key under the property's
name, the client side will just display the property's name as the
label for the input field.
67 lines
1.7 KiB
Plaintext
67 lines
1.7 KiB
Plaintext
import Component from "@glimmer/component";
|
|
import { cached } from "@glimmer/tracking";
|
|
import htmlSafe from "discourse-common/helpers/html-safe";
|
|
import BooleanField from "./types/boolean";
|
|
import CategoriesField from "./types/categories";
|
|
import EnumField from "./types/enum";
|
|
import FloatField from "./types/float";
|
|
import GroupField from "./types/group";
|
|
import IntegerField from "./types/integer";
|
|
import StringField from "./types/string";
|
|
import TagsField from "./types/tags";
|
|
|
|
export default class SchemaThemeSettingField extends Component {
|
|
get component() {
|
|
const type = this.args.spec.type;
|
|
|
|
switch (this.args.spec.type) {
|
|
case "string":
|
|
return StringField;
|
|
case "integer":
|
|
return IntegerField;
|
|
case "float":
|
|
return FloatField;
|
|
case "boolean":
|
|
return BooleanField;
|
|
case "enum":
|
|
return EnumField;
|
|
case "categories":
|
|
return CategoriesField;
|
|
case "tags":
|
|
return TagsField;
|
|
case "group":
|
|
return GroupField;
|
|
default:
|
|
throw new Error(`unknown type ${type}`);
|
|
}
|
|
}
|
|
|
|
@cached
|
|
get description() {
|
|
if (!this.args.description) {
|
|
return;
|
|
}
|
|
|
|
return htmlSafe(this.args.description.trim().replace(/\n/g, "<br>"));
|
|
}
|
|
|
|
<template>
|
|
<div class="schema-field" data-name={{@name}}>
|
|
<label class="schema-field__label">{{@label}}{{if
|
|
@spec.required
|
|
"*"
|
|
}}</label>
|
|
|
|
<div class="schema-field__input">
|
|
<this.component
|
|
@value={{@value}}
|
|
@spec={{@spec}}
|
|
@onChange={{@onValueChange}}
|
|
@description={{this.description}}
|
|
@setting={{@setting}}
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
}
|