diff --git a/src/app/hooks/useAccountData.js b/src/app/hooks/useAccountData.js index 01c973e7..ed654d97 100644 --- a/src/app/hooks/useAccountData.js +++ b/src/app/hooks/useAccountData.js @@ -5,12 +5,12 @@ import initMatrix from '../../client/initMatrix'; export function useAccountData(eventType) { const mx = initMatrix.matrixClient; - const [event, setEvent] = useState(mx.getAccountData(eventType)?.getContent()); + const [event, setEvent] = useState(mx.getAccountData(eventType)); useEffect(() => { const handleChange = (mEvent) => { if (mEvent.getType() !== eventType) return; - setEvent(mEvent.getContent()); + setEvent(mEvent); }; mx.on('accountData', handleChange); return () => { diff --git a/src/app/molecules/global-notification/GlobalNotification.jsx b/src/app/molecules/global-notification/GlobalNotification.jsx index a28687eb..865582ce 100644 --- a/src/app/molecules/global-notification/GlobalNotification.jsx +++ b/src/app/molecules/global-notification/GlobalNotification.jsx @@ -53,7 +53,7 @@ export function getTypeActions(type, highlightValue = false) { function useGlobalNotif() { const mx = initMatrix.matrixClient; - const pushRules = useAccountData('m.push_rules'); + const pushRules = useAccountData('m.push_rules')?.getContent(); const underride = pushRules?.global?.underride ?? []; const rulesToType = { [DM]: notifType.ON, diff --git a/src/app/molecules/global-notification/IgnoreUserList.jsx b/src/app/molecules/global-notification/IgnoreUserList.jsx new file mode 100644 index 00000000..d23a6265 --- /dev/null +++ b/src/app/molecules/global-notification/IgnoreUserList.jsx @@ -0,0 +1,64 @@ +import React from 'react'; +import './IgnoreUserList.scss'; + +import initMatrix from '../../../client/initMatrix'; +import * as roomActions from '../../../client/action/room'; + +import Text from '../../atoms/text/Text'; +import Chip from '../../atoms/chip/Chip'; +import Input from '../../atoms/input/Input'; +import Button from '../../atoms/button/Button'; +import { MenuHeader } from '../../atoms/context-menu/ContextMenu'; +import SettingTile from '../setting-tile/SettingTile'; + +import CrossIC from '../../../../public/res/ic/outlined/cross.svg'; + +import { useAccountData } from '../../hooks/useAccountData'; + +function IgnoreUserList() { + useAccountData('m.ignored_user_list'); + const ignoredUsers = initMatrix.matrixClient.getIgnoredUsers(); + + const handleSubmit = (evt) => { + evt.preventDefault(); + const { ignoreInput } = evt.target.elements; + const value = ignoreInput.value.trim(); + const userIds = value.split(' ').filter((v) => v.match(/^@\S+:\S+$/)); + if (userIds.length === 0) return; + ignoreInput.value = ''; + roomActions.ignore(userIds); + }; + + return ( +
+ Ignored users + + Ignore userId if you do not want to see their messages. +
+ + +
+ {ignoredUsers.length > 0 && ( +
+ {ignoredUsers.map((uId) => ( + roomActions.unignore([uId])} + /> + ))} +
+ )} +
+ )} + /> + + ); +} + +export default IgnoreUserList; diff --git a/src/app/molecules/global-notification/IgnoreUserList.scss b/src/app/molecules/global-notification/IgnoreUserList.scss new file mode 100644 index 00000000..de4855e5 --- /dev/null +++ b/src/app/molecules/global-notification/IgnoreUserList.scss @@ -0,0 +1,16 @@ +.ignore-user-list { + &__users { + & form, + & > div:last-child { + display: flex; + gap: var(--sp-tight); + } + + & form { + margin: var(--sp-extra-tight) 0 var(--sp-normal); + .input-container { + flex-grow: 1; + } + } + } +} \ No newline at end of file diff --git a/src/app/molecules/global-notification/KeywordNotification.jsx b/src/app/molecules/global-notification/KeywordNotification.jsx index c44ffc46..8484d41d 100644 --- a/src/app/molecules/global-notification/KeywordNotification.jsx +++ b/src/app/molecules/global-notification/KeywordNotification.jsx @@ -29,7 +29,7 @@ const KEYWORD = 'keyword'; function useKeywordNotif() { const mx = initMatrix.matrixClient; - const pushRules = useAccountData('m.push_rules'); + const pushRules = useAccountData('m.push_rules')?.getContent(); const override = pushRules?.global?.override ?? []; const content = pushRules?.global?.content ?? []; diff --git a/src/app/molecules/global-notification/KeywordNotification.scss b/src/app/molecules/global-notification/KeywordNotification.scss index a5870020..7f0d7bda 100644 --- a/src/app/molecules/global-notification/KeywordNotification.scss +++ b/src/app/molecules/global-notification/KeywordNotification.scss @@ -7,7 +7,7 @@ } & form { - margin: var(--sp-ultra-tight) 0 var(--sp-normal); + margin: var(--sp-extra-tight) 0 var(--sp-normal); .input-container { flex-grow: 1; } diff --git a/src/app/organisms/settings/Settings.jsx b/src/app/organisms/settings/Settings.jsx index 5f69fdb7..2e0f64bd 100644 --- a/src/app/organisms/settings/Settings.jsx +++ b/src/app/organisms/settings/Settings.jsx @@ -27,6 +27,7 @@ import ExportE2ERoomKeys from '../../molecules/import-export-e2e-room-keys/Expor import { ImagePackUser, ImagePackGlobal } from '../../molecules/image-pack/ImagePack'; import GlobalNotification from '../../molecules/global-notification/GlobalNotification'; import KeywordNotification from '../../molecules/global-notification/KeywordNotification'; +import IgnoreUserList from '../../molecules/global-notification/IgnoreUserList'; import ProfileEditor from '../profile-editor/ProfileEditor'; import CrossSigning from './CrossSigning'; @@ -173,6 +174,7 @@ function NotificationsSection() { + ); } diff --git a/src/app/organisms/settings/Settings.scss b/src/app/organisms/settings/Settings.scss index aa455700..a9ddd475 100644 --- a/src/app/organisms/settings/Settings.scss +++ b/src/app/organisms/settings/Settings.scss @@ -40,6 +40,7 @@ .settings-notifications, .global-notification, .keyword-notification, +.ignore-user-list, .settings-security__card, .settings-security .device-manage, .settings-about__card,