discourse/app/assets/javascripts/admin/addon/components/admin-config-area-card.gjs
Ella E. 311c042700
Some checks are pending
Licenses / run (push) Waiting to run
Linting / run (push) Waiting to run
Tests / ${{ matrix.target }} ${{ matrix.build_type }} (backend, core) (push) Waiting to run
Tests / ${{ matrix.target }} ${{ matrix.build_type }} (backend, plugins) (push) Waiting to run
Tests / ${{ matrix.target }} ${{ matrix.build_type }} (frontend, plugins) (push) Waiting to run
Tests / ${{ matrix.target }} ${{ matrix.build_type }} (frontend, themes) (push) Waiting to run
Tests / ${{ matrix.target }} ${{ matrix.build_type }} (system, chat) (push) Waiting to run
Tests / ${{ matrix.target }} ${{ matrix.build_type }} (system, core) (push) Waiting to run
Tests / ${{ matrix.target }} ${{ matrix.build_type }} (system, plugins) (push) Waiting to run
Tests / ${{ matrix.target }} ${{ matrix.build_type }} (system, themes) (push) Waiting to run
Tests / ${{ matrix.target }} ${{ matrix.build_type }} (annotations, core) (push) Waiting to run
Tests / core frontend (${{ matrix.browser }}) (Chrome) (push) Waiting to run
Tests / core frontend (${{ matrix.browser }}) (Firefox ESR) (push) Waiting to run
Tests / core frontend (${{ matrix.browser }}) (Firefox Evergreen) (push) Waiting to run
UX: Add description config area card (#29418)
* DEV: add a description to the config area card component

* UX: update strings and placeholders for your org config area card
2024-10-28 09:39:51 -06:00

59 lines
1.6 KiB
Plaintext

import Component from "@glimmer/component";
import { tracked } from "@glimmer/tracking";
import I18n from "discourse-i18n";
export default class AdminConfigAreaCard extends Component {
@tracked collapsed = false;
get computedHeading() {
if (this.args.heading) {
return I18n.t(this.args.heading);
}
return this.args.translatedHeading;
}
get hasHeading() {
return this.args.heading || this.args.translatedHeading;
}
get computedDescription() {
if (this.args.description) {
return I18n.t(this.args.description);
}
return this.args.translatedDescription;
}
get hasDescription() {
return this.args.description || this.args.translatedDescription;
}
<template>
<section class="admin-config-area-card" ...attributes>
<div class="admin-config-area-card__header-wrapper">
{{#if this.hasHeading}}
<h3
class="admin-config-area-card__title"
>{{this.computedHeading}}</h3>
{{else}}
{{#if (has-block "header")}}
<h3 class="admin-config-area-card__title">{{yield to="header"}}</h3>
{{/if}}
{{/if}}
{{#if (has-block "headerAction")}}
<div class="admin-config-area-card__header-action">
{{yield to="headerAction"}}
</div>
{{/if}}
</div>
<div class="admin-config-area-card__content">
{{#if this.hasDescription}}
<p class="admin-config-area-card__description">
{{this.computedDescription}}
</p>
{{/if}}
{{yield to="content"}}
</div>
</section>
</template>
}