github-mirror/discourse
2
0
Fork 0
mirror of https://github.com/discourse/discourse.git synced 2024-11-22 11:15:05 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

DEV: Add support for condition option when adding toolbar buttons (#24370)

Browse Source
This commit is contained in:
Mark VanLandingham 2023-11-14 15:40:34 -06:00 committed by GitHub
parent d589c4c47f
commit 00f7e58da4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 52 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
app/assets/javascripts/discourse/app/components/d-editor.hbs
View File

@ -27,27 +27,29 @@
<div class="d-editor-button-bar" role="toolbar">
{{#each this.toolbar.groups as |group|}}
{{#each group.buttons as |b|}}
{{#if b.popupMenu}}
<ToolbarPopupMenuOptions
@content={{this.popupMenuOptions}}
@onChange={{this.onPopupMenuAction}}
@onOpen={{action b.action b}}
@class={{b.className}}
@tabindex={{-1}}
@onKeydown={{this.rovingButtonBar}}
@options={{hash icon=b.icon focusAfterOnChange=false}}
/>
{{else}}
<DButton
@action={{fn (action b.action) b}}
@translatedTitle={{b.title}}
@label={{b.label}}
@icon={{b.icon}}
@preventFocus={{b.preventFocus}}
@onKeyDown={{this.rovingButtonBar}}
tabindex={{b.tabindex}}
class={{b.className}}
/>
{{#if (b.condition this)}}
{{#if b.popupMenu}}
<ToolbarPopupMenuOptions
@content={{this.popupMenuOptions}}
@onChange={{this.onPopupMenuAction}}
@onOpen={{action b.action b}}
@class={{b.className}}
@tabindex={{-1}}
@onKeydown={{this.rovingButtonBar}}
@options={{hash icon=b.icon focusAfterOnChange=false}}
/>
{{else}}
<DButton
@action={{fn (action b.action) b}}
@translatedTitle={{b.title}}
@label={{b.label}}
@icon={{b.icon}}
@preventFocus={{b.preventFocus}}
@onKeyDown={{this.rovingButtonBar}}
tabindex={{b.tabindex}}
class={{b.className}}
/>
{{/if}}
{{/if}}
{{/each}}
{{/each}}

3
app/assets/javascripts/discourse/app/components/d-editor.js
View File

@ -170,12 +170,13 @@ class Toolbar {
tabindex: button.tabindex || "-1",
className: button.className || button.id,
label: button.label,
icon: button.label ? null : button.icon || button.id,
icon: button.icon || button.id,
action: button.action || ((a) => this.context.send("toolbarButton", a)),
perform: button.perform || function () {},
trimLeading: button.trimLeading,
popupMenu: button.popupMenu || false,
preventFocus: button.preventFocus || false,
condition: button.condition || (() => true),
};
if (button.sendAction) {

27
app/assets/javascripts/discourse/tests/integration/components/d-editor-test.js
View File

@ -695,6 +695,33 @@ third line`
);
});
test("Toolbar buttons are only rendered when condition is met", async function (assert) {
withPluginApi("0.1", (api) => {
api.onToolbarCreate((toolbar) => {
toolbar.addButton({
id: "shown",
group: "extras",
icon: "far-smile",
action: () => {},
condition: () => true,
});
toolbar.addButton({
id: "not-shown",
group: "extras",
icon: "far-frown",
action: () => {},
condition: () => false,
});
});
});
await render(hbs`<DEditor/>`);
assert.ok(exists(".d-editor-button-bar button.shown"));
assert.notOk(exists(".d-editor-button-bar button.not-shown"));
});
test("toolbar buttons tabindex", async function (assert) {
await render(hbs`<DEditor />`);
const buttons = queryAll(".d-editor-button-bar .btn");