mirrors/signal-desktop
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 2 Wiki Activity Actions

Improve context menus

Browse source
This commit is contained in:
Josh Perez 2020-10-21 14:26:35 -04:00 • committed by Evan Hahn
parent fbf93374c1
commit de45db255c
6 changed files with 221 additions and 56 deletions
Download patch file Download diff file Expand all files Collapse all files

45
ts/components/conversation/ConversationHeader.tsx
View file

@ -350,6 +350,28 @@ export class ConversationHeader extends React.Component<PropsType> {
return (
<ContextMenu id={triggerId}>
<SubMenu title={muteTitle}>
{muteOptions.map(item => (
<MenuItem
key={item.name}
disabled={item.disabled}
onClick={() => {
onSetMuteNotifications(item.value);
}}
>
{item.name}
</MenuItem>
))}
</SubMenu>
{isPinned ? (
<MenuItem onClick={() => onSetPin(false)}>
{i18n('unpinConversation')}
</MenuItem>
) : (
<MenuItem onClick={() => onSetPin(true)}>
{i18n('pinConversation')}
</MenuItem>
)}
{disableTimerChanges ? null : (
<SubMenu title={disappearingTitle}>
{(timerOptions || []).map(item => (
@ -364,19 +386,6 @@ export class ConversationHeader extends React.Component<PropsType> {
))}
</SubMenu>
)}
<SubMenu title={muteTitle}>
{muteOptions.map(item => (
<MenuItem
key={item.name}
disabled={item.disabled}
onClick={() => {
onSetMuteNotifications(item.value);
}}
>
{item.name}
</MenuItem>
))}
</SubMenu>
<MenuItem onClick={onShowAllMedia}>{i18n('viewRecentMedia')}</MenuItem>
{isGroup ? (
<MenuItem onClick={onShowGroupMembers}>
@ -388,6 +397,7 @@ export class ConversationHeader extends React.Component<PropsType> {
{i18n('showSafetyNumber')}
</MenuItem>
) : null}
<MenuItem divider />
{!isGroup && acceptedMessageRequest ? (
<MenuItem onClick={onResetSession}>{i18n('resetSession')}</MenuItem>
) : null}
@ -398,15 +408,6 @@ export class ConversationHeader extends React.Component<PropsType> {
) : (
<MenuItem onClick={onArchive}>{i18n('archiveConversation')}</MenuItem>
)}
{isPinned ? (
<MenuItem onClick={() => onSetPin(false)}>
{i18n('unpinConversation')}
</MenuItem>
) : (
<MenuItem onClick={() => onSetPin(true)}>
{i18n('pinConversation')}
</MenuItem>
)}
<MenuItem onClick={onDeleteMessages}>{i18n('deleteMessages')}</MenuItem>
</ContextMenu>
);

18
ts/components/conversation/Message.stories.tsx
View file

@ -796,3 +796,21 @@ story.add('@Mentions', () => {
return renderBothDirections(props);
});
story.add('All the context menus', () => {
const props = createProps({
attachments: [
{
url: '/fixtures/tina-rolf-269345-unsplash.jpg',
fileName: 'tina-rolf-269345-unsplash.jpg',
contentType: IMAGE_JPEG,
width: 128,
height: 128,
},
],
status: 'partial-sent',
canDeleteForEveryone: true,
});
return <Message {...props} direction="outgoing" />;
});

49
ts/components/conversation/Message.tsx
View file

@ -1347,7 +1347,9 @@ export class Message extends React.PureComponent<Props, State> {
const { canDeleteForEveryone } = this.state;
const showRetry = status === 'error' && direction === 'outgoing';
const showRetry =
(status === 'error' || status === 'partial-sent') &&
direction === 'outgoing';
const multipleAttachments = attachments && attachments.length > 1;
const menu = (
@ -1360,7 +1362,8 @@ export class Message extends React.PureComponent<Props, State> {
attachments[0] ? (
<MenuItem
attributes={{
className: 'module-message__context__download',
className:
'module-message__context--icon module-message__context__download',
}}
onClick={this.openGenericAttachment}
>
@ -1371,20 +1374,8 @@ export class Message extends React.PureComponent<Props, State> {
<>
<MenuItem
attributes={{
className: 'module-message__context__react',
}}
onClick={(event: React.MouseEvent) => {
event.stopPropagation();
event.preventDefault();
this.toggleReactionPicker();
}}
>
{i18n('reactToMessage')}
</MenuItem>
<MenuItem
attributes={{
className: 'module-message__context__reply',
className:
'module-message__context--icon module-message__context__reply',
}}
onClick={(event: React.MouseEvent) => {
event.stopPropagation();
@ -1395,11 +1386,26 @@ export class Message extends React.PureComponent<Props, State> {
>
{i18n('replyToMessage')}
</MenuItem>
<MenuItem
attributes={{
className:
'module-message__context--icon module-message__context__react',
}}
onClick={(event: React.MouseEvent) => {
event.stopPropagation();
event.preventDefault();
this.toggleReactionPicker();
}}
>
{i18n('reactToMessage')}
</MenuItem>
</>
) : null}
<MenuItem
attributes={{
className: 'module-message__context__more-info',
className:
'module-message__context--icon module-message__context__more-info',
}}
onClick={(event: React.MouseEvent) => {
event.stopPropagation();
@ -1413,7 +1419,8 @@ export class Message extends React.PureComponent<Props, State> {
{showRetry ? (
<MenuItem
attributes={{
className: 'module-message__context__retry-send',
className:
'module-message__context--icon module-message__context__retry-send',
}}
onClick={(event: React.MouseEvent) => {
event.stopPropagation();
@ -1427,7 +1434,8 @@ export class Message extends React.PureComponent<Props, State> {
) : null}
<MenuItem
attributes={{
className: 'module-message__context__delete-message',
className:
'module-message__context--icon module-message__context__delete-message',
}}
onClick={(event: React.MouseEvent) => {
event.stopPropagation();
@ -1441,7 +1449,8 @@ export class Message extends React.PureComponent<Props, State> {
{canDeleteForEveryone ? (
<MenuItem
attributes={{
className: 'module-message__context__delete-message-for-everyone',
className:
'module-message__context--icon module-message__context__delete-message-for-everyone',
}}
onClick={(event: React.MouseEvent) => {
event.stopPropagation();