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

DEV: Minor refactor of d-menu/d-tooltip (#26942) 

* `menuInstance` cached getter -> prop
* `next()` and a `trigger` check -> gone
* `allowedProperties` action -> getter
* `keys` -> `entries`
* update the `service` import
* flatten the object spread structures
This commit is contained in:
Jarek Radosz 2024-05-09 10:54:37 +02:00 committed by GitHub
parent 4404b6808c
commit 20e049bcbc
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 25 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
app/assets/javascripts/float-kit/addon/components/d-menu.gjs
View File

@ -1,10 +1,7 @@
import Component from "@glimmer/component";
import { cached } from "@glimmer/tracking";
import { getOwner } from "@ember/application";
import { concat } from "@ember/helper";
import { action } from "@ember/object";
import { next } from "@ember/runloop";
import { inject as service } from "@ember/service";
import { service } from "@ember/service";
import { modifier } from "ember-modifier";
import { and } from "truth-helpers";
import DButton from "discourse/components/d-button";
@ -19,25 +16,16 @@ export default class DMenu extends Component {
@service menu;
@service site;
registerTrigger = modifier((element) => {
if (!this.menuInstance.trigger) {
next(() => {
this.menuInstance.trigger = element;
this.options.onRegisterApi?.(this.menuInstance);
});
}
menuInstance = new DMenuInstance(getOwner(this), {
...this.allowedProperties,
autoUpdate: true,
listeners: true,
});
@cached
get menuInstance() {
return new DMenuInstance(getOwner(this), {
...this.allowedProperties(),
...{
autoUpdate: true,
listeners: true,
},
});
}
registerTrigger = modifier((element) => {
this.menuInstance.trigger = element;
this.options.onRegisterApi?.(this.menuInstance);
});
get menuId() {
return `d-menu-${this.menuInstance.id}`;
@ -54,18 +42,17 @@ export default class DMenu extends Component {
};
}
@action
allowedProperties() {
get allowedProperties() {
const properties = {};
Object.keys(MENU.options).forEach((key) => {
const value = MENU.options[key];
for (const [key, value] of Object.entries(MENU.options)) {
properties[key] = this.args[key] ?? value;
});
}
return properties;
}
<template>
<DButton
{{this.registerTrigger}}
class={{concatClass
"fk-d-menu__trigger"
(if this.menuInstance.expanded "-expanded")
@ -81,7 +68,6 @@ export default class DMenu extends Component {
@translatedTitle={{@title}}
@disabled={{@disabled}}
aria-expanded={{if this.menuInstance.expanded "true" "false"}}
{{this.registerTrigger}}
...attributes
>
{{#if (has-block "trigger")}}

35
app/assets/javascripts/float-kit/addon/components/d-tooltip.gjs
View File

@ -1,9 +1,6 @@
import Component from "@glimmer/component";
import { cached } from "@glimmer/tracking";
import { getOwner } from "@ember/application";
import { concat } from "@ember/helper";
import { action } from "@ember/object";
import { next } from "@ember/runloop";
import { service } from "@ember/service";
import { modifier } from "ember-modifier";
import { and } from "truth-helpers";
@ -17,22 +14,16 @@ export default class DTooltip extends Component {
@service tooltip;
@service internalTooltip;
registerTrigger = modifier((element) => {
if (!this.tooltipInstance?.trigger) {
next(() => {
this.tooltipInstance.trigger = element;
this.options.onRegisterApi?.(this.tooltipInstance);
});
}
tooltipInstance = new DTooltipInstance(getOwner(this), {
...this.allowedProperties,
autoUpdate: true,
listeners: true,
});
@cached
get tooltipInstance() {
return new DTooltipInstance(getOwner(this), {
...this.allowedProperties(),
...{ autoUpdate: true, listeners: true },
});
}
registerTrigger = modifier((element) => {
this.tooltipInstance.trigger = element;
this.options.onRegisterApi?.(this.tooltipInstance);
});
get options() {
return this.tooltipInstance?.options;
@ -45,18 +36,17 @@ export default class DTooltip extends Component {
};
}
@action
allowedProperties() {
get allowedProperties() {
const properties = {};
Object.keys(TOOLTIP.options).forEach((key) => {
const value = TOOLTIP.options[key];
for (const [key, value] of Object.entries(TOOLTIP.options)) {
properties[key] = this.args[key] ?? value;
});
}
return properties;
}
<template>
<span
{{this.registerTrigger this.allowedProperties}}
class={{concatClass
"fk-d-tooltip__trigger"
(if this.tooltipInstance.expanded "-expanded")
@ -66,7 +56,6 @@ export default class DTooltip extends Component {
data-identifier={{this.options.identifier}}
data-trigger
aria-expanded={{if this.tooltipInstance.expanded "true" "false"}}
{{this.registerTrigger (this.allowedProperties)}}
...attributes
>
<span class="fk-d-tooltip__trigger-container">