OpenCloud
/
riot-web
mirror of https://github.com/vector-im/riot-web
1
0
Fork 0
Code Issues Releases Wiki Activity

Add buttons to composer actions 

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
pull/21833/head
Michael Telatynski 2020-07-17 18:16:31 +01:00
parent a402f7e38f
commit 1c205c7704
2 changed files with 22 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/components/views/rooms/MessageComposer.js
View File

@ -27,7 +27,8 @@ import { makeRoomPermalink } from '../../../utils/permalinks/Permalinks';
import ContentMessages from '../../../ContentMessages'; import ContentMessages from '../../../ContentMessages';
import E2EIcon from './E2EIcon'; import E2EIcon from './E2EIcon';
import SettingsStore from "../../../settings/SettingsStore"; import SettingsStore from "../../../settings/SettingsStore";
import {aboveLeftOf, ContextMenu, ContextMenuButton, useContextMenu} from "../../structures/ContextMenu"; import {aboveLeftOf, ContextMenu, ContextMenuTooltipButton, useContextMenu} from "../../structures/ContextMenu";
import AccessibleTooltipButton from "../elements/AccessibleTooltipButton";
function ComposerAvatar(props) { function ComposerAvatar(props) {
const MemberStatusMessageAvatar = sdk.getComponent('avatars.MemberStatusMessageAvatar'); const MemberStatusMessageAvatar = sdk.getComponent('avatars.MemberStatusMessageAvatar');
@ -41,7 +42,6 @@ ComposerAvatar.propTypes = {
}; };
function CallButton(props) { function CallButton(props) {
const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
const onVoiceCallClick = (ev) => { const onVoiceCallClick = (ev) => {
dis.dispatch({ dis.dispatch({
action: 'place_call', action: 'place_call',
@ -50,10 +50,11 @@ function CallButton(props) {
}); });
}; };
return (<AccessibleButton className="mx_MessageComposer_button mx_MessageComposer_voicecall" return (<AccessibleTooltipButton
onClick={onVoiceCallClick} className="mx_MessageComposer_button mx_MessageComposer_voicecall"
title={_t('Voice call')} onClick={onVoiceCallClick}
/>); title={_t('Voice call')}
/>);
} }
CallButton.propTypes = { CallButton.propTypes = {
@ -61,7 +62,6 @@ CallButton.propTypes = {
}; };
function VideoCallButton(props) { function VideoCallButton(props) {
const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
const onCallClick = (ev) => { const onCallClick = (ev) => {
dis.dispatch({ dis.dispatch({
action: 'place_call', action: 'place_call',
@ -70,7 +70,8 @@ function VideoCallButton(props) {
}); });
}; };
return <AccessibleButton className="mx_MessageComposer_button mx_MessageComposer_videocall" return <AccessibleTooltipButton
className="mx_MessageComposer_button mx_MessageComposer_videocall"
onClick={onCallClick} onClick={onCallClick}
title={_t('Video call')} title={_t('Video call')}
/>; />;
@ -117,14 +118,15 @@ const EmojiButton = ({addEmoji}) => {
} }
return <React.Fragment> return <React.Fragment>
<ContextMenuButton className="mx_MessageComposer_button mx_MessageComposer_emoji" <ContextMenuTooltipButton
onClick={openMenu} className="mx_MessageComposer_button mx_MessageComposer_emoji"
isExpanded={menuDisplayed} onClick={openMenu}
label={_t('Emoji picker')} isExpanded={menuDisplayed}
inputRef={button} title={_t('Emoji picker')}
inputRef={button}
> >
</ContextMenuButton> </ContextMenuTooltipButton>
{ contextMenu } { contextMenu }
</React.Fragment>; </React.Fragment>;
@ -185,9 +187,9 @@ class UploadButton extends React.Component {
render() { render() {
const uploadInputStyle = {display: 'none'}; const uploadInputStyle = {display: 'none'};
const AccessibleButton = sdk.getComponent('elements.AccessibleButton');
return ( return (
<AccessibleButton className="mx_MessageComposer_button mx_MessageComposer_upload" <AccessibleTooltipButton
className="mx_MessageComposer_button mx_MessageComposer_upload"
onClick={this.onUploadClick} onClick={this.onUploadClick}
title={_t('Upload file')} title={_t('Upload file')}
> >
@ -198,7 +200,7 @@ class UploadButton extends React.Component {
multiple multiple
onChange={this.onUploadFileInputChange} onChange={this.onUploadFileInputChange}
/> />
</AccessibleButton> </AccessibleTooltipButton>
); );
} }
} }

5
src/components/views/rooms/Stickerpicker.js
View File

@ -27,6 +27,7 @@ import {IntegrationManagers} from "../../../integrations/IntegrationManagers";
import SettingsStore from "../../../settings/SettingsStore"; import SettingsStore from "../../../settings/SettingsStore";
import {ContextMenu} from "../../structures/ContextMenu"; import {ContextMenu} from "../../structures/ContextMenu";
import {WidgetType} from "../../../widgets/WidgetType"; import {WidgetType} from "../../../widgets/WidgetType";
import AccessibleTooltipButton from "../elements/AccessibleTooltipButton";
// This should be below the dialog level (4000), but above the rest of the UI (1000-2000). // This should be below the dialog level (4000), but above the rest of the UI (1000-2000).
// We sit in a context menu, so this should be given to the context menu. // We sit in a context menu, so this should be given to the context menu.
@ -409,14 +410,14 @@ export default class Stickerpicker extends React.Component {
} else { } else {
// Show show-stickers button // Show show-stickers button
stickersButton = stickersButton =
<AccessibleButton <AccessibleTooltipButton
id='stickersButton' id='stickersButton'
key="controls_show_stickers" key="controls_show_stickers"
className="mx_MessageComposer_button mx_MessageComposer_stickers" className="mx_MessageComposer_button mx_MessageComposer_stickers"
onClick={this._onShowStickersClick} onClick={this._onShowStickersClick}
title={_t("Show Stickers")} title={_t("Show Stickers")}
> >
</AccessibleButton>; </AccessibleTooltipButton>;
} }
return <React.Fragment> return <React.Fragment>
{ stickersButton } { stickersButton }