DEV: Add class name of action type for flag-action-type container (#23972)

This commit is contained in:
Mark VanLandingham 2023-10-18 10:18:52 -05:00 committed by GitHub
parent 31797ebc40
commit 585bb0df27
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 78 additions and 71 deletions

View File

@ -1,72 +1,74 @@
{{#if this.isNotifyUser}} <div class={{this.wrapperClassNames}}>
<h3>{{this.formattedName}}</h3> {{#if this.isNotifyUser}}
<div class="controls"> <h3>{{this.formattedName}}</h3>
<label class="radio"> <div class="controls">
<input <label class="radio">
id="radio_{{this.flag.name_key}}" <input
{{on "click" (action "changePostActionType" this.flag)}} id="radio_{{this.flag.name_key}}"
type="radio" {{on "click" (action "changePostActionType" this.flag)}}
name="post_action_type_index" type="radio"
/> name="post_action_type_index"
/>
<div class="flag-action-type-details"> <div class="flag-action-type-details">
<span class="description">{{html-safe this.flag.description}}</span> <span class="description">{{html-safe this.flag.description}}</span>
{{#if this.showMessageInput}} {{#if this.showMessageInput}}
<Textarea <Textarea
name="message" name="message"
class="flag-message" class="flag-message"
placeholder={{this.customPlaceholder}} placeholder={{this.customPlaceholder}}
aria-label={{i18n "flagging.notify_user_textarea_label"}} aria-label={{i18n "flagging.notify_user_textarea_label"}}
@value={{this.message}} @value={{this.message}}
/> />
<div <div
class={{concat-class class={{concat-class
"custom-message-length" "custom-message-length"
this.customMessageLengthClasses this.customMessageLengthClasses
}} }}
> >
{{this.customMessageLength}} {{this.customMessageLength}}
</div> </div>
{{/if}} {{/if}}
</div> </div>
</label> </label>
</div> </div>
{{#if this.staffFlagsAvailable}} {{#if this.staffFlagsAvailable}}
<hr /> <hr />
<h3>{{i18n "flagging.notify_staff"}}</h3> <h3>{{i18n "flagging.notify_staff"}}</h3>
{{/if}}
{{else}}
<div class="controls {{this.flag.name_key}}">
<label class="radio">
<input
id="radio_{{this.flag.name_key}}"
{{on "click" (action "changePostActionType" this.flag)}}
type="radio"
name="post_action_type_index"
/>
<div class="flag-action-type-details">
<strong>{{this.formattedName}}</strong>
{{#if this.showDescription}}
<div class="description">{{html-safe this.description}}</div>
{{/if}}
{{#if this.showMessageInput}}
<Textarea
name="message"
class="flag-message"
placeholder={{this.customPlaceholder}}
aria-label={{i18n "flagging.notify_moderators_textarea_label"}}
@value={{this.message}}
/>
<div
class={{concat-class
"custom-message-length"
this.customMessageLengthClasses
}}
>
{{this.customMessageLength}}
</div>
{{/if}}
</div>
</label>
</div>
{{/if}} {{/if}}
{{else}} </div>
<div class="controls {{this.flag.name_key}}">
<label class="radio">
<input
id="radio_{{this.flag.name_key}}"
{{on "click" (action "changePostActionType" this.flag)}}
type="radio"
name="post_action_type_index"
/>
<div class="flag-action-type-details">
<strong>{{this.formattedName}}</strong>
{{#if this.showDescription}}
<div class="description">{{html-safe this.description}}</div>
{{/if}}
{{#if this.showMessageInput}}
<Textarea
name="message"
class="flag-message"
placeholder={{this.customPlaceholder}}
aria-label={{i18n "flagging.notify_moderators_textarea_label"}}
@value={{this.message}}
/>
<div
class={{concat-class
"custom-message-length"
this.customMessageLengthClasses
}}
>
{{this.customMessageLength}}
</div>
{{/if}}
</div>
</label>
</div>
{{/if}}

View File

@ -5,7 +5,12 @@ import discourseComputed from "discourse-common/utils/decorators";
import I18n from "discourse-i18n"; import I18n from "discourse-i18n";
export default Component.extend({ export default Component.extend({
classNames: ["flag-action-type"], tagName: "",
@discourseComputed("flag.name_key")
wrapperClassNames(nameKey) {
return `flag-action-type ${nameKey}`;
},
@discourseComputed("flag.name_key") @discourseComputed("flag.name_key")
customPlaceholder(nameKey) { customPlaceholder(nameKey) {