Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

DEV: Migrate about config area to Form Kit (#28021) 

Form Kit is our new form library/framework for unifying the way forms look across Discourse. The admin config area for the /about page is a new form that isn't currently used, so it makes sense for it to be one of the first forms to be migrated to Form Kit to test the library.

Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
This commit is contained in:
Osama Sayegh 2024-07-25 19:07:38 +03:00 committed by GitHub
parent 45f6bc0093
commit 7cc0f26292
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
15 changed files with 360 additions and 267 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

226
app/assets/javascripts/admin/addon/components/admin-config-area-cards/about/contact-information.gjs
View File

@ -1,11 +1,9 @@
import Component from "@glimmer/component"; import Component from "@glimmer/component";
import { tracked } from "@glimmer/tracking"; import { cached, tracked } from "@glimmer/tracking";
import { fn, hash } from "@ember/helper"; import { hash } from "@ember/helper";
import { on } from "@ember/modifier";
import { action } from "@ember/object"; import { action } from "@ember/object";
import { service } from "@ember/service"; import { service } from "@ember/service";
import DButton from "discourse/components/d-button"; import Form from "discourse/components/form";
import withEventValue from "discourse/helpers/with-event-value";
import { ajax } from "discourse/lib/ajax"; import { ajax } from "discourse/lib/ajax";
import { popupAjaxError } from "discourse/lib/ajax-error"; import { popupAjaxError } from "discourse/lib/ajax-error";
import i18n from "discourse-common/helpers/i18n"; import i18n from "discourse-common/helpers/i18n";
@ -17,42 +15,50 @@ export default class AdminConfigAreasAboutContactInformation extends Component {
@service site; @service site;
@service toasts; @service toasts;
@tracked
contactUsername = this.args.contactInformation.contactUsername.value || null;
@tracked @tracked
contactGroupId = this.site.groups.find( contactGroupId = this.site.groups.find(
(group) => group.name === this.contactGroupName (group) => group.name === this.data.contactGroupName
)?.id; )?.id;
communityOwner = this.args.contactInformation.communityOwner.value; @cached
contactEmail = this.args.contactInformation.contactEmail.value; get data() {
contactURL = this.args.contactInformation.contactURL.value; return {
contactGroupName = this.args.contactInformation.contactGroupName.value; communityOwner: this.args.contactInformation.communityOwner.value,
contactEmail: this.args.contactInformation.contactEmail.value,
@action contactURL: this.args.contactInformation.contactURL.value,
onContactUsernameChange(usernames) { contactGroupName: this.args.contactInformation.contactGroupName.value,
this.contactUsername = usernames[0]; contactUsername:
this.args.contactInformation.contactUsername.value || null,
};
} }
@action @action
onContactGroupIdChange(ids, groups) { setContactUsername(usernames, { set }) {
this.contactGroupId = ids[0]; set("contactUsername", usernames[0] || null);
this.contactGroupName = groups[0]?.name;
} }
@action @action
async save() { setContactGroup(groupIds, { set }) {
this.contactGroupId = groupIds[0];
set(
"contactGroupName",
this.site.groups.find((group) => group.id === groupIds[0])?.name
);
}
@action
async save(data) {
try { try {
this.args.setGlobalSavingStatus(true); this.args.setGlobalSavingStatus(true);
await ajax("/admin/config/about.json", { await ajax("/admin/config/about.json", {
type: "PUT", type: "PUT",
data: { data: {
contact_information: { contact_information: {
community_owner: this.communityOwner, community_owner: data.communityOwner,
contact_email: this.contactEmail, contact_email: data.contactEmail,
contact_url: this.contactURL, contact_url: data.contactURL,
contact_username: this.contactUsername, contact_username: data.contactUsername,
contact_group_name: this.contactGroupName, contact_group_name: data.contactGroupName,
}, },
}, },
}); });
@ -72,92 +78,90 @@ export default class AdminConfigAreasAboutContactInformation extends Component {
} }
<template> <template>
<div class="control-group community-owner-input"> <Form @data={{this.data}} @onSubmit={{this.save}} as |form|>
<label> <form.Field
<span>{{i18n "admin.config_areas.about.community_owner"}}</span> @name="communityOwner"
<span class="admin-config-area-card__label-optional">{{i18n @title={{i18n "admin.config_areas.about.community_owner"}}
"admin.config_areas.about.optional" @subtitle={{i18n "admin.config_areas.about.community_owner_help"}}
}}</span> @format="large"
</label> as |field|
<p class="admin-config-area-card__additional-help"> >
{{i18n "admin.config_areas.about.community_owner_help"}} <field.Input
</p> placeholder={{i18n
<input "admin.config_areas.about.community_owner_placeholder"
{{on "input" (withEventValue (fn (mut this.communityOwner)))}} }}
type="text" />
value={{this.communityOwner}} </form.Field>
<form.Field
@name="contactEmail"
@title={{i18n "admin.config_areas.about.contact_email"}}
@subtitle={{i18n "admin.config_areas.about.contact_email_help"}}
@type="email"
@format="large"
as |field|
>
<field.Input
placeholder={{i18n
"admin.config_areas.about.contact_email_placeholder"
}}
/>
</form.Field>
<form.Field
@name="contactURL"
@title={{i18n "admin.config_areas.about.contact_url"}}
@subtitle={{i18n "admin.config_areas.about.contact_url_help"}}
@type="url"
@format="large"
as |field|
>
<field.Input
placeholder={{i18n
"admin.config_areas.about.contact_url_placeholder"
}}
/>
</form.Field>
<form.Field
@name="contactUsername"
@title={{i18n "admin.config_areas.about.site_contact_name"}}
@subtitle={{i18n "admin.config_areas.about.site_contact_group_help"}}
@onSet={{this.setContactUsername}}
@format="large"
as |field|
>
<field.Custom>
<UserChooser
@value={{field.value}}
@options={{hash maximum=1}}
@onChange={{field.set}}
/>
</field.Custom>
</form.Field>
<form.Field
@name="contactGroupName"
@title={{i18n "admin.config_areas.about.site_contact_group"}}
@subtitle={{i18n "admin.config_areas.about.site_contact_group_help"}}
@onSet={{this.setContactGroup}}
@format="large"
as |field|
>
<field.Custom>
<GroupChooser
@content={{this.site.groups}}
@value={{this.contactGroupId}}
@options={{hash maximum=1}}
@onChange={{field.set}}
/>
</field.Custom>
</form.Field>
<form.Submit
@label="admin.config_areas.about.update"
@disabled={{@globalSavingStatus}}
/> />
</div> </Form>
<div class="control-group contact-email-input">
<label>
<span>{{i18n "admin.config_areas.about.contact_email"}}</span>
<span class="admin-config-area-card__label-optional">{{i18n
"admin.config_areas.about.optional"
}}</span>
</label>
<p class="admin-config-area-card__additional-help">
{{i18n "admin.config_areas.about.contact_email_help"}}
</p>
<input
{{on "input" (withEventValue (fn (mut this.contactEmail)))}}
type="text"
value={{this.contactEmail}}
/>
</div>
<div class="control-group contact-url-input">
<label>
<span>{{i18n "admin.config_areas.about.contact_url"}}</span>
<span class="admin-config-area-card__label-optional">{{i18n
"admin.config_areas.about.optional"
}}</span>
</label>
<p class="admin-config-area-card__additional-help">
{{i18n "admin.config_areas.about.contact_url_help"}}
</p>
<input
{{on "input" (withEventValue (fn (mut this.contactURL)))}}
type="text"
value={{this.contactURL}}
/>
</div>
<div class="control-group site-contact-username-input">
<label>
<span>{{i18n "admin.config_areas.about.site_contact_name"}}</span>
<span class="admin-config-area-card__label-optional">{{i18n
"admin.config_areas.about.optional"
}}</span>
</label>
<p class="admin-config-area-card__additional-help">
{{i18n "admin.config_areas.about.site_contact_name_help"}}
</p>
<UserChooser
@value={{this.contactUsername}}
@onChange={{this.onContactUsernameChange}}
@options={{hash maximum=1}}
/>
</div>
<div class="control-group site-contact-group-input">
<label>
<span>{{i18n "admin.config_areas.about.site_contact_group"}}</span>
<span class="admin-config-area-card__label-optional">{{i18n
"admin.config_areas.about.optional"
}}</span>
</label>
<p class="admin-config-area-card__additional-help">
{{i18n "admin.config_areas.about.site_contact_group_help"}}
</p>
<GroupChooser
@content={{this.site.groups}}
@value={{this.contactGroupId}}
@onChange={{this.onContactGroupIdChange}}
@options={{hash maximum=1}}
/>
</div>
<DButton
@label="admin.config_areas.about.update"
@action={{this.save}}
@disabled={{@globalSavingStatus}}
class="btn-primary admin-config-area-card__btn-save"
/>
</template> </template>
} }

125
app/assets/javascripts/admin/addon/components/admin-config-area-cards/about/general-settings.gjs
View File

@ -1,12 +1,8 @@
import Component from "@glimmer/component"; import Component from "@glimmer/component";
import { fn } from "@ember/helper"; import { cached } from "@glimmer/tracking";
import { on } from "@ember/modifier";
import { action } from "@ember/object"; import { action } from "@ember/object";
import { service } from "@ember/service"; import { service } from "@ember/service";
import DButton from "discourse/components/d-button"; import Form from "discourse/components/form";
import DEditor from "discourse/components/d-editor";
import UppyImageUploader from "discourse/components/uppy-image-uploader";
import withEventValue from "discourse/helpers/with-event-value";
import { ajax } from "discourse/lib/ajax"; import { ajax } from "discourse/lib/ajax";
import { popupAjaxError } from "discourse/lib/ajax-error"; import { popupAjaxError } from "discourse/lib/ajax-error";
import i18n from "discourse-common/helpers/i18n"; import i18n from "discourse-common/helpers/i18n";
@ -20,18 +16,29 @@ export default class AdminConfigAreasAboutGeneralSettings extends Component {
extendedDescription = this.args.generalSettings.extendedSiteDescription.value; extendedDescription = this.args.generalSettings.extendedSiteDescription.value;
aboutBannerImage = this.args.generalSettings.aboutBannerImage.value; aboutBannerImage = this.args.generalSettings.aboutBannerImage.value;
@cached
get data() {
return {
name: this.args.generalSettings.title.value,
summary: this.args.generalSettings.siteDescription.value,
extendedDescription:
this.args.generalSettings.extendedSiteDescription.value,
aboutBannerImage: this.args.generalSettings.aboutBannerImage.value,
};
}
@action @action
async save() { async save(data) {
try { try {
this.args.setGlobalSavingStatus(true); this.args.setGlobalSavingStatus(true);
await ajax("/admin/config/about.json", { await ajax("/admin/config/about.json", {
type: "PUT", type: "PUT",
data: { data: {
general_settings: { general_settings: {
name: this.name, name: data.name,
summary: this.summary, summary: data.summary,
extended_description: this.extendedDescription, extended_description: data.extendedDescription,
about_banner_image: this.aboutBannerImage, about_banner_image: data.aboutBannerImage,
}, },
}, },
}); });
@ -50,52 +57,58 @@ export default class AdminConfigAreasAboutGeneralSettings extends Component {
} }
} }
@action
setImage(upload, { set }) {
set("aboutBannerImage", upload.url);
}
<template> <template>
<div class="control-group community-name-input"> <Form @data={{this.data}} @onSubmit={{this.save}} as |form|>
<label>{{i18n "admin.config_areas.about.community_name"}}</label> <form.Field
<input @name="name"
{{on "input" (withEventValue (fn (mut this.name)))}} @title={{i18n "admin.config_areas.about.community_name"}}
type="text" @validation="required"
value={{this.name}} @format="large"
as |field|
>
<field.Input
placeholder={{i18n
"admin.config_areas.about.community_name_placeholder"
}}
/>
</form.Field>
<form.Field
@name="summary"
@title={{i18n "admin.config_areas.about.community_summary"}}
@format="large"
as |field|
>
<field.Input />
</form.Field>
<form.Field
@name="extendedDescription"
@title={{i18n "admin.config_areas.about.community_description"}}
as |field|
>
<field.Composer />
</form.Field>
<form.Field
@name="aboutBannerImage"
@title={{i18n "admin.config_areas.about.banner_image"}}
@subtitle={{i18n "admin.config_areas.about.banner_image_help"}}
@onSet={{this.setImage}}
as |field|
>
<field.Image />
</form.Field>
<form.Submit
@label="admin.config_areas.about.update"
@disabled={{@globalSavingStatus}}
/> />
</div> </Form>
<div class="control-group community-summary-input">
<label>{{i18n "admin.config_areas.about.community_summary"}}</label>
<input
{{on "input" (withEventValue (fn (mut this.summary)))}}
type="text"
value={{this.summary}}
/>
</div>
<div class="control-group community-description-input">
<label>
<span>{{i18n "admin.config_areas.about.community_description"}}</span>
<span class="admin-config-area-card__label-optional">{{i18n
"admin.config_areas.about.optional"
}}</span>
</label>
<DEditor @value={{this.extendedDescription}} />
</div>
<div class="control-group banner-image-uploader">
<label>
<span>{{i18n "admin.config_areas.about.banner_image"}}</span>
<span class="admin-config-area-card__label-optional">{{i18n
"admin.config_areas.about.optional"
}}</span>
</label>
<p class="admin-config-area-card__additional-help">
{{i18n "admin.config_areas.about.banner_image_help"}}
</p>
<UppyImageUploader
@type="site_setting"
@imageUrl={{this.aboutBannerImage}}
/>
</div>
<DButton
@label="admin.config_areas.about.update"
@action={{this.save}}
@disabled={{@globalSavingStatus}}
class="btn-primary admin-config-area-card__btn-save"
/>
</template> </template>
} }

127
app/assets/javascripts/admin/addon/components/admin-config-area-cards/about/your-organization.gjs
View File

@ -1,10 +1,8 @@
import Component from "@glimmer/component"; import Component from "@glimmer/component";
import { fn } from "@ember/helper"; import { cached } from "@glimmer/tracking";
import { on } from "@ember/modifier";
import { action } from "@ember/object"; import { action } from "@ember/object";
import { service } from "@ember/service"; import { service } from "@ember/service";
import DButton from "discourse/components/d-button"; import Form from "discourse/components/form";
import withEventValue from "discourse/helpers/with-event-value";
import { ajax } from "discourse/lib/ajax"; import { ajax } from "discourse/lib/ajax";
import { popupAjaxError } from "discourse/lib/ajax-error"; import { popupAjaxError } from "discourse/lib/ajax-error";
import i18n from "discourse-common/helpers/i18n"; import i18n from "discourse-common/helpers/i18n";
@ -17,17 +15,26 @@ export default class AdminConfigAreasAboutYourOrganization extends Component {
governingLaw = this.args.yourOrganization.governingLaw.value; governingLaw = this.args.yourOrganization.governingLaw.value;
cityForDisputes = this.args.yourOrganization.cityForDisputes.value; cityForDisputes = this.args.yourOrganization.cityForDisputes.value;
@cached
get data() {
return {
companyName: this.args.yourOrganization.companyName.value,
governingLaw: this.args.yourOrganization.governingLaw.value,
cityForDisputes: this.args.yourOrganization.cityForDisputes.value,
};
}
@action @action
async save() { async save(data) {
this.args.setGlobalSavingStatus(true); this.args.setGlobalSavingStatus(true);
try { try {
await ajax("/admin/config/about.json", { await ajax("/admin/config/about.json", {
type: "PUT", type: "PUT",
data: { data: {
your_organization: { your_organization: {
company_name: this.companyName, company_name: data.companyName,
governing_law: this.governingLaw, governing_law: data.governingLaw,
city_for_disputes: this.cityForDisputes, city_for_disputes: data.cityForDisputes,
}, },
}, },
}); });
@ -47,62 +54,56 @@ export default class AdminConfigAreasAboutYourOrganization extends Component {
} }
<template> <template>
<div class="control-group company-name-input"> <Form @data={{this.data}} @onSubmit={{this.save}} as |form|>
<label> <form.Field
<span>{{i18n "admin.config_areas.about.company_name"}}</span> @name="companyName"
<span class="admin-config-area-card__label-optional">{{i18n @title={{i18n "admin.config_areas.about.company_name"}}
"admin.config_areas.about.optional" @subtitle={{i18n "admin.config_areas.about.company_name_help"}}
}}</span> @format="large"
</label> as |field|
<p class="admin-config-area-card__additional-help"> >
{{i18n "admin.config_areas.about.company_name_help"}} <field.Input
</p> placeholder={{i18n
<p class="admin-config-area-card__warning-banner"> "admin.config_areas.about.company_name_placeholder"
}}
/>
</form.Field>
<form.Alert @type="error">
{{i18n "admin.config_areas.about.company_name_warning"}} {{i18n "admin.config_areas.about.company_name_warning"}}
</p> </form.Alert>
<input
{{on "input" (withEventValue (fn (mut this.companyName)))}} <form.Field
type="text" @name="governingLaw"
value={{this.companyName}} @title={{i18n "admin.config_areas.about.governing_law"}}
@subtitle={{i18n "admin.config_areas.about.governing_law_help"}}
@format="large"
as |field|
>
<field.Input
placeholder={{i18n
"admin.config_areas.about.governing_law_placeholder"
}}
/>
</form.Field>
<form.Field
@name="cityForDisputes"
@title={{i18n "admin.config_areas.about.city_for_disputes"}}
@subtitle={{i18n "admin.config_areas.about.city_for_disputes_help"}}
@format="large"
as |field|
>
<field.Input
placeholder={{i18n
"admin.config_areas.about.city_for_disputes_placeholder"
}}
/>
</form.Field>
<form.Submit
@label="admin.config_areas.about.update"
@disabled={{@globalSavingStatus}}
/> />
</div> </Form>
<div class="control-group governing-law-input">
<label>
<span>{{i18n "admin.config_areas.about.governing_law"}}</span>
<span class="admin-config-area-card__label-optional">{{i18n
"admin.config_areas.about.optional"
}}</span>
</label>
<p class="admin-config-area-card__additional-help">
{{i18n "admin.config_areas.about.governing_law_help"}}
</p>
<input
{{on "input" (withEventValue (fn (mut this.governingLaw)))}}
type="text"
value={{this.governingLaw}}
/>
</div>
<div class="control-group city-for-disputes-input">
<label>
<span>{{i18n "admin.config_areas.about.city_for_disputes"}}</span>
<span class="admin-config-area-card__label-optional">{{i18n
"admin.config_areas.about.optional"
}}</span>
</label>
<p class="admin-config-area-card__additional-help">
{{i18n "admin.config_areas.about.city_for_disputes_help"}}
</p>
<input
{{on "input" (withEventValue (fn (mut this.cityForDisputes)))}}
type="text"
value={{this.cityForDisputes}}
/>
</div>
<DButton
@label="admin.config_areas.about.update"
@action={{this.save}}
@disabled={{@globalSavingStatus}}
class="btn-primary admin-config-area-card__btn-save"
/>
</template> </template>
} }

11
app/assets/javascripts/discourse/app/form-kit/components/fk/control/custom.gjs Normal file
View File

@ -0,0 +1,11 @@
import Component from "@glimmer/component";
export default class FKControlCustom extends Component {
static controlType = "custom";
<template>
<div class="form-kit__control-custom">
{{yield}}
</div>
</template>
}

9
app/assets/javascripts/discourse/app/form-kit/components/fk/field.gjs
View File

@ -4,6 +4,7 @@ import { hash } from "@ember/helper";
import FKControlCheckbox from "discourse/form-kit/components/fk/control/checkbox"; import FKControlCheckbox from "discourse/form-kit/components/fk/control/checkbox";
import FKControlCode from "discourse/form-kit/components/fk/control/code"; import FKControlCode from "discourse/form-kit/components/fk/control/code";
import FKControlComposer from "discourse/form-kit/components/fk/control/composer"; import FKControlComposer from "discourse/form-kit/components/fk/control/composer";
import FKControlCustom from "discourse/form-kit/components/fk/control/custom";
import FKControlIcon from "discourse/form-kit/components/fk/control/icon"; import FKControlIcon from "discourse/form-kit/components/fk/control/icon";
import FKControlImage from "discourse/form-kit/components/fk/control/image"; import FKControlImage from "discourse/form-kit/components/fk/control/image";
import FKControlInput from "discourse/form-kit/components/fk/control/input"; import FKControlInput from "discourse/form-kit/components/fk/control/input";
@ -92,6 +93,14 @@ export default class FKField extends Component {
<this.wrapper @size={{@size}}> <this.wrapper @size={{@size}}>
{{yield {{yield
(hash (hash
Custom=(component
FKControlWrapper
errors=@errors
component=FKControlCustom
value=this.value
field=this.field
format=@format
)
Code=(component Code=(component
FKControlWrapper FKControlWrapper
errors=@errors errors=@errors

26
app/assets/javascripts/discourse/tests/integration/components/form-kit/controls/custom-test.gjs Normal file
View File

@ -0,0 +1,26 @@
import { render } from "@ember/test-helpers";
import { module, test } from "qunit";
import Form from "discourse/components/form";
import { setupRenderingTest } from "discourse/tests/helpers/component-test";
module(
"Integration | Component | FormKit | Controls | Custom",
function (hooks) {
setupRenderingTest(hooks);
test("default", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @subtitle="Bar" as |field|>
<field.Custom>
<input class="custom-test" />
</field.Custom>
</form.Field>
</Form>
</template>);
assert.dom(".form-kit__container-title").hasText("Foo (optional)");
assert.dom(".form-kit__container-subtitle").hasText("Bar");
});
}
);

2
app/assets/stylesheets/common/form-kit/_container.scss
View File

@ -13,7 +13,6 @@
color: var(--primary-high); color: var(--primary-high);
font-weight: bold; font-weight: bold;
padding-bottom: 0.25em; padding-bottom: 0.25em;
width: max-content;
} }
&-subtitle { &-subtitle {
@ -24,7 +23,6 @@
font-size: var(--font-down-1-rem); font-size: var(--font-down-1-rem);
color: var(--primary-high); color: var(--primary-high);
padding-bottom: 0.25em; padding-bottom: 0.25em;
width: max-content;
} }
&-optional { &-optional {

12
app/assets/stylesheets/common/form-kit/_control-custom.scss Normal file
View File

@ -0,0 +1,12 @@
.form-kit__field-custom {
width: auto !important;
min-width: var(--form-kit-small-input);
.form-kit__control-custom {
width: 100%;
}
.form-kit__control-custom > * {
width: 100% !important;
}
}

1
app/assets/stylesheets/common/form-kit/_index.scss
View File

@ -17,6 +17,7 @@
@import "_control-radio"; @import "_control-radio";
@import "_control-radio-group"; @import "_control-radio-group";
@import "_control-select"; @import "_control-select";
@import "_control-custom";
@import "_control-textarea"; @import "_control-textarea";
@import "_errors"; @import "_errors";
@import "_errors-summary"; @import "_errors-summary";

7
config/locales/client.en.yml
View File

@ -5494,6 +5494,7 @@ en:
header: "About your site" header: "About your site"
general_settings: "General settings" general_settings: "General settings"
community_name: "Community name" community_name: "Community name"
community_name_placeholder: "Example Community"
community_summary: "Community summary" community_summary: "Community summary"
community_description: "Community description" community_description: "Community description"
banner_image: "Banner image" banner_image: "Banner image"
@ -5501,12 +5502,15 @@ en:
This will be used on your About page. Recommended size: 800x300px. Accepted types: JPG, PNG, and SVG up to 10MB. This will be used on your About page. Recommended size: 800x300px. Accepted types: JPG, PNG, and SVG up to 10MB.
contact_information: "Contact information" contact_information: "Contact information"
community_owner: "Community owner" community_owner: "Community owner"
community_owner_placeholder: "Johnny Smith"
community_owner_help: | community_owner_help: |
Name of key contact responsible for this site. Used for critical notifications, and also displayed on /about. Visible to anonymous users on public sites. Name of key contact responsible for this site. Used for critical notifications, and also displayed on /about. Visible to anonymous users on public sites.
contact_email: "Contact email" contact_email: "Contact email"
contact_email_placeholder: "contact@johnny-smith.com"
contact_email_help: | contact_email_help: |
Email address of key contact responsible for this site. Used for critical notifications, and also displayed on /about. Visible to anonymous users on public sites. Email address of key contact responsible for this site. Used for critical notifications, and also displayed on /about. Visible to anonymous users on public sites.
contact_url: "Contact URL" contact_url: "Contact URL"
contact_url_placeholder: "https://johnny-smith.com/contact"
contact_url_help: | contact_url_help: |
Contact URL for this site. When present, replaces contact email address on /about and visible to anonymous users on public sites. Contact URL for this site. When present, replaces contact email address on /about and visible to anonymous users on public sites.
site_contact_name: "Site contact name" site_contact_name: "Site contact name"
@ -5517,14 +5521,17 @@ en:
A valid name of a group that gets invited to all automatically sent private messages. A valid name of a group that gets invited to all automatically sent private messages.
your_organization: "Your organization" your_organization: "Your organization"
company_name: "Company name" company_name: "Company name"
company_name_placeholder: "Sample Company Inc."
company_name_help: | company_name_help: |
Name of your company or organization. Name of your company or organization.
company_name_warning: | company_name_warning: |
If left blank, no boilerplate Terms of Service or Privacy Notice will be provided. If left blank, no boilerplate Terms of Service or Privacy Notice will be provided.
governing_law: "Governing law" governing_law: "Governing law"
governing_law_placeholder: "State of New York"
governing_law_help: | governing_law_help: |
Specify the jurisdiction that governs the legal aspects of the site, including Terms of Service and Privacy Notice. This is typically the country or state where the company operating the site is registered or conducts business. Specify the jurisdiction that governs the legal aspects of the site, including Terms of Service and Privacy Notice. This is typically the country or state where the company operating the site is registered or conducts business.
city_for_disputes: "City for disputes" city_for_disputes: "City for disputes"
city_for_disputes_placeholder: "New York City"
city_for_disputes_help: | city_for_disputes_help: |
Specify the city that will be used as the jurisdiction for resolving any disputes related to the use of this forum. This information is typically included in legal documents such as the forum's Terms of Service. Specify the city that will be used as the jurisdiction for resolving any disputes related to the use of this forum. This information is typically included in legal documents such as the forum's Terms of Service.
optional: "(optional)" optional: "(optional)"

27
spec/system/admin_about_config_area_spec.rb
View File

@ -71,17 +71,18 @@ describe "Admin About Config Area Page", type: :system do
config_area.visit config_area.visit
image_file = file_from_fixtures("logo.png", "images") image_file = file_from_fixtures("logo.png", "images")
config_area.general_settings_section.community_name_input.fill_in(with: "my community name") config_area.general_settings_section.community_name_input.fill_in("my community name")
config_area.general_settings_section.community_summary_input.fill_in( config_area.general_settings_section.community_summary_input.fill_in(
with: "here's a bit of a summary", "here's a bit of a summary",
) )
config_area.general_settings_section.community_description_editor.fill_in( config_area.general_settings_section.community_description_editor.fill_in(
with: "here's an extended description for the **community**", "here's an extended description for the **community**",
) )
config_area.general_settings_section.banner_image_uploader.select_image(image_file.path) config_area.general_settings_section.banner_image_uploader.select_image(image_file.path)
expect(config_area.general_settings_section.banner_image_uploader).to have_uploaded_image expect(config_area.general_settings_section.banner_image_uploader).to have_uploaded_image
config_area.general_settings_section.save_button.click config_area.general_settings_section.submit
expect(config_area.general_settings_section).to have_saved_successfully expect(config_area.general_settings_section).to have_saved_successfully
expect(SiteSetting.title).to eq("my community name") expect(SiteSetting.title).to eq("my community name")
@ -100,12 +101,10 @@ describe "Admin About Config Area Page", type: :system do
it "can saves its fields to their corresponding site settings" do it "can saves its fields to their corresponding site settings" do
config_area.visit config_area.visit
config_area.contact_information_section.community_owner_input.fill_in(with: "awesome owner") config_area.contact_information_section.community_owner_input.fill_in("awesome owner")
config_area.contact_information_section.contact_email_input.fill_in( config_area.contact_information_section.contact_email_input.fill_in("owneremail@owner.com")
with: "owneremail@owner.com",
)
config_area.contact_information_section.contact_url_input.fill_in( config_area.contact_information_section.contact_url_input.fill_in(
with: "https://website.owner.com/blah", "https://website.owner.com/blah",
) )
user_select_kit = config_area.contact_information_section.site_contact_user_selector user_select_kit = config_area.contact_information_section.site_contact_user_selector
@ -121,7 +120,7 @@ describe "Admin About Config Area Page", type: :system do
group_select_kit.select_row_by_value(group.id) group_select_kit.select_row_by_value(group.id)
group_select_kit.collapse group_select_kit.collapse
config_area.contact_information_section.save_button.click config_area.contact_information_section.submit
expect(config_area.contact_information_section).to have_saved_successfully expect(config_area.contact_information_section).to have_saved_successfully
expect(SiteSetting.community_owner).to eq("awesome owner") expect(SiteSetting.community_owner).to eq("awesome owner")
@ -136,11 +135,11 @@ describe "Admin About Config Area Page", type: :system do
it "can saves its fields to their corresponding site settings" do it "can saves its fields to their corresponding site settings" do
config_area.visit config_area.visit
config_area.your_organization_section.company_name_input.fill_in(with: "lil' company") config_area.your_organization_section.company_name_input.fill_in("lil' company")
config_area.your_organization_section.governing_law_input.fill_in(with: "wild west law") config_area.your_organization_section.governing_law_input.fill_in("wild west law")
config_area.your_organization_section.city_for_disputes_input.fill_in(with: "teeb el shouq") config_area.your_organization_section.city_for_disputes_input.fill_in("teeb el shouq")
config_area.your_organization_section.save_button.click config_area.your_organization_section.submit
expect(config_area.your_organization_section).to have_saved_successfully expect(config_area.your_organization_section).to have_saved_successfully
expect(SiteSetting.company_name).to eq("lil' company") expect(SiteSetting.company_name).to eq("lil' company")

20
spec/system/page_objects/components/admin_about_config_area_contact_information_card.rb
View File

@ -4,31 +4,31 @@ module PageObjects
module Components module Components
class AdminAboutConfigAreaContactInformationCard < PageObjects::Components::Base class AdminAboutConfigAreaContactInformationCard < PageObjects::Components::Base
def community_owner_input def community_owner_input
card.find(".community-owner-input input") form.field("communityOwner")
end end
def contact_email_input def contact_email_input
card.find(".contact-email-input input") form.field("contactEmail")
end end
def contact_url_input def contact_url_input
card.find(".contact-url-input input") form.field("contactURL")
end end
def site_contact_user_selector def site_contact_user_selector
PageObjects::Components::SelectKit.new( PageObjects::Components::SelectKit.new(
".admin-config-area-about__contact-information-section .site-contact-username-input .user-chooser", ".admin-config-area-about__contact-information-section .user-chooser",
) )
end end
def site_contact_group_selector def site_contact_group_selector
PageObjects::Components::SelectKit.new( PageObjects::Components::SelectKit.new(
".admin-config-area-about__contact-information-section .site-contact-group-input .group-chooser", ".admin-config-area-about__contact-information-section .group-chooser",
) )
end end
def save_button def submit
card.find(".btn-primary.admin-config-area-card__btn-save") form.submit
end end
def has_saved_successfully? def has_saved_successfully?
@ -37,8 +37,10 @@ module PageObjects
) )
end end
def card def form
find(".admin-config-area-about__contact-information-section") PageObjects::Components::FormKit.new(
".admin-config-area-about__contact-information-section .form-kit",
)
end end
end end
end end

16
spec/system/page_objects/components/admin_about_config_area_general_settings_card.rb
View File

@ -4,23 +4,23 @@ module PageObjects
module Components module Components
class AdminAboutConfigAreaGeneralSettingsCard < PageObjects::Components::Base class AdminAboutConfigAreaGeneralSettingsCard < PageObjects::Components::Base
def community_name_input def community_name_input
card.find(".community-name-input input") form.field("name")
end end
def community_summary_input def community_summary_input
card.find(".community-summary-input input") form.field("summary")
end end
def community_description_editor def community_description_editor
card.find(".community-description-input .d-editor-input") form.field("extendedDescription")
end end
def banner_image_uploader def banner_image_uploader
PageObjects::Components::UppyImageUploader.new(card.find(".image-uploader")) PageObjects::Components::UppyImageUploader.new(card.find(".image-uploader"))
end end
def save_button def submit
card.find(".btn-primary.admin-config-area-card__btn-save") form.submit
end end
def has_saved_successfully? def has_saved_successfully?
@ -32,6 +32,12 @@ module PageObjects
def card def card
find(".admin-config-area-about__general-settings-section") find(".admin-config-area-about__general-settings-section")
end end
def form
PageObjects::Components::FormKit.new(
".admin-config-area-about__general-settings-section .form-kit",
)
end
end end
end end
end end

16
spec/system/page_objects/components/admin_about_config_area_your_organization_card.rb
View File

@ -4,19 +4,19 @@ module PageObjects
module Components module Components
class AdminAboutConfigAreaYourOrganizationCard < PageObjects::Components::Base class AdminAboutConfigAreaYourOrganizationCard < PageObjects::Components::Base
def company_name_input def company_name_input
card.find(".company-name-input input") form.field("companyName")
end end
def governing_law_input def governing_law_input
card.find(".governing-law-input input") form.field("governingLaw")
end end
def city_for_disputes_input def city_for_disputes_input
card.find(".city-for-disputes-input input") form.field("cityForDisputes")
end end
def save_button def submit
card.find(".btn-primary.admin-config-area-card__btn-save") form.submit
end end
def has_saved_successfully? def has_saved_successfully?
@ -25,8 +25,10 @@ module PageObjects
) )
end end
def card def form
find(".admin-config-area-about__your-organization-section") PageObjects::Components::FormKit.new(
".admin-config-area-about__your-organization-section .form-kit",
)
end end
end end
end end

2
spec/system/page_objects/components/form_kit.rb
View File

@ -26,6 +26,8 @@ module PageObjects
component.find(".fk-d-menu__trigger")["data-value"] component.find(".fk-d-menu__trigger")["data-value"]
when "select" when "select"
component.find("select").value component.find("select").value
when "composer"
component.find("textarea").value
end end
end end