From 8bf5a6e0bcfba4cddbd8eb4774609200470cd2e1 Mon Sep 17 00:00:00 2001 From: unknown Date: Thu, 9 Sep 2021 18:36:39 +0530 Subject: [PATCH] Added options to control room notifications (#25) --- src/app/organisms/navigation/Selector.jsx | 66 ++++++++++++++-------- src/app/organisms/room/RoomViewContent.jsx | 9 +-- src/app/organisms/room/RoomViewHeader.jsx | 29 ++-------- src/app/organisms/room/RoomViewInput.jsx | 12 ++-- src/app/templates/client/Client.jsx | 2 + 5 files changed, 56 insertions(+), 62 deletions(-) diff --git a/src/app/organisms/navigation/Selector.jsx b/src/app/organisms/navigation/Selector.jsx index 0ddc1274..1a47a57e 100644 --- a/src/app/organisms/navigation/Selector.jsx +++ b/src/app/organisms/navigation/Selector.jsx @@ -5,7 +5,9 @@ import PropTypes from 'prop-types'; import initMatrix from '../../../client/initMatrix'; import { doesRoomHaveUnread } from '../../../util/matrixUtil'; import navigation from '../../../client/state/navigation'; +import { openRoomOptions } from '../../../client/action/navigation'; import { createSpaceShortcut, deleteSpaceShortcut } from '../../../client/action/room'; +import { getEventCords } from '../../../util/common'; import IconButton from '../../atoms/button/IconButton'; import RoomSelector from '../../molecules/room-selector/RoomSelector'; @@ -16,6 +18,7 @@ import SpaceIC from '../../../../public/res/ic/outlined/space.svg'; import SpaceLockIC from '../../../../public/res/ic/outlined/space-lock.svg'; import StarIC from '../../../../public/res/ic/outlined/star.svg'; import FilledStarIC from '../../../../public/res/ic/filled/star.svg'; +import VerticalMenuIC from '../../../../public/res/ic/outlined/vertical-menu.svg'; function Selector({ roomId, isDM, drawerPostie, onClick, @@ -44,43 +47,56 @@ function Selector({ }; }, []); + if (room.isSpaceRoom()) { + return ( + { + if (initMatrix.roomList.spaceShortcut.has(roomId)) deleteSpaceShortcut(roomId); + else createSpaceShortcut(roomId); + forceUpdate({}); + }} + /> + )} + /> + ); + } + return ( { - if (room.isSpaceRoom()) { - return (room.getJoinRule() === 'invite' ? SpaceLockIC : SpaceIC); - } - return (room.getJoinRule() === 'invite' ? HashLockIC : HashIC); - })() - } + // eslint-disable-next-line no-nested-ternary + iconSrc={isDM ? null : room.getJoinRule() === 'invite' ? HashLockIC : HashIC} isSelected={isSelected} isUnread={doesRoomHaveUnread(room)} notificationCount={room.getUnreadNotificationCount('total') || 0} isAlert={room.getUnreadNotificationCount('highlight') !== 0} onClick={onClick} options={( - !room.isSpaceRoom() - ? null - : ( - { - if (initMatrix.roomList.spaceShortcut.has(roomId)) deleteSpaceShortcut(roomId); - else createSpaceShortcut(roomId); - forceUpdate({}); - }} - /> - ) + openRoomOptions(getEventCords(e), roomId)} + /> )} /> ); diff --git a/src/app/organisms/room/RoomViewContent.jsx b/src/app/organisms/room/RoomViewContent.jsx index 18b8d34d..57784b63 100644 --- a/src/app/organisms/room/RoomViewContent.jsx +++ b/src/app/organisms/room/RoomViewContent.jsx @@ -10,7 +10,7 @@ import cons from '../../../client/state/cons'; import { redactEvent, sendReaction } from '../../../client/action/roomTimeline'; import { getUsername, getUsernameOfRoomMember, doesRoomHaveUnread } from '../../../util/matrixUtil'; import colorMXID from '../../../util/colorMXID'; -import { diffMinutes, isNotInSameDay } from '../../../util/common'; +import { diffMinutes, isNotInSameDay, getEventCords } from '../../../util/common'; import { openEmojiBoard, openReadReceipts } from '../../../client/action/navigation'; import Divider from '../../atoms/divider/Divider'; @@ -176,12 +176,7 @@ function toggleEmoji(roomId, eventId, emojiKey, roomTimeline) { } function pickEmoji(e, roomId, eventId, roomTimeline) { - const boxInfo = e.target.getBoundingClientRect(); - openEmojiBoard({ - x: boxInfo.x, - y: boxInfo.y, - detail: e.detail, - }, (emoji) => { + openEmojiBoard(getEventCords(e), (emoji) => { toggleEmoji(roomId, eventId, emoji.unicode, roomTimeline); e.target.click(); }); diff --git a/src/app/organisms/room/RoomViewHeader.jsx b/src/app/organisms/room/RoomViewHeader.jsx index d9b8aa97..e51cbd38 100644 --- a/src/app/organisms/room/RoomViewHeader.jsx +++ b/src/app/organisms/room/RoomViewHeader.jsx @@ -2,20 +2,17 @@ import React from 'react'; import PropTypes from 'prop-types'; import initMatrix from '../../../client/initMatrix'; -import { togglePeopleDrawer, openInviteUser } from '../../../client/action/navigation'; -import * as roomActions from '../../../client/action/room'; +import { togglePeopleDrawer, openRoomOptions } from '../../../client/action/navigation'; import colorMXID from '../../../util/colorMXID'; +import { getEventCords } from '../../../util/common'; import Text from '../../atoms/text/Text'; import IconButton from '../../atoms/button/IconButton'; import Header, { TitleWrapper } from '../../atoms/header/Header'; import Avatar from '../../atoms/avatar/Avatar'; -import ContextMenu, { MenuItem, MenuHeader } from '../../atoms/context-menu/ContextMenu'; import UserIC from '../../../../public/res/ic/outlined/user.svg'; import VerticalMenuIC from '../../../../public/res/ic/outlined/vertical-menu.svg'; -import LeaveArrowIC from '../../../../public/res/ic/outlined/leave-arrow.svg'; -import AddUserIC from '../../../../public/res/ic/outlined/add-user.svg'; function RoomViewHeader({ roomId }) { const mx = initMatrix.matrixClient; @@ -33,24 +30,10 @@ function RoomViewHeader({ roomId }) { { typeof roomTopic !== 'undefined' &&

{roomTopic}

} - ( - <> - Options - {/* */} - { - openInviteUser(roomId); toogleMenu(); - }} - > - Invite - - roomActions.leave(roomId)}>Leave - - )} - render={(toggleMenu) => } + openRoomOptions(getEventCords(e), roomId)} + tooltip="Options" + src={VerticalMenuIC} /> ); diff --git a/src/app/organisms/room/RoomViewInput.jsx b/src/app/organisms/room/RoomViewInput.jsx index a72f1e34..622d9e2f 100644 --- a/src/app/organisms/room/RoomViewInput.jsx +++ b/src/app/organisms/room/RoomViewInput.jsx @@ -9,7 +9,7 @@ import initMatrix from '../../../client/initMatrix'; import cons from '../../../client/state/cons'; import settings from '../../../client/state/settings'; import { openEmojiBoard } from '../../../client/action/navigation'; -import { bytesToSize } from '../../../util/common'; +import { bytesToSize, getEventCords } from '../../../util/common'; import { getUsername } from '../../../util/matrixUtil'; import colorMXID from '../../../util/colorMXID'; @@ -327,12 +327,10 @@ function RoomViewInput({
{ - const boxInfo = e.target.getBoundingClientRect(); - openEmojiBoard({ - x: boxInfo.x + (document.dir === 'rtl' ? -80 : 80), - y: boxInfo.y - 250, - detail: e.detail, - }, addEmoji); + const cords = getEventCords(e); + cords.x += (document.dir === 'rtl' ? -80 : 80); + cords.y -= 250; + openEmojiBoard(cords, addEmoji); }} tooltip="Emoji" src={EmojiIC} diff --git a/src/app/templates/client/Client.jsx b/src/app/templates/client/Client.jsx index 8f89d435..bf7a3e77 100644 --- a/src/app/templates/client/Client.jsx +++ b/src/app/templates/client/Client.jsx @@ -8,6 +8,7 @@ import Room from '../../organisms/room/Room'; import Windows from '../../organisms/pw/Windows'; import Dialogs from '../../organisms/pw/Dialogs'; import EmojiBoardOpener from '../../organisms/emoji-board/EmojiBoardOpener'; +import RoomOptions from '../../organisms/room-optons/RoomOptions'; import initMatrix from '../../../client/initMatrix'; @@ -44,6 +45,7 @@ function Client() { +
); }