DEV: replaces subtitle by description (#28881)

Description should be above the field and that makes subtitle useless.

Co-authored-by: chapoi <101828855+chapoi@users.noreply.github.com>
This commit is contained in:
Joffrey JAFFEUX 2024-09-18 11:14:59 +02:00 committed by GitHub
parent dd5502f166
commit e4e2bc7add
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
12 changed files with 24 additions and 53 deletions

View File

@ -82,7 +82,7 @@ export default class AdminConfigAreasAboutContactInformation extends Component {
<form.Field
@name="communityOwner"
@title={{i18n "admin.config_areas.about.community_owner"}}
@subtitle={{i18n "admin.config_areas.about.community_owner_help"}}
@description={{i18n "admin.config_areas.about.community_owner_help"}}
@format="large"
as |field|
>
@ -96,7 +96,7 @@ export default class AdminConfigAreasAboutContactInformation extends Component {
<form.Field
@name="contactEmail"
@title={{i18n "admin.config_areas.about.contact_email"}}
@subtitle={{i18n "admin.config_areas.about.contact_email_help"}}
@description={{i18n "admin.config_areas.about.contact_email_help"}}
@type="email"
@format="large"
as |field|
@ -111,7 +111,7 @@ export default class AdminConfigAreasAboutContactInformation extends Component {
<form.Field
@name="contactURL"
@title={{i18n "admin.config_areas.about.contact_url"}}
@subtitle={{i18n "admin.config_areas.about.contact_url_help"}}
@description={{i18n "admin.config_areas.about.contact_url_help"}}
@type="url"
@format="large"
as |field|
@ -126,7 +126,7 @@ export default class AdminConfigAreasAboutContactInformation extends Component {
<form.Field
@name="contactUsername"
@title={{i18n "admin.config_areas.about.site_contact_name"}}
@subtitle={{i18n "admin.config_areas.about.site_contact_name_help"}}
@description={{i18n "admin.config_areas.about.site_contact_name_help"}}
@onSet={{this.setContactUsername}}
@format="large"
as |field|
@ -143,7 +143,7 @@ export default class AdminConfigAreasAboutContactInformation extends Component {
<form.Field
@name="contactGroupName"
@title={{i18n "admin.config_areas.about.site_contact_group"}}
@subtitle={{i18n "admin.config_areas.about.site_contact_group_help"}}
@description={{i18n "admin.config_areas.about.site_contact_group_help"}}
@onSet={{this.setContactGroup}}
@format="large"
as |field|

View File

@ -98,7 +98,7 @@ export default class AdminConfigAreasAboutGeneralSettings extends Component {
<form.Field
@name="aboutBannerImage"
@title={{i18n "admin.config_areas.about.banner_image"}}
@subtitle={{i18n "admin.config_areas.about.banner_image_help"}}
@description={{i18n "admin.config_areas.about.banner_image_help"}}
@onSet={{this.setImage}}
as |field|
>

View File

@ -58,7 +58,7 @@ export default class AdminConfigAreasAboutYourOrganization extends Component {
<form.Field
@name="companyName"
@title={{i18n "admin.config_areas.about.company_name"}}
@subtitle={{i18n "admin.config_areas.about.company_name_help"}}
@description={{i18n "admin.config_areas.about.company_name_help"}}
@format="large"
as |field|
>
@ -75,7 +75,7 @@ export default class AdminConfigAreasAboutYourOrganization extends Component {
<form.Field
@name="governingLaw"
@title={{i18n "admin.config_areas.about.governing_law"}}
@subtitle={{i18n "admin.config_areas.about.governing_law_help"}}
@description={{i18n "admin.config_areas.about.governing_law_help"}}
@format="large"
as |field|
>
@ -89,7 +89,7 @@ export default class AdminConfigAreasAboutYourOrganization extends Component {
<form.Field
@name="cityForDisputes"
@title={{i18n "admin.config_areas.about.city_for_disputes"}}
@subtitle={{i18n "admin.config_areas.about.city_for_disputes_help"}}
@description={{i18n "admin.config_areas.about.city_for_disputes_help"}}
@format="large"
as |field|
>

View File

@ -3,7 +3,7 @@ import { concat } from "@ember/helper";
import { action } from "@ember/object";
import FKLabel from "discourse/form-kit/components/fk/label";
import FKMeta from "discourse/form-kit/components/fk/meta";
import FormText from "discourse/form-kit/components/fk/text";
import FKText from "discourse/form-kit/components/fk/text";
import concatClass from "discourse/helpers/concat-class";
import i18n from "discourse-common/helpers/i18n";
@ -60,10 +60,10 @@ export default class FKControlWrapper extends Component {
</FKLabel>
{{/if}}
{{#if @field.subtitle}}
<FormText
class="form-kit__container-subtitle"
>{{@field.subtitle}}</FormText>
{{#if @field.description}}
<FKText
class="form-kit__container-description"
>{{@field.description}}</FKText>
{{/if}}
<div
@ -93,12 +93,7 @@ export default class FKControlWrapper extends Component {
{{yield components}}
</@component>
<FKMeta
@description={{@field.description}}
@value={{@value}}
@field={{@field}}
@error={{this.error}}
/>
<FKMeta @value={{@value}} @field={{@field}} @error={{this.error}} />
</div>
</div>
</template>

View File

@ -3,7 +3,6 @@ import { hash } from "@ember/helper";
import FKFieldset from "discourse/form-kit/components/fk/fieldset";
import FKControlRadioGroupRadio from "./radio-group/radio";
// eslint-disable-next-line ember/no-empty-glimmer-component-classes
export default class FKControlRadioGroup extends Component {
static controlType = "radio-group";

View File

@ -49,7 +49,6 @@ export default class FKField extends Component {
this.field = this.args.registerField(this.name, {
triggerRevalidationFor: this.args.triggerRevalidationFor,
title: this.args.title,
subtitle: this.args.subtitle,
description: this.args.description,
showTitle: this.args.showTitle,
collectionIndex: this.args.collectionIndex,

View File

@ -1,7 +1,6 @@
import Component from "@glimmer/component";
import FKCharCounter from "discourse/form-kit/components/fk/char-counter";
import FKErrors from "discourse/form-kit/components/fk/errors";
import FKText from "discourse/form-kit/components/fk/text";
export default class FKMeta extends Component {
get shouldRenderCharCounter() {
@ -9,12 +8,7 @@ export default class FKMeta extends Component {
}
get shouldRenderMeta() {
return (
this.showMeta &&
(this.shouldRenderCharCounter ||
this.args.error ||
this.args.description?.length)
);
return this.showMeta && (this.shouldRenderCharCounter || this.args.error);
}
get showMeta() {
@ -26,8 +20,6 @@ export default class FKMeta extends Component {
<div class="form-kit__meta">
{{#if @error}}
<FKErrors @id={{@field.errorId}} @error={{@error}} />
{{else if @description}}
<FKText class="form-kit__meta-description">{{@description}}</FKText>
{{/if}}
{{#if this.shouldRenderCharCounter}}

View File

@ -142,12 +142,6 @@ class FieldHelper {
}
}
hasSubtitle(subtitle, message) {
this.context
.dom(this.element.querySelector(".form-kit__container-subtitle"))
.hasText(subtitle, message);
}
hasDescription(description, message) {
switch (this.element.dataset.controlType) {
case "checkbox": {
@ -162,7 +156,7 @@ class FieldHelper {
}
default: {
this.context
.dom(this.element.querySelector(".form-kit__meta-description"))
.dom(this.element.querySelector(".form-kit__container-description"))
.hasText(description, message);
}
}

View File

@ -11,7 +11,7 @@ module(
test("default", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @subtitle="Bar" as |field|>
<form.Field @name="foo" @title="Foo" @description="Bar" as |field|>
<field.Custom>
<input class="custom-test" />
</field.Custom>
@ -20,7 +20,7 @@ module(
</template>);
assert.dom(".form-kit__container-title").hasText("Foo (optional)");
assert.dom(".form-kit__container-subtitle").hasText("Bar");
assert.dom(".form-kit__container-description").hasText("Bar");
});
}
);

View File

@ -35,18 +35,6 @@ module("Integration | Component | FormKit | Field", function (hooks) {
assert.dom(".form-kit__row .form-kit__col.--col-8").hasText("Test");
});
test("@subtitle", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @subtitle="foo foo" as |field|>
<field.Input />
</form.Field>
</Form>
</template>);
assert.form().field("foo").hasSubtitle("foo foo");
});
test("@description", async function (assert) {
await render(<template>
<Form as |form|>

View File

@ -35,6 +35,11 @@
}
}
.form-kit__container-description {
margin: 0;
font-size: var(--font-down-1-rem);
}
.form-kit__container-content {
&.--small {
width: var(--form-kit-small-input) !important;

View File

@ -18,7 +18,6 @@
</form.Field>
<form.Field
@title="Secret"
@subtitle="Another secret"
@name="secret"
@description="An important password"
as |field|