nikrozman/element-web
1
0
Fork 0
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Code review changes

Browse Source
This commit is contained in:
R Midhun Suresh
2024-12-31 14:58:23 +05:30
parent 677f0694c7
commit 207551b0b7
24 changed files with 174 additions and 294 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
res/css/_components.pcss
View File

@@ -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";

1
res/css/views/messages/_DisambiguatedProfile.pcss
View File

@@ -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;

1
res/css/views/rooms/_MemberListHeaderView.pcss
View File

@@ -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.

1
res/css/views/rooms/_MemberListView.pcss
View File

@@ -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.

9
res/css/views/rooms/_MemberTileView.pcss
View File

@@ -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 {

9
res/css/views/rooms/_OverflowTile.pcss
View File

@@ -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;

32
res/css/views/rooms/_PresenceIconView.pcss Normal file
View File

@@ -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);
}
}

26
res/css/views/rooms/_PresenceLabel.pcss
View File

@@ -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);
}
}

1
src/components/structures/RightPanel.tsx
View File

@@ -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";

78
src/components/viewmodels/MemberListViewModel.tsx
View File

@@ -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<Map<string, Member>>(new Map());
const [memberCount, setMemberCount] = useState<number>(0);
const searchQuery = useRef("");
const [isLoading, setIsLoading] = useState<boolean>(true);
// This is the last known total number of members in this room.
const totalMemberCount = useRef<number>(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,
};
}

18
src/components/viewmodels/MemberTileViewModel.tsx
View File

@@ -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,

2
src/components/views/dialogs/ForwardDialog.tsx
View File

@@ -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;

4
src/components/views/messages/DisambiguatedProfile.tsx
View File

@@ -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;

13
src/components/views/rooms/E2EIcon.tsx
View File

@@ -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<XOR<UserProps, RoomProps>> = ({
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;

76
src/components/views/rooms/E2EIconView.tsx
View File

@@ -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<typeof Tooltip>["placement"];
}
interface UserPropsF extends Props {
isUser: true;
status: E2EState | E2EStatus;
}
interface RoomPropsF extends Props {
isUser?: false;
status: E2EStatus;
}
const E2EIcon: React.FC<XOR<UserPropsF, RoomPropsF>> = ({
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<Props> = ({ status }) => {
const e2eTitle = crossSigningUserTitles[status];
const label = e2eTitle ? _t(e2eTitle) : "";
const icon = getIconFromStatus(status);
if (!icon) return null;
return (
<Tooltip label={label} placement={tooltipPlacement} isTriggerInteractive={!!onClick}>
<div className={classes} style={style}>
{icon}
</div>
<Tooltip label={label}>
<div className="mx_E2EIconView">{icon}</div>
</Tooltip>
);
};
export default E2EIcon;

30
src/components/views/rooms/MemberListHeaderView.tsx
View File

@@ -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<TooltipProps> = ({ canInvite, children }) => {
return <Tooltip description={_t("member_list|invite_button_no_perms_tooltip")}>{children}</Tooltip>;
};
interface Props {
vm: MemberListViewState;
}
const InviteButton: React.FC<Props> = ({ 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: Props) => {
const vm = props.vm;

15
src/components/views/rooms/MemberListView.tsx
View File

@@ -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";

20
src/components/views/rooms/MemberTileView.tsx
View File

@@ -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 isUser={true} status={vm.e2eStatus} />;
e2eIcon = <E2EIconView status={vm.e2eStatus} />;
}
return (

12
src/components/views/rooms/OverflowTileView.tsx
View File

@@ -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<Props> = ({ remaining, onClick }) => {
/**
* @deprecated Only used in ForwardDialog component; newer designs have moved away from this.
*/
export const OverflowTileView: React.FC<Props> = ({ remaining, onClick }) => {
return (
<AccessibleButton onClick={onClick} className="mx_OverflowTileView">
<div className="mx_OverflowTileView_icon">
<img src={OverflowHorizontalSvg} height="36px" width="36px" alt="overflow icon" />
<Icon height="36px" width="36px" />
</div>
<div className="mx_OverflowTileView_text">{_t("common|and_n_others", { count: remaining })}</div>
</AccessibleButton>
);
};
export default OverflowTileView;

2
src/components/views/rooms/PresenceIconView.tsx
View File

@@ -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.

15
src/models/rooms/PresenceState.ts
View File

@@ -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";

17
src/models/rooms/RoomMember.ts
View File

@@ -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;

17
src/models/rooms/ThreePIDInvite.ts
View File

@@ -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;
};

68
test/unit-tests/components/views/rooms/memberlist/__snapshots__/MemberTileView-test.tsx.snap
View File

@@ -46,27 +46,23 @@ exports[`MemberTileView RoomMemberTileView should display an verified E2EIcon wh
<div
class="mx_MemberTileView_right"
>
<span
tabindex="0"
<div
aria-labelledby=":ri:"
class="mx_E2EIconView"
>
<div
aria-labelledby=":ri:"
class="mx_E2EIconView"
<svg
class="mx_E2EIconView_verified"
fill="currentColor"
height="16px"
viewBox="0 0 24 24"
width="16px"
xmlns="http://www.w3.org/2000/svg"
>
<svg
class="mx_E2EIconView_verified"
fill="currentColor"
height="16px"
viewBox="0 0 24 24"
width="16px"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M8.15 21.75 6.7 19.3l-2.75-.6a.943.943 0 0 1-.6-.387.928.928 0 0 1-.175-.688L3.45 14.8l-1.875-2.15a.934.934 0 0 1-.25-.65c0-.25.083-.467.25-.65L3.45 9.2l-.275-2.825a.928.928 0 0 1 .175-.688.943.943 0 0 1 .6-.387l2.75-.6 1.45-2.45a.983.983 0 0 1 .55-.438.97.97 0 0 1 .7.038l2.6 1.1 2.6-1.1a.97.97 0 0 1 .7-.038.983.983 0 0 1 .55.438L17.3 4.7l2.75.6c.25.05.45.18.6.388.15.208.208.437.175.687L20.55 9.2l1.875 2.15c.167.183.25.4.25.65s-.083.467-.25.65L20.55 14.8l.275 2.825a.928.928 0 0 1-.175.688.943.943 0 0 1-.6.387l-2.75.6-1.45 2.45a.983.983 0 0 1-.55.438.97.97 0 0 1-.7-.038l-2.6-1.1-2.6 1.1a.97.97 0 0 1-.7.038.983.983 0 0 1-.55-.438Zm2.8-9.05L9.5 11.275A.933.933 0 0 0 8.813 11c-.275 0-.513.1-.713.3a.948.948 0 0 0-.275.7.95.95 0 0 0 .275.7l2.15 2.15c.2.2.433.3.7.3.267 0 .5-.1.7-.3l4.25-4.25c.2-.2.296-.433.287-.7a1.055 1.055 0 0 0-.287-.7 1.02 1.02 0 0 0-.713-.313.93.93 0 0 0-.712.288L10.95 12.7Z"
/>
</svg>
</div>
</span>
<path
d="M8.15 21.75 6.7 19.3l-2.75-.6a.943.943 0 0 1-.6-.387.928.928 0 0 1-.175-.688L3.45 14.8l-1.875-2.15a.934.934 0 0 1-.25-.65c0-.25.083-.467.25-.65L3.45 9.2l-.275-2.825a.928.928 0 0 1 .175-.688.943.943 0 0 1 .6-.387l2.75-.6 1.45-2.45a.983.983 0 0 1 .55-.438.97.97 0 0 1 .7.038l2.6 1.1 2.6-1.1a.97.97 0 0 1 .7-.038.983.983 0 0 1 .55.438L17.3 4.7l2.75.6c.25.05.45.18.6.388.15.208.208.437.175.687L20.55 9.2l1.875 2.15c.167.183.25.4.25.65s-.083.467-.25.65L20.55 14.8l.275 2.825a.928.928 0 0 1-.175.688.943.943 0 0 1-.6.387l-2.75.6-1.45 2.45a.983.983 0 0 1-.55.438.97.97 0 0 1-.7-.038l-2.6-1.1-2.6 1.1a.97.97 0 0 1-.7.038.983.983 0 0 1-.55-.438Zm2.8-9.05L9.5 11.275A.933.933 0 0 0 8.813 11c-.275 0-.513.1-.713.3a.948.948 0 0 0-.275.7.95.95 0 0 0 .275.7l2.15 2.15c.2.2.433.3.7.3.267 0 .5-.1.7-.3l4.25-4.25c.2-.2.296-.433.287-.7a1.055 1.055 0 0 0-.287-.7 1.02 1.02 0 0 0-.713-.313.93.93 0 0 0-.712.288L10.95 12.7Z"
/>
</svg>
</div>
</div>
</div>
</div>
@@ -119,27 +115,23 @@ exports[`MemberTileView RoomMemberTileView should display an warning E2EIcon whe
<div
class="mx_MemberTileView_right"
>
<span
tabindex="0"
<div
aria-labelledby=":r8:"
class="mx_E2EIconView"
>
<div
aria-labelledby=":r8:"
class="mx_E2EIconView"
<svg
class="mx_E2EIconView_warning"
fill="currentColor"
height="16px"
viewBox="0 0 24 24"
width="16px"
xmlns="http://www.w3.org/2000/svg"
>
<svg
class="mx_E2EIconView_warning"
fill="currentColor"
height="16px"
viewBox="0 0 24 24"
width="16px"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M12 17a.97.97 0 0 0 .713-.288A.968.968 0 0 0 13 16a.968.968 0 0 0-.287-.713A.968.968 0 0 0 12 15a.968.968 0 0 0-.713.287A.968.968 0 0 0 11 16c0 .283.096.52.287.712.192.192.43.288.713.288Zm0-4c.283 0 .52-.096.713-.287A.968.968 0 0 0 13 12V8a.967.967 0 0 0-.287-.713A.968.968 0 0 0 12 7a.968.968 0 0 0-.713.287A.967.967 0 0 0 11 8v4c0 .283.096.52.287.713.192.191.43.287.713.287Zm0 9a9.738 9.738 0 0 1-3.9-.788 10.099 10.099 0 0 1-3.175-2.137c-.9-.9-1.612-1.958-2.137-3.175A9.738 9.738 0 0 1 2 12a9.74 9.74 0 0 1 .788-3.9 10.099 10.099 0 0 1 2.137-3.175c.9-.9 1.958-1.612 3.175-2.137A9.738 9.738 0 0 1 12 2a9.74 9.74 0 0 1 3.9.788 10.098 10.098 0 0 1 3.175 2.137c.9.9 1.613 1.958 2.137 3.175A9.738 9.738 0 0 1 22 12a9.738 9.738 0 0 1-.788 3.9 10.098 10.098 0 0 1-2.137 3.175c-.9.9-1.958 1.613-3.175 2.137A9.738 9.738 0 0 1 12 22Z"
/>
</svg>
</div>
</span>
<path
d="M12 17a.97.97 0 0 0 .713-.288A.968.968 0 0 0 13 16a.968.968 0 0 0-.287-.713A.968.968 0 0 0 12 15a.968.968 0 0 0-.713.287A.968.968 0 0 0 11 16c0 .283.096.52.287.712.192.192.43.288.713.288Zm0-4c.283 0 .52-.096.713-.287A.968.968 0 0 0 13 12V8a.967.967 0 0 0-.287-.713A.968.968 0 0 0 12 7a.968.968 0 0 0-.713.287A.967.967 0 0 0 11 8v4c0 .283.096.52.287.713.192.191.43.287.713.287Zm0 9a9.738 9.738 0 0 1-3.9-.788 10.099 10.099 0 0 1-3.175-2.137c-.9-.9-1.612-1.958-2.137-3.175A9.738 9.738 0 0 1 2 12a9.74 9.74 0 0 1 .788-3.9 10.099 10.099 0 0 1 2.137-3.175c.9-.9 1.958-1.612 3.175-2.137A9.738 9.738 0 0 1 12 2a9.74 9.74 0 0 1 3.9.788 10.098 10.098 0 0 1 3.175 2.137c.9.9 1.613 1.958 2.137 3.175A9.738 9.738 0 0 1 22 12a9.738 9.738 0 0 1-.788 3.9 10.098 10.098 0 0 1-2.137 3.175c-.9.9-1.958 1.613-3.175 2.137A9.738 9.738 0 0 1 12 22Z"
/>
</svg>
</div>
</div>
</div>
</div>