Skip to content
This repository has been archived by the owner on Sep 11, 2024. It is now read-only.

Add message right click context menu v2 #5672

Merged
merged 127 commits into from
Apr 15, 2022
Merged
Changes from 2 commits
Commits
Show all changes
127 commits
Select commit Hold shift + click to select a range
5e6793d
migrate the message context menu to IconizedContextMenu
weeman1337 Feb 21, 2021
c2b31d1
migrate the message context menu to IconizedContextMenu
weeman1337 Feb 21, 2021
170b303
Merge remote-tracking branch 'weeman1337/msg-context-menu' into right…
SimonBrandner Feb 21, 2021
ee2d800
Added right-click menu
SimonBrandner Feb 21, 2021
e548dda
add message context menu group keys
weeman1337 Feb 21, 2021
20ffbcd
Merge remote-tracking branch 'weeman1337/msg-context-menu' into right…
SimonBrandner Feb 22, 2021
b1bc966
add message context menu icons
weeman1337 Feb 23, 2021
53a8367
add _MessageContextMenu.scss license header
weeman1337 Feb 23, 2021
531d2d6
Merge remote-tracking branch 'weeman1337/msg-context-menu' into right…
SimonBrandner Feb 23, 2021
b0a3285
use null vars for context menu lists
weeman1337 Jun 24, 2021
2c89e0e
Merge remote-tracking branch 'weeman1337/msg-context-menu' into right…
SimonBrandner Jun 25, 2021
dcd938c
Add allowOverridingNativeContextMenus()
SimonBrandner Jun 25, 2021
8cbf690
Use allowOverridingNativeContextMenus()
SimonBrandner Jun 25, 2021
5bbe6ce
Fix types
SimonBrandner Jun 25, 2021
c1f7ff4
Fix types
SimonBrandner Jun 25, 2021
b55e5e0
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Jun 29, 2021
16447d6
Remove mistaken line
SimonBrandner Jun 29, 2021
9487a72
Fix styling
SimonBrandner Jun 29, 2021
5ff1879
InputHTMLAttributes -> AllHTMLAttributes
SimonBrandner Jun 30, 2021
9803385
Convert to TS
SimonBrandner Jun 30, 2021
9bb65e7
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Jun 30, 2021
41214d0
Add some types
SimonBrandner Jun 30, 2021
a309219
Make onClick optional
SimonBrandner Jun 30, 2021
2d74575
Add rightClick prop
SimonBrandner Jun 30, 2021
d64b4f9
Add copy button
SimonBrandner Jun 30, 2021
ef61c53
What about upgrading deps after the eslint migration, Simon?
SimonBrandner Jun 30, 2021
f2bb287
Add edit button
SimonBrandner Jun 30, 2021
76942c6
fix
SimonBrandner Jun 30, 2021
946e718
Add reply button
SimonBrandner Jun 30, 2021
97e65af
Add react button
SimonBrandner Jun 30, 2021
ee30d2c
Cleanup render()
SimonBrandner Jun 30, 2021
9161c61
Fix comments
SimonBrandner Jun 30, 2021
9390e15
Add save button
SimonBrandner Jul 1, 2021
09f0692
Don't show context menu if editing
SimonBrandner Jul 1, 2021
757957e
Add special handling for click a timestamp
SimonBrandner Jul 1, 2021
cb00f02
Fix double empty line
SimonBrandner Jul 1, 2021
8c15721
Don't show context menu for images
SimonBrandner Jul 1, 2021
6754bda
Cleanup
SimonBrandner Jul 1, 2021
57a17dc
Fix order
SimonBrandner Jul 1, 2021
51e2102
Keep action bar shown when right-clicking
SimonBrandner Jul 2, 2021
42a7428
Highlight event tile when right-clicking
SimonBrandner Jul 2, 2021
1886c6e
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Jul 9, 2021
453c3ea
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Jul 20, 2021
e442926
Delint
SimonBrandner Jul 20, 2021
8d2ddee
Pointless change so that I can re-run the CI
SimonBrandner Jul 20, 2021
b59ac50
Remove dowload button
SimonBrandner Aug 1, 2021
ba7fcea
Be more clear for non-bools
SimonBrandner Aug 1, 2021
ca805a1
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Aug 1, 2021
cbb67d3
Use triggerOnMouse down prop
SimonBrandner Aug 1, 2021
9db902c
Remove a comment
SimonBrandner Aug 1, 2021
1567831
Remove unused var
SimonBrandner Aug 1, 2021
a86484e
Remove unnecessary import
SimonBrandner Aug 1, 2021
f4ee7e5
Add some missing types
SimonBrandner Aug 1, 2021
03422ba
Add missing type
SimonBrandner Aug 1, 2021
3baa634
Remove unused import
SimonBrandner Aug 1, 2021
50b84b9
Add a missing type
SimonBrandner Aug 1, 2021
41fdc21
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Oct 17, 2021
b594e68
Fix types
SimonBrandner Oct 17, 2021
b628b92
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Oct 18, 2021
13aa030
Fix types/naming
SimonBrandner Oct 18, 2021
bbf4cab
Add missing current
SimonBrandner Oct 18, 2021
fd0848d
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Oct 19, 2021
8cbd011
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Oct 22, 2021
8a3c02d
Remove unused var
SimonBrandner Oct 22, 2021
cf350e4
Fix editing and replying
SimonBrandner Oct 22, 2021
f9efb18
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Oct 29, 2021
1b8557f
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Nov 8, 2021
fdc8f8d
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Nov 26, 2021
fbed313
i18n
SimonBrandner Nov 26, 2021
6963fa9
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Nov 29, 2021
a732ab4
Fix import
SimonBrandner Nov 29, 2021
9034492
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Dec 8, 2021
6789631
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Dec 10, 2021
7e36789
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Dec 10, 2021
7af88d2
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Dec 11, 2021
962c0e5
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Dec 16, 2021
a3d038f
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Dec 22, 2021
41ba8c8
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Jan 11, 2022
05da462
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Jan 12, 2022
7c3691a
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Jan 12, 2022
6dc688c
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Jan 23, 2022
51b8072
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Jan 24, 2022
d623568
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Jan 31, 2022
c029ba1
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Feb 4, 2022
3faf382
Support right-click context menu for threads
SimonBrandner Feb 4, 2022
506ad6b
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Feb 8, 2022
cfe5369
Make button order match `MessageActionBar`
SimonBrandner Feb 8, 2022
7eb9cc8
Fix missing permalink button
SimonBrandner Feb 8, 2022
3bfe1a7
Remove useless part of if statement
SimonBrandner Feb 8, 2022
c40aabc
Some small refactoring for consistency
SimonBrandner Feb 9, 2022
2ce9448
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Feb 9, 2022
f4eeb7d
Some more refactoring
SimonBrandner Feb 9, 2022
ff843ad
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Feb 13, 2022
13c3c5f
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Feb 14, 2022
f2861ad
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Feb 15, 2022
a27614e
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Feb 16, 2022
8c54e2b
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Feb 17, 2022
0a0070f
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Feb 18, 2022
9a6d22d
Fix `editEvent()` call
SimonBrandner Feb 18, 2022
0521653
Make editing polls work
SimonBrandner Feb 18, 2022
b72cf2d
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Feb 18, 2022
470df0f
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Feb 23, 2022
a1a08de
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Feb 25, 2022
815d3f6
Fix collapse reply chain button
SimonBrandner Feb 25, 2022
25701e7
Fix timelineRenderingType
SimonBrandner Feb 25, 2022
7a2b71a
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Mar 5, 2022
70147d9
Fix reply button
SimonBrandner Mar 5, 2022
32bdd75
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Mar 19, 2022
18d4153
Hide right-click context menu behind a labs flag
SimonBrandner Mar 19, 2022
d0b2c69
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Mar 21, 2022
9b97ab7
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Mar 29, 2022
a789da0
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Mar 30, 2022
fd6f973
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Mar 30, 2022
3545074
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Apr 4, 2022
020c47b
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Apr 5, 2022
7525a05
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Apr 5, 2022
2452ab5
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Apr 6, 2022
01a3a17
Add missing return type
SimonBrandner Apr 9, 2022
c5b535f
Make `contextMene` optional
SimonBrandner Apr 9, 2022
9057669
Move `renderContextMenu()`
SimonBrandner Apr 9, 2022
144677c
Simplify `renderContextMenu()`
SimonBrandner Apr 9, 2022
cd44684
Improve `aboveLeftOf` typing
SimonBrandner Apr 9, 2022
4f0b848
Use `InputHTMLAttributes`
SimonBrandner Apr 9, 2022
6a42262
Disable message right-click context menu in browser (for now)
SimonBrandner Apr 9, 2022
7947387
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Apr 9, 2022
91057a3
Give permalink button more props
SimonBrandner Apr 15, 2022
ea4db4b
Merge remote-tracking branch 'upstream/develop' into right-click
SimonBrandner Apr 15, 2022
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 9 additions & 12 deletions res/css/views/context_menus/_MessageContextMenu.scss
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2021 Michael Weimann <[email protected]>

Licensed under the Apache License, Version 2.0 (the "License");
@@ -38,43 +39,39 @@ limitations under the License.
}

.mx_MessageContextMenu_iconReport::before {
mask-image: url('$(res)/img/feather-customised/warning-triangle.svg');
mask-image: url('$(res)/img/element-icons/warning-badge.svg');
}

.mx_MessageContextMenu_iconLink::before {
mask-image: url('$(res)/img/element-icons/message/link.svg');
mask-image: url('$(res)/img/element-icons/link.svg');
}

.mx_MessageContextMenu_iconPermalink::before {
mask-image: url('$(res)/img/element-icons/message/share.svg');
mask-image: url('$(res)/img/element-icons/room/share.svg');
}

.mx_MessageContextMenu_iconUnhidePreview::before {
mask-image: url('$(res)/img/feather-customised/eye.svg');
mask-image: url('$(res)/img/element-icons/settings/appearance.svg');
}

.mx_MessageContextMenu_iconForward::before {
mask-image: url('$(res)/img/element-icons/message/corner-up-right.svg');
}

.mx_MessageContextMenu_iconCancel::before {
mask-image: url('$(res)/img/cancel.svg');
mask-image: url('$(res)/img/element-icons/message/fwd.svg');
}

.mx_MessageContextMenu_iconRedact::before {
mask-image: url('$(res)/img/feather-customised/trash.custom.svg');
mask-image: url('$(res)/img/element-icons/trashcan.svg');
}

.mx_MessageContextMenu_iconResend::before {
mask-image: url('$(res)/img/element-icons/message/repeat.svg');
mask-image: url('$(res)/img/element-icons/retry.svg');
}

.mx_MessageContextMenu_iconSource::before {
mask-image: url('$(res)/img/element-icons/room/format-bar/code.svg');
}

.mx_MessageContextMenu_iconQuote::before {
mask-image: url('$(res)/img/format/quote.svg');
mask-image: url('$(res)/img/element-icons/room/format-bar/quote.svg');
}

.mx_MessageContextMenu_iconPin::before {
162 changes: 40 additions & 122 deletions src/components/views/context_menus/MessageContextMenu.js
Original file line number Diff line number Diff line change
@@ -22,14 +22,18 @@ import { EventStatus } from 'matrix-js-sdk/src/models/event';
import { MatrixClientPeg } from '../../../MatrixClientPeg';
import dis from '../../../dispatcher/dispatcher';
import * as sdk from '../../../index';
import {_t} from '../../../languageHandler';
import { _t } from '../../../languageHandler';
import Modal from '../../../Modal';
import Resend from '../../../Resend';
import SettingsStore from '../../../settings/SettingsStore';
import {isUrlPermitted} from '../../../HtmlUtils';
import {isContentActionable} from '../../../utils/EventUtils';
import {EventType} from "matrix-js-sdk/src/@types/event";
import IconizedContextMenu, {IconizedContextMenuOption, IconizedContextMenuOptionList} from "./IconizedContextMenu";
import { isUrlPermitted } from '../../../HtmlUtils';
import { isContentActionable } from '../../../utils/EventUtils';
import IconizedContextMenu, { IconizedContextMenuOption, IconizedContextMenuOptionList } from './IconizedContextMenu';
import { EventType } from "matrix-js-sdk/src/@types/event";
import { replaceableComponent } from "../../../utils/replaceableComponent";
import { ReadPinsEventId } from "../right_panel/PinnedMessagesCard";
import ForwardDialog from "../dialogs/ForwardDialog";
import { Action } from "../../../dispatcher/actions";

export function canCancel(eventStatus) {
return eventStatus === EventStatus.QUEUED || eventStatus === EventStatus.NOT_SENT;
@@ -253,31 +257,11 @@ export default class MessageContextMenu extends React.Component {
let externalURLButton;
let quoteButton;
let collapseReplyThread;
const optionLists = [];
let redactItemList;

// status is SENT before remote-echo, null after
const isSent = !eventStatus || eventStatus === EventStatus.SENT;
if (!mxEvent.isRedacted()) {
if (eventStatus === EventStatus.NOT_SENT) {
resendButton = (
<IconizedContextMenuOption
iconClassName="mx_MessageContextMenu_iconResend"
label={_t("Resend")}
onClick={this.onResendClick}
/>
);
}

if (editStatus === EventStatus.NOT_SENT) {
resendEditButton = (
<IconizedContextMenuOption
iconClassName="mx_MessageContextMenu_iconResend"
label={_t("Resend edit")}
onClick={this.onResendEditClick}
/>
);
}

if (unsentReactionsCount !== 0) {
resendReactionsButton = (
<IconizedContextMenuOption
@@ -289,16 +273,6 @@ export default class MessageContextMenu extends React.Component {
}
}

if (redactStatus === EventStatus.NOT_SENT) {
resendRedactionButton = (
<IconizedContextMenuOption
iconClassName="mx_MessageContextMenu_iconResend"
label={_t("Resend removal")}
onClick={this.onResendRedactionClick}
/>
);
}

if (isSent && this.state.canRedact) {
redactButton = (
<IconizedContextMenuOption
@@ -309,21 +283,11 @@ export default class MessageContextMenu extends React.Component {
);
}

if (allowCancel) {
cancelButton = (
<IconizedContextMenuOption
iconClassName="mx_MessageContextMenu_iconCancel"
label={_t("Cancel Sending")}
onClick={this.onCancelSendClick}
/>
);
}

if (isContentActionable(mxEvent)) {
forwardButton = (
<IconizedContextMenuOption
iconClassName="mx_MessageContextMenu_iconForward"
label={_t("Forward Message")}
label={_t("Forward")}
onClick={this.onForwardClick}
/>
);
@@ -332,7 +296,7 @@ export default class MessageContextMenu extends React.Component {
pinButton = (
<IconizedContextMenuOption
iconClassName="mx_MessageContextMenu_iconPin"
label={ this._isPinned() ? _t('Unpin Message') : _t('Pin Message') }
label={ this._isPinned() ? _t('Unpin') : _t('Pin') }
onClick={this.onPinClick}
/>
);
@@ -342,27 +306,17 @@ export default class MessageContextMenu extends React.Component {
const viewSourceButton = (
<IconizedContextMenuOption
iconClassName="mx_MessageContextMenu_iconSource"
label={_t("View Source")}
label={_t("View source")}
onClick={this.onViewSourceClick}
/>
);

if (mxEvent.getType() !== mxEvent.getWireType()) {
viewClearSourceButton = (
<IconizedContextMenuOption
iconClassName="mx_MessageContextMenu_iconSource"
label={_t("View Decrypted Source")}
onClick={this.onViewClearSourceClick}
/>
);
}

if (this.props.eventTileOps) {
if (this.props.eventTileOps.isWidgetHidden()) {
unhidePreviewButton = (
<IconizedContextMenuOption
iconClassName="mx_MessageContextMenu_iconUnhidePreview"
label={_t("Unhide Preview")}
label={_t("Show preview")}
onClick={this.onUnhidePreviewClick}
/>
);
@@ -378,8 +332,7 @@ export default class MessageContextMenu extends React.Component {
<IconizedContextMenuOption
iconClassName="mx_MessageContextMenu_iconPermalink"
onClick={this.onPermalinkClick}
label= { mxEvent.isRedacted() || mxEvent.getType() !== 'm.room.message'
? _t('Share Permalink') : _t('Share Message') }
label= {_t('Share')}
element="a"
href={permalink}
target="_blank"
@@ -398,15 +351,14 @@ export default class MessageContextMenu extends React.Component {
}

// Bridges can provide a 'external_url' to link back to the source.
if (
typeof (mxEvent.event.content.external_url) === "string" &&
if (typeof (mxEvent.event.content.external_url) === "string" &&
isUrlPermitted(mxEvent.event.content.external_url)
) {
externalURLButton = (
<IconizedContextMenuOption
iconClassName="mx_MessageContextMenu_iconLink"
onClick={this.closeMenu}
label={_t('Source URL')}
label={ _t('Source URL') }
element="a"
target="_blank"
rel="noreferrer noopener"
@@ -419,7 +371,7 @@ export default class MessageContextMenu extends React.Component {
collapseReplyThread = (
<IconizedContextMenuOption
iconClassName="mx_MessageContextMenu_iconCollapse"
label={_t("Collapse Reply Thread")}
label={_t("Collapse reply thread")}
onClick={this.onCollapseReplyThreadClick}
/>
);
@@ -430,68 +382,33 @@ export default class MessageContextMenu extends React.Component {
reportEventButton = (
<IconizedContextMenuOption
iconClassName="mx_MessageContextMenu_iconReport"
label={_t("Report Content")}
label={_t("Report")}
onClick={this.onReportEventClick}
/>
);
}

if (viewSourceButton || viewClearSourceButton) {
optionLists.push((
<IconizedContextMenuOptionList key={'group1'}>
{viewSourceButton}
{viewClearSourceButton}
</IconizedContextMenuOptionList>
));
}

if (resendButton || resendEditButton || resendReactionsButton || resendRedactionButton) {
optionLists.push((
<IconizedContextMenuOptionList key={'group2'}>
{resendButton}
{resendEditButton}
{resendReactionsButton}
{resendRedactionButton}
</IconizedContextMenuOptionList>
));
}

if (redactButton || cancelButton) {
optionLists.push((
<IconizedContextMenuOptionList red key={'group3'}>
{redactButton}
{cancelButton}
</IconizedContextMenuOptionList>
));
}

if (externalURLButton || permalinkButton) {
optionLists.push((
<IconizedContextMenuOptionList key={'group4'}>
{externalURLButton}
{permalinkButton}
</IconizedContextMenuOptionList>
));
}

if (pinButton || unhidePreviewButton || reportEventButton) {
optionLists.push((
<IconizedContextMenuOptionList key={'group5'}>
{pinButton}
{unhidePreviewButton}
{reportEventButton}
</IconizedContextMenuOptionList>
));
}
const commonItemsList = (
<IconizedContextMenuOptionList key={'group1'}>
{ quoteButton }
{ forwardButton }
{ pinButton }
{ permalinkButton }
{ reportEventButton }
{ externalURLButton }
{ unhidePreviewButton }
{ viewSourceButton }
{ resendReactionsButton }
{ collapseReplyThread }
</IconizedContextMenuOptionList>
);

if (forwardButton || quoteButton || collapseReplyThread) {
optionLists.push((
<IconizedContextMenuOptionList key={'group6'}>
{forwardButton}
{collapseReplyThread}
{quoteButton}
if (redactButton) {
redactItemList = (
<IconizedContextMenuOptionList key={'group2'} red>
{ redactButton }
</IconizedContextMenuOptionList>
));
);
}

return (
@@ -500,7 +417,8 @@ export default class MessageContextMenu extends React.Component {
className="mx_MessageContextMenu"
compact={true}
>
{optionLists}
{ commonItemsList }
{ redactItemList }
</IconizedContextMenu>
);
}
Loading