mirror of
https://github.com/discourse/discourse.git
synced 2025-02-16 02:23:09 +08:00
3f24a5e9e2
- prevents menu to hide underlying text - prevents `chat-message-actions` to close when hovering dropdown of 3 dots button as mouse would hover an other message due to the small space between `chat-message-actions` menu and the dropdown of the 3 dots button <!-- NOTE: All pull requests should have tests (rspec in Ruby, qunit in JavaScript). If your code does not include test coverage, please include an explanation of why it was omitted. -->
58 lines
1.5 KiB
JavaScript
58 lines
1.5 KiB
JavaScript
import Component from "@ember/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_HORIZONTAL_PADDING = 2;
|
|
const MSG_ACTIONS_VERTICAL_PADDING = -28;
|
|
|
|
export default Component.extend({
|
|
tagName: "",
|
|
|
|
chatStateManager: service(),
|
|
|
|
messageActions: null,
|
|
|
|
didReceiveAttrs() {
|
|
this._super(...arguments);
|
|
|
|
this.popper?.destroy();
|
|
|
|
schedule("afterRender", () => {
|
|
this.popper = createPopper(
|
|
document.querySelector(
|
|
`.chat-message-container[data-id="${this.message.id}"]`
|
|
),
|
|
document.querySelector(
|
|
`.chat-message-actions-container[data-id="${this.message.id}"] .chat-message-actions`
|
|
),
|
|
{
|
|
placement: "right-start",
|
|
modifiers: [
|
|
{ name: "hide", enabled: true },
|
|
{
|
|
name: "offset",
|
|
options: {
|
|
offset: ({ popper, placement }) => {
|
|
return [
|
|
MSG_ACTIONS_VERTICAL_PADDING,
|
|
-(placement.includes("left") || placement.includes("right")
|
|
? popper.width + MSG_ACTIONS_HORIZONTAL_PADDING
|
|
: popper.height),
|
|
];
|
|
},
|
|
},
|
|
},
|
|
],
|
|
}
|
|
);
|
|
});
|
|
},
|
|
|
|
@action
|
|
handleSecondaryButtons(id) {
|
|
this.messageActions?.[id]?.();
|
|
},
|
|
});
|