This repository has been archived on 2023-03-18. You can view files and clone it, but cannot push or open issues or pull requests.
osr-discourse-src/plugins/chat/assets/javascripts/discourse/components/chat-message-actions-desktop.js
Martin Brennan 9704d9aed6
DEV: Glimmerize ChatMessageActionsDesktop/Mobile components (#20325)
These are fairly small components, so we can change to using
glimmer without too much trouble.
2023-02-16 11:24:29 +01:00

52 lines
1.3 KiB
JavaScript

import Component from "@glimmer/component";
import { action } from "@ember/object";
import { createPopper } from "@popperjs/core";
import { schedule } from "@ember/runloop";
import { inject as service } from "@ember/service";
const MSG_ACTIONS_VERTICAL_PADDING = -10;
export default class ChatMessageActionsDesktop extends Component {
@service chatStateManager;
popper = null;
@action
destroyPopper() {
this.popper?.destroy();
this.popper = null;
}
@action
attachPopper() {
this.destroyPopper();
schedule("afterRender", () => {
this.popper = createPopper(
document.querySelector(
`.chat-message-container[data-id="${this.args.message.id}"]`
),
document.querySelector(
`.chat-message-actions-container[data-id="${this.args.message.id}"] .chat-message-actions`
),
{
placement: "top-end",
modifiers: [
{ name: "hide", enabled: true },
{ name: "eventListeners", options: { scroll: false } },
{
name: "offset",
options: { offset: [-2, MSG_ACTIONS_VERTICAL_PADDING] },
},
],
}
);
});
}
@action
handleSecondaryButtons(id) {
this.args.messageActions?.[id]?.();
}
}