mystiq/hydrogen-web
Archived
4
1
Fork 1
Code Issues Pull requests Packages Projects Releases Wiki Activity

show quick reactions in message menu

Browse source
This commit is contained in:
Bruno Windels 2021-06-17 16:46:06 +02:00
parent 4312610e7d
commit 64f1abdfed
2 changed files with 29 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/platform/web/ui/css/themes/element/theme.css
View file

@ -660,6 +660,16 @@ button.link {
margin: 0;
}
.menu .quick-reactions {
display: flex;
padding: 8px 32px 8px 8px;
}
.menu .quick-reactions button {
padding: 2px 4px;
text-align: center;
}
.menu button {
border-radius: 4px;
display: block;

21
src/platform/web/ui/session/room/timeline/BaseMessageView.js
View file

@ -111,8 +111,7 @@ export class BaseMessageView extends TemplateView {
createMenuOptions(vm) {
const options = [];
if (vm.canReact) {
options.push(Menu.option(vm.i18n`React with 👍`, () => vm.react("👍")))
options.push(Menu.option(vm.i18n`React with 🙈`, () => vm.react("🙈")))
options.push(new QuickReactionsMenuOption(vm));
}
if (vm.canAbortSending) {
options.push(Menu.option(vm.i18n`Cancel`, () => vm.abortSending()));
@ -124,3 +123,21 @@ export class BaseMessageView extends TemplateView {
renderMessageBody() {}
}
class QuickReactionsMenuOption {
constructor(vm) {
this._vm = vm;
}
toDOM(t) {
const emojiButtons = ["👍", "👎", "😄", "🎉", "😕", "❤️", "🚀", "👀"].map(emoji => {
return t.button({onClick: () => this._vm.react(emoji)}, emoji);
});
const customButton = t.button({onClick: () => {
const key = prompt("Enter your reaction (emoji)");
if (key) {
this._vm.react(key);
}
}}, "…");
return t.li({className: "quick-reactions"}, [...emojiButtons, customButton]);
}
}