mirror of
https://github.com/vector-im/element-web.git
synced 2026-05-17 18:36:18 +02:00
Support narrow mode
This commit is contained in:
parent
c569e8914a
commit
6637ad2cfe
@ -23,7 +23,7 @@ import {
|
||||
StickerIcon,
|
||||
TextFormattingIcon,
|
||||
} from "@vector-im/compound-design-tokens/assets/web/icons";
|
||||
import { UploadButton } from "@element-hq/web-shared-components";
|
||||
import { UploadButton, useViewModel } from "@element-hq/web-shared-components";
|
||||
|
||||
import { _t } from "../../../languageHandler";
|
||||
import { CollapsibleButton } from "./CollapsibleButton";
|
||||
@ -34,7 +34,10 @@ import Modal from "../../../Modal";
|
||||
import PollCreateDialog from "../elements/PollCreateDialog";
|
||||
import { MatrixClientPeg } from "../../../MatrixClientPeg";
|
||||
import MatrixClientContext from "../../../contexts/MatrixClientContext";
|
||||
import IconizedContextMenu, { IconizedContextMenuOptionList } from "../context_menus/IconizedContextMenu";
|
||||
import IconizedContextMenu, {
|
||||
IconizedContextMenuOption,
|
||||
IconizedContextMenuOptionList,
|
||||
} from "../context_menus/IconizedContextMenu";
|
||||
import { EmojiButton } from "./EmojiButton";
|
||||
import { filterBoolean } from "../../../utils/arrays";
|
||||
import { useSettingValue } from "../../../hooks/useSettings";
|
||||
@ -88,7 +91,7 @@ const MessageComposerButtons: React.FC<IProps> = (props: IProps) => {
|
||||
),
|
||||
];
|
||||
moreButtons = [
|
||||
<UploadButton key="upload" vm={roomUploadVM} />,
|
||||
narrowUploadButtons(),
|
||||
showStickersButton(props),
|
||||
voiceRecordingButton(props, narrow),
|
||||
props.showPollsButton ? pollButton(room, props.relation) : null,
|
||||
@ -277,4 +280,20 @@ function ComposerModeButton({ isRichTextEnabled, onClick }: WysiwygToggleButtonP
|
||||
);
|
||||
}
|
||||
|
||||
function narrowUploadButtons(): JSX.Element[] {
|
||||
const vm = useRoomUploadViewModel();
|
||||
const snapshot = useViewModel(vm);
|
||||
if (!snapshot.mayUpload) {
|
||||
return [];
|
||||
}
|
||||
return snapshot.options.map(({ type, icon: Icon, label }) => (
|
||||
<IconizedContextMenuOption
|
||||
onClick={() => vm.onUploadOptionSelected(type)}
|
||||
icon={Icon && <Icon />}
|
||||
label={label}
|
||||
key={type}
|
||||
/>
|
||||
));
|
||||
}
|
||||
|
||||
export default MessageComposerButtons;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user