diff --git a/res/css/_components.pcss b/res/css/_components.pcss index a54bee357d..951104a811 100644 --- a/res/css/_components.pcss +++ b/res/css/_components.pcss @@ -300,6 +300,7 @@ @import "./views/rooms/_OverflowTile.pcss"; @import "./views/rooms/_PinnedEventTile.pcss"; @import "./views/rooms/_PinnedMessageBanner.pcss"; +@import "./views/rooms/_PresenceIconView.pcss"; @import "./views/rooms/_PresenceLabel.pcss"; @import "./views/rooms/_ReadReceiptGroup.pcss"; @import "./views/rooms/_ReplyPreview.pcss"; diff --git a/res/css/views/messages/_DisambiguatedProfile.pcss b/res/css/views/messages/_DisambiguatedProfile.pcss index a5d0f1eff3..93dce8ab52 100644 --- a/res/css/views/messages/_DisambiguatedProfile.pcss +++ b/res/css/views/messages/_DisambiguatedProfile.pcss @@ -27,6 +27,7 @@ Please see LICENSE files in the repository root for full details. } } +/** Disambiguated profile needs to have a different layout in the member tile */ .mx_MemberTileView .mx_DisambiguatedProfile { display: flex; flex-direction: column; diff --git a/res/css/views/rooms/_MemberListHeaderView.pcss b/res/css/views/rooms/_MemberListHeaderView.pcss index 93d63e3515..0143dda501 100644 --- a/res/css/views/rooms/_MemberListHeaderView.pcss +++ b/res/css/views/rooms/_MemberListHeaderView.pcss @@ -1,6 +1,5 @@ /* Copyright 2024 New Vector Ltd. -Copyright 2015, 2016 OpenMarket Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only Please see LICENSE files in the repository root for full details. diff --git a/res/css/views/rooms/_MemberListView.pcss b/res/css/views/rooms/_MemberListView.pcss index 97d4397f05..162b8558b8 100644 --- a/res/css/views/rooms/_MemberListView.pcss +++ b/res/css/views/rooms/_MemberListView.pcss @@ -1,6 +1,5 @@ /* Copyright 2024 New Vector Ltd. -Copyright 2015, 2016 OpenMarket Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only Please see LICENSE files in the repository root for full details. diff --git a/res/css/views/rooms/_MemberTileView.pcss b/res/css/views/rooms/_MemberTileView.pcss index 0268f6ee96..94d9987e59 100644 --- a/res/css/views/rooms/_MemberTileView.pcss +++ b/res/css/views/rooms/_MemberTileView.pcss @@ -1,3 +1,10 @@ +/* +Copyright 2024 New Vector Ltd. + +SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only +Please see LICENSE files in the repository root for full details. +*/ + .mx_MemberTileView { display: flex; padding: var(--cpd-space-3x) var(--cpd-space-3x) var(--cpd-space-3x) var(--cpd-space-4x); @@ -9,7 +16,7 @@ .mx_MemberTileView_right { display: flex; align-items: center; - gap: 8px; + gap: var(--cpd-space-2x); } .mx_MemberTileView_left { diff --git a/res/css/views/rooms/_OverflowTile.pcss b/res/css/views/rooms/_OverflowTile.pcss index 0e5be82df0..f577b6bd22 100644 --- a/res/css/views/rooms/_OverflowTile.pcss +++ b/res/css/views/rooms/_OverflowTile.pcss @@ -1,3 +1,12 @@ +/* +Copyright 2024 New Vector Ltd. +Copyright 2020 The Matrix.org Foundation C.I.C. +Copyright 2015, 2016 OpenMarket Ltd + +SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only +Please see LICENSE files in the repository root for full details. +*/ + .mx_OverflowTileView { display: flex; align-items: center; diff --git a/res/css/views/rooms/_PresenceIconView.pcss b/res/css/views/rooms/_PresenceIconView.pcss new file mode 100644 index 0000000000..6be4ac4782 --- /dev/null +++ b/res/css/views/rooms/_PresenceIconView.pcss @@ -0,0 +1,32 @@ +/* +Copyright 2024 New Vector Ltd. + +SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only +Please see LICENSE files in the repository root for full details. +*/ + +.mx_PresenceIconView { + position: absolute; + top: 24px; + left: 24px; + width: 12px; + height: 12px; + display: flex; + justify-content: center; + align-items: center; + background: var(--cpd-color-bg-canvas-default); + border-radius: 100%; + + .mx_PresenceIconView_online { + color: var(--cpd-color-icon-accent-primary); + } + + .mx_PresenceIconView_offline, + .mx_PresenceIconView_dnd { + color: var(--cpd-color-icon-tertiary); + } + + .mx_PresenceIconView_unavailable { + color: var(--cpd-color-icon-quaternary); + } +} diff --git a/res/css/views/rooms/_PresenceLabel.pcss b/res/css/views/rooms/_PresenceLabel.pcss index 56dd6d46b8..c9c610c221 100644 --- a/res/css/views/rooms/_PresenceLabel.pcss +++ b/res/css/views/rooms/_PresenceLabel.pcss @@ -14,29 +14,3 @@ Please see LICENSE files in the repository root for full details. .mx_PresenceLabel_online { color: var(--cpd-color-text-success-primary); } - -.mx_PresenceIconView { - position: absolute; - top: 24px; - left: 24px; - width: 12px; - height: 12px; - display: flex; - justify-content: center; - align-items: center; - background: var(--cpd-color-bg-canvas-default); - border-radius: 100%; - - .mx_PresenceIconView_online { - color: var(--cpd-color-icon-accent-primary); - } - - .mx_PresenceIconView_offline, - .mx_PresenceIconView_dnd { - color: var(--cpd-color-icon-tertiary); - } - - .mx_PresenceIconView_unavailable { - color: var(--cpd-color-icon-quaternary); - } -} diff --git a/src/components/structures/RightPanel.tsx b/src/components/structures/RightPanel.tsx index 52b1321198..7ad1233b96 100644 --- a/src/components/structures/RightPanel.tsx +++ b/src/components/structures/RightPanel.tsx @@ -17,7 +17,6 @@ import RightPanelStore from "../../stores/right-panel/RightPanelStore"; import MatrixClientContext from "../../contexts/MatrixClientContext"; import RoomSummaryCard from "../views/right_panel/RoomSummaryCard"; import WidgetCard from "../views/right_panel/WidgetCard"; -// import MemberList from "../views/rooms/MemberList"; import UserInfo from "../views/right_panel/UserInfo"; import ThirdPartyMemberInfo from "../views/rooms/ThirdPartyMemberInfo"; import FilePanel from "./FilePanel"; diff --git a/src/components/viewmodels/MemberListViewModel.tsx b/src/components/viewmodels/MemberListViewModel.tsx index 0c740aa877..3de73b0f83 100644 --- a/src/components/viewmodels/MemberListViewModel.tsx +++ b/src/components/viewmodels/MemberListViewModel.tsx @@ -1,17 +1,8 @@ /* -Copyright 2024 The Matrix.org Foundation C.I.C. +Copyright 2024 New Vector Ltd. -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. +SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only +Please see LICENSE files in the repository root for full details. */ import { @@ -23,7 +14,7 @@ import { RoomMemberEvent, RoomState, RoomStateEvent, - RoomMember as SDKRoomMember, + RoomMember as SdkRoomMember, User, UserEvent, } from "matrix-js-sdk/src/matrix"; @@ -68,7 +59,6 @@ export function getPending3PidInvites(room: Room, searchQuery?: string): Member[ const invites: Member[] = inviteEvents.map((e) => { return { threePidInvite: { - displayName: e.getContent().display_name, event: e, }, }; @@ -76,7 +66,7 @@ export function getPending3PidInvites(room: Room, searchQuery?: string): Member[ return invites; } -export function sdkRoomMemberToRoomMember(member: SDKRoomMember): Member { +export function sdkRoomMemberToRoomMember(member: SdkRoomMember): Member { const displayUserId = UserIdentifierCustomisations.getDisplayUserIdentifier(member.userId, { roomId: member.roomId, @@ -87,7 +77,7 @@ export function sdkRoomMemberToRoomMember(member: SDKRoomMember): Member { (mxcAvatarURL && mediaFromMxc(mxcAvatarURL).getThumbnailOfSourceHttp(96, 96, "crop")) ?? undefined; const user = member.user; - let presenceState: PresenceState | undefined = undefined; + let presenceState: PresenceState | undefined; if (user) { presenceState = (user.presence as PresenceState) || undefined; } @@ -111,7 +101,6 @@ export function sdkRoomMemberToRoomMember(member: SDKRoomMember): Member { export interface MemberListViewState { members: Member[]; - memberCount: number; search: (searchQuery: string) => void; isPresenceEnabled: boolean; shouldShowInvite: boolean; @@ -122,16 +111,21 @@ export interface MemberListViewState { } export function useMemberListViewModel(roomId: string): MemberListViewState { const cli = useMatrixClientContext(); + const room = useMemo(() => cli.getRoom(roomId), [roomId, cli]); if (!room) { throw new Error(`Room with id ${roomId} does not exist!`); } + const sdkContext = useContext(SDKContext); const [memberMap, setMemberMap] = useState>(new Map()); - const [memberCount, setMemberCount] = useState(0); - const searchQuery = useRef(""); const [isLoading, setIsLoading] = useState(true); + // This is the last known total number of members in this room. + const totalMemberCount = useRef(0); + + const searchQuery = useRef(""); + const loadMembers = useMemo( () => throttle( @@ -149,7 +143,8 @@ export function useMemberListViewModel(roomId: string): MemberListViewState { // Then add the third party invites const threePidInvited = getPending3PidInvites(room, searchQuery.current); for (const invited of threePidInvited) { - newMemberMap.set(invited.threePidInvite!.displayName, invited); + const key = invited.threePidInvite!.event.getContent().display_name; + newMemberMap.set(key, invited); } // Finally add the joined room members for (const member of joinedSdk) { @@ -157,12 +152,17 @@ export function useMemberListViewModel(roomId: string): MemberListViewState { newMemberMap.set(member.userId, roomMember); } setMemberMap(newMemberMap); - if (!searchQuery.current) setMemberCount(newMemberMap.size); + if (!searchQuery.current) { + /** + * Since searching for members only gives you the relevant + * members matching the query, do not update the totalMemberCount! + **/ + totalMemberCount.current = newMemberMap.size; + } }, 500, { leading: true, trailing: true }, ), - //todo: can we remove room here? [roomId, sdkContext.memberListStore, room], ); @@ -197,25 +197,26 @@ export function useMemberListViewModel(roomId: string): MemberListViewState { }; useTypedEventEmitter(cli, RoomStateEvent.Events, (event: MatrixEvent) => { - if (event.getRoomId() === roomId && event.getType() === EventType.RoomThirdPartyInvite) loadMembers(); - const newCanInvite = getCanUserInviteToThisRoom(); - setCanInvite(newCanInvite); + if (event.getRoomId() === roomId && event.getType() === EventType.RoomThirdPartyInvite) { + loadMembers(); + const newCanInvite = getCanUserInviteToThisRoom(); + setCanInvite(newCanInvite); + } }); useTypedEventEmitter(cli, RoomStateEvent.Update, (state: RoomState) => { if (state.roomId === roomId) loadMembers(); }); - useTypedEventEmitter(cli, RoomMemberEvent.Name, (_: MatrixEvent, member: SDKRoomMember) => { + useTypedEventEmitter(cli, RoomMemberEvent.Name, (_: MatrixEvent, member: SdkRoomMember) => { if (member.roomId === roomId) loadMembers(); }); useTypedEventEmitter(cli, ClientEvent.Room, (room: Room) => { - if (room.roomId === roomId) loadMembers(); // We listen for room events because when we accept an invite // we need to wait till the room is fully populated with state // before refreshing the member list else we get a stale list. - // this.onMemberListUpdated?.(true); + if (room.roomId === roomId) loadMembers(); }); useTypedEventEmitter(cli, RoomEvent.MyMembership, (room: Room, membership: string, oldMembership?: string) => { @@ -228,8 +229,16 @@ export function useMemberListViewModel(roomId: string): MemberListViewState { } }); + useTypedEventEmitter(cli, UserEvent.Presence, (_: MatrixEvent | undefined, user: User) => { + if (memberMap.has(user.userId)) loadMembers(); + }); + + useTypedEventEmitter(cli, UserEvent.CurrentlyActive, (_: MatrixEvent | undefined, user: User) => { + if (memberMap.has(user.userId)) loadMembers(); + }); + + // Initial load of the memberlist useEffect(() => { - // Initial load of the memberlist (async () => { await loadMembers(); /** @@ -241,23 +250,14 @@ export function useMemberListViewModel(roomId: string): MemberListViewState { })(); }, [loadMembers]); - useTypedEventEmitter(cli, UserEvent.Presence, (_: MatrixEvent | undefined, user: User) => { - if (memberMap.has(user.userId)) loadMembers(); - }); - - useTypedEventEmitter(cli, UserEvent.CurrentlyActive, (_: MatrixEvent | undefined, user: User) => { - if (memberMap.has(user.userId)) loadMembers(); - }); - return { members: Array.from(memberMap.values()), - memberCount, search, shouldShowInvite, isPresenceEnabled, isLoading, onInviteButtonClick, - shouldShowSearch: memberCount >= 20, + shouldShowSearch: totalMemberCount.current >= 20, canInvite, }; } diff --git a/src/components/viewmodels/MemberTileViewModel.tsx b/src/components/viewmodels/MemberTileViewModel.tsx index a265e0ebfb..5c14510c94 100644 --- a/src/components/viewmodels/MemberTileViewModel.tsx +++ b/src/components/viewmodels/MemberTileViewModel.tsx @@ -1,18 +1,8 @@ /* -Copyright 2015, 2016 OpenMarket Ltd -Copyright 2019, 2020 The Matrix.org Foundation C.I.C. +Copyright 2024 New Vector Ltd. -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. +SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only +Please see LICENSE files in the repository root for full details. */ import { useEffect, useMemo, useState } from "react"; @@ -64,7 +54,7 @@ export interface ThreePidTileViewState { export function useThreePidTileViewModel(props: ThreePidTileViewModelProps): ThreePidTileViewState { const invite = props.threePidInvite; - const name = invite.displayName; + const name = invite.event.getContent().display_name; const onClick = (): void => { dis.dispatch({ action: Action.View3pidInvite, diff --git a/src/components/views/dialogs/ForwardDialog.tsx b/src/components/views/dialogs/ForwardDialog.tsx index 97c9fa9f20..cdf5b7b735 100644 --- a/src/components/views/dialogs/ForwardDialog.tsx +++ b/src/components/views/dialogs/ForwardDialog.tsx @@ -56,7 +56,7 @@ import { } from "../../../accessibility/RovingTabIndex"; import { getKeyBindingsManager } from "../../../KeyBindingsManager"; import { KeyBindingAction } from "../../../accessibility/KeyboardShortcuts"; -import OverflowTileView from "../rooms/OverflowTileView"; +import { OverflowTileView } from "../rooms/OverflowTileView"; const AVATAR_SIZE = 30; diff --git a/src/components/views/messages/DisambiguatedProfile.tsx b/src/components/views/messages/DisambiguatedProfile.tsx index 25e402ce31..b6b469eaa6 100644 --- a/src/components/views/messages/DisambiguatedProfile.tsx +++ b/src/components/views/messages/DisambiguatedProfile.tsx @@ -14,7 +14,7 @@ import { _t } from "../../../languageHandler"; import { getUserNameColorClass } from "../../../utils/FormattingUtils"; import UserIdentifier from "../../../customisations/UserIdentifier"; -interface DisambiguatedMemberInfo { +interface MemberInfo { userId: string; roomId: string; rawDisplayName?: string; @@ -22,7 +22,7 @@ interface DisambiguatedMemberInfo { } interface IProps { - member?: DisambiguatedMemberInfo | null; + member?: MemberInfo | null; fallbackName: string; onClick?(): void; colored?: boolean; diff --git a/src/components/views/rooms/E2EIcon.tsx b/src/components/views/rooms/E2EIcon.tsx index 8dd4bf63b4..99ac07e0ec 100644 --- a/src/components/views/rooms/E2EIcon.tsx +++ b/src/components/views/rooms/E2EIcon.tsx @@ -22,7 +22,7 @@ export enum E2EState { Normal = "normal", } -const crossSigningUserTitles: { [key in E2EState]?: TranslationKey } = { +export const crossSigningUserTitles: { [key in E2EState]?: TranslationKey } = { [E2EState.Warning]: _td("encryption|cross_signing_user_warning"), [E2EState.Normal]: _td("encryption|cross_signing_user_normal"), [E2EState.Verified]: _td("encryption|cross_signing_user_verified"), @@ -73,17 +73,18 @@ const E2EIcon: React.FC> = ({ className, ); - let style: CSSProperties | undefined; - if (size) { - style = { width: `${size}px`, height: `${size}px` }; - } - let e2eTitle: TranslationKey | undefined; if (isUser) { e2eTitle = crossSigningUserTitles[status]; } else { e2eTitle = crossSigningRoomTitles[status]; } + + let style: CSSProperties | undefined; + if (size) { + style = { width: `${size}px`, height: `${size}px` }; + } + const label = e2eTitle ? _t(e2eTitle) : ""; let content: JSX.Element; diff --git a/src/components/views/rooms/E2EIconView.tsx b/src/components/views/rooms/E2EIconView.tsx index e6a5bca327..409872394c 100644 --- a/src/components/views/rooms/E2EIconView.tsx +++ b/src/components/views/rooms/E2EIconView.tsx @@ -1,39 +1,18 @@ /* Copyright 2024 New Vector Ltd. -Copyright 2020 The Matrix.org Foundation C.I.C. -Copyright 2019 New Vector Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only Please see LICENSE files in the repository root for full details. */ -import React, { ComponentProps, CSSProperties } from "react"; -import classNames from "classnames"; +import React from "react"; import { Tooltip } from "@vector-im/compound-web"; import VerifiedIcon from "@vector-im/compound-design-tokens/assets/web/icons/verified"; import ErrorIcon from "@vector-im/compound-design-tokens/assets/web/icons/error"; -import { _t, _td, TranslationKey } from "../../../languageHandler"; +import { _t } from "../../../languageHandler"; import { E2EStatus } from "../../../utils/ShieldUtils"; -import { XOR } from "../../../@types/common"; -import { E2EState } from "./E2EIcon"; - -// export enum E2EState { -// Verified = "verified", -// Warning = "warning", -// Normal = "normal", -// } - -const crossSigningUserTitles: { [key in E2EState]?: TranslationKey } = { - [E2EState.Warning]: _td("encryption|cross_signing_user_warning"), - [E2EState.Normal]: _td("encryption|cross_signing_user_normal"), - [E2EState.Verified]: _td("encryption|cross_signing_user_verified"), -}; -const crossSigningRoomTitles: { [key in E2EState]?: TranslationKey } = { - [E2EState.Warning]: _td("encryption|cross_signing_room_warning"), - [E2EState.Normal]: _td("encryption|cross_signing_room_normal"), - [E2EState.Verified]: _td("encryption|cross_signing_room_verified"), -}; +import { E2EState, crossSigningUserTitles } from "./E2EIcon"; function getIconFromStatus(status: E2EState | E2EStatus): React.JSX.Element | undefined { switch (status) { @@ -50,60 +29,19 @@ function getIconFromStatus(status: E2EState | E2EStatus): React.JSX.Element | un } interface Props { - className?: string; - size?: number; - onClick?: () => void; - tooltipPlacement?: ComponentProps["placement"]; -} - -interface UserPropsF extends Props { - isUser: true; status: E2EState | E2EStatus; } -interface RoomPropsF extends Props { - isUser?: false; - status: E2EStatus; -} - -const E2EIcon: React.FC> = ({ - isUser, - status, - className, - size, - onClick, - tooltipPlacement, -}) => { - const classes = classNames( - { - mx_E2EIconView: true, - }, - className, - ); - - let style: CSSProperties | undefined; - if (size) { - style = { width: `${size}px`, height: `${size}px` }; - } - - let e2eTitle: TranslationKey | undefined; - if (isUser) { - e2eTitle = crossSigningUserTitles[status]; - } else { - e2eTitle = crossSigningRoomTitles[status]; - } +export const E2EIconView: React.FC = ({ status }) => { + const e2eTitle = crossSigningUserTitles[status]; const label = e2eTitle ? _t(e2eTitle) : ""; const icon = getIconFromStatus(status); if (!icon) return null; return ( - -
- {icon} -
+ +
{icon}
 ); }; - -export default E2EIcon; diff --git a/src/components/views/rooms/MemberListHeaderView.tsx b/src/components/views/rooms/MemberListHeaderView.tsx index c8ff436a00..998fe28105 100644 --- a/src/components/views/rooms/MemberListHeaderView.tsx +++ b/src/components/views/rooms/MemberListHeaderView.tsx @@ -1,18 +1,10 @@ /* -Copyright 2024 The Matrix.org Foundation C.I.C. +Copyright 2024 New Vector Ltd. -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. +SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only +Please see LICENSE files in the repository root for full details. */ + import { Search, Text, Button, Tooltip, InlineSpinner } from "@vector-im/compound-web"; import React from "react"; import InviteIcon from "@vector-im/compound-design-tokens/assets/web/icons/user-add-solid"; @@ -22,10 +14,6 @@ import { Flex } from "../../utils/Flex"; import { MemberListViewState } from "../../viewmodels/MemberListViewModel"; import { _t } from "../../../languageHandler"; -interface Props { - vm: MemberListViewState; -} - interface TooltipProps { canInvite: boolean; children: React.ReactNode; @@ -37,6 +25,10 @@ const OptionalTooltip: React.FC = ({ canInvite, children }) => { return {children}; }; +interface Props { + vm: MemberListViewState; +} + const InviteButton: React.FC = ({ vm }) => { const shouldShowInvite = vm.shouldShowInvite; const shouldShowSearch = vm.shouldShowSearch; @@ -104,12 +96,6 @@ function getHeaderLabelJSX(vm: MemberListViewState): React.ReactNode { return _t("member_list|count", { count: filteredMemberCount }); } -/** - * The top section of the memberlist contains: - * - Just an invite button if the number of members < 20 - * - Search bar + invite button if number of members > 20 - * - A header label, see function above. - */ const MemberListHeaderView: React.FC = (props: Props) => { const vm = props.vm; diff --git a/src/components/views/rooms/MemberListView.tsx b/src/components/views/rooms/MemberListView.tsx index 954ceee759..00eed11302 100644 --- a/src/components/views/rooms/MemberListView.tsx +++ b/src/components/views/rooms/MemberListView.tsx @@ -1,17 +1,8 @@ /* -Copyright 2024 The Matrix.org Foundation C.I.C. +Copyright 2024 New Vector Ltd. -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. +SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only +Please see LICENSE files in the repository root for full details. */ import { Form } from "@vector-im/compound-web"; diff --git a/src/components/views/rooms/MemberTileView.tsx b/src/components/views/rooms/MemberTileView.tsx index 94919c16e0..98d2f8cd51 100644 --- a/src/components/views/rooms/MemberTileView.tsx +++ b/src/components/views/rooms/MemberTileView.tsx @@ -1,18 +1,8 @@ /* -Copyright 2015, 2016 OpenMarket Ltd -Copyright 2019, 2020 The Matrix.org Foundation C.I.C. +Copyright 2024 New Vector Ltd. -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. +SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only +Please see LICENSE files in the repository root for full details. */ import React from "react"; @@ -20,7 +10,7 @@ import React from "react"; import DisambiguatedProfile from "../messages/DisambiguatedProfile"; import { RoomMember } from "../../../models/rooms/RoomMember"; import { useThreePidTileViewModel, useMemberTileViewModel } from "../../viewmodels/MemberTileViewModel"; -import E2EIcon from "./E2EIconView"; +import { E2EIconView } from "./E2EIconView"; import AvatarPresenceIconView from "./PresenceIconView"; import AccessibleButton from "../elements/AccessibleButton"; import { ThreePIDInvite } from "../../../models/rooms/ThreePIDInvite"; @@ -101,7 +91,7 @@ export function RoomMemberTileView(props: IProps): JSX.Element { let e2eIcon; if (vm.e2eStatus) { - e2eIcon = ; + e2eIcon = ; } return ( diff --git a/src/components/views/rooms/OverflowTileView.tsx b/src/components/views/rooms/OverflowTileView.tsx index d027214dfe..ea9eba6f4c 100644 --- a/src/components/views/rooms/OverflowTileView.tsx +++ b/src/components/views/rooms/OverflowTileView.tsx @@ -6,8 +6,7 @@ Please see LICENSE files in the repository root for full details. */ import React from "react"; -// eslint-disable-next-line no-restricted-imports -import OverflowHorizontalSvg from "@vector-im/compound-design-tokens/icons/overflow-horizontal.svg"; +import Icon from "@vector-im/compound-design-tokens/assets/web/icons/overflow-horizontal"; import { _t } from "../../../languageHandler"; import AccessibleButton from "../elements/AccessibleButton"; @@ -18,15 +17,16 @@ interface Props { onClick(): void; } -const OverflowTileView: React.FC = ({ remaining, onClick }) => { +/** + * @deprecated Only used in ForwardDialog component; newer designs have moved away from this. + */ +export const OverflowTileView: React.FC = ({ remaining, onClick }) => { return (
- overflow icon +
{_t("common|and_n_others", { count: remaining })}
 ); }; - -export default OverflowTileView; diff --git a/src/components/views/rooms/PresenceIconView.tsx b/src/components/views/rooms/PresenceIconView.tsx index 6b338859d8..18aaa13a23 100644 --- a/src/components/views/rooms/PresenceIconView.tsx +++ b/src/components/views/rooms/PresenceIconView.tsx @@ -1,7 +1,5 @@ /* Copyright 2024 New Vector Ltd. -Copyright 2020 The Matrix.org Foundation C.I.C. -Copyright 2019 New Vector Ltd SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only Please see LICENSE files in the repository root for full details. diff --git a/src/models/rooms/PresenceState.ts b/src/models/rooms/PresenceState.ts index 878d63a745..05ecba2e35 100644 --- a/src/models/rooms/PresenceState.ts +++ b/src/models/rooms/PresenceState.ts @@ -1,17 +1,8 @@ /* -Copyright 2024 The Matrix.org Foundation C.I.C. +Copyright 2024 New Vector Ltd. -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. +SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only +Please see LICENSE files in the repository root for full details. */ export type PresenceState = "offline" | "online" | "unavailable" | "io.element.unreachable"; diff --git a/src/models/rooms/RoomMember.ts b/src/models/rooms/RoomMember.ts index 804c483ef1..9007e78264 100644 --- a/src/models/rooms/RoomMember.ts +++ b/src/models/rooms/RoomMember.ts @@ -1,20 +1,11 @@ /* -Copyright 2024 The Matrix.org Foundation C.I.C. +Copyright 2024 New Vector Ltd. -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. +SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only +Please see LICENSE files in the repository root for full details. */ -export type PresenceState = "offline" | "online" | "unavailable" | "io.element.unreachable"; +import { PresenceState } from "./PresenceState"; export type RoomMember = { roomId: string; diff --git a/src/models/rooms/ThreePIDInvite.ts b/src/models/rooms/ThreePIDInvite.ts index 59093c64bd..84f5a87cbe 100644 --- a/src/models/rooms/ThreePIDInvite.ts +++ b/src/models/rooms/ThreePIDInvite.ts @@ -1,21 +1,12 @@ /* -Copyright 2024 The Matrix.org Foundation C.I.C. +Copyright 2024 New Vector Ltd. -Licensed under the Apache License, Version 2.0 (the "License"); -you may not use this file except in compliance with the License. -You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - -Unless required by applicable law or agreed to in writing, software -distributed under the License is distributed on an "AS IS" BASIS, -WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. -See the License for the specific language governing permissions and -limitations under the License. +SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only +Please see LICENSE files in the repository root for full details. */ + import { MatrixEvent } from "matrix-js-sdk/src/matrix"; export type ThreePIDInvite = { - displayName: string; event: MatrixEvent; }; diff --git a/test/unit-tests/components/views/rooms/memberlist/__snapshots__/MemberTileView-test.tsx.snap b/test/unit-tests/components/views/rooms/memberlist/__snapshots__/MemberTileView-test.tsx.snap index 4245e0f091..6feb72ea62 100644 --- a/test/unit-tests/components/views/rooms/memberlist/__snapshots__/MemberTileView-test.tsx.snap +++ b/test/unit-tests/components/views/rooms/memberlist/__snapshots__/MemberTileView-test.tsx.snap @@ -46,27 +46,23 @@ exports[`MemberTileView RoomMemberTileView should display an verified E2EIcon wh
- -
- - - -
- + + +
@@ -119,27 +115,23 @@ exports[`MemberTileView RoomMemberTileView should display an warning E2EIcon whe
- -
- - - -
- + + +