From e3ec00bcdf8d08aacf721cbaf5090c4282921adb Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Tue, 14 Sep 2021 14:35:33 +0100 Subject: [PATCH 1/4] Fix space create menu eating first character of name in private space creation --- src/components/views/spaces/SpaceCreateMenu.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/views/spaces/SpaceCreateMenu.tsx b/src/components/views/spaces/SpaceCreateMenu.tsx index 2028e66625..c09b26e45f 100644 --- a/src/components/views/spaces/SpaceCreateMenu.tsx +++ b/src/components/views/spaces/SpaceCreateMenu.tsx @@ -177,7 +177,7 @@ export const SpaceCreateForm: React.FC = ({ const newName = ev.target.value; if (!alias || alias === `#${nameToLocalpart(name)}:${domain}`) { setAlias(`#${nameToLocalpart(newName)}:${domain}`); - aliasFieldRef.current.validate({ allowEmpty: true }); + aliasFieldRef.current?.validate({ allowEmpty: true }); } setName(newName); }} From e37f6b96d714bc52ff89d5384c24f7fbd621a596 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Tue, 14 Sep 2021 14:36:11 +0100 Subject: [PATCH 2/4] Fix RoomTile subscribing to wrong event emitter for room name --- src/components/views/rooms/RoomTile.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/views/rooms/RoomTile.tsx b/src/components/views/rooms/RoomTile.tsx index 8ed2ca85e9..970915d653 100644 --- a/src/components/views/rooms/RoomTile.tsx +++ b/src/components/views/rooms/RoomTile.tsx @@ -101,7 +101,7 @@ export default class RoomTile extends React.PureComponent { this.roomProps = EchoChamber.forRoom(this.props.room); } - private onRoomNameUpdate = (room) => { + private onRoomNameUpdate = (room: Room) => { this.forceUpdate(); }; @@ -164,7 +164,7 @@ export default class RoomTile extends React.PureComponent { ); this.notificationState.on(NOTIFICATION_STATE_UPDATE, this.onNotificationUpdate); this.roomProps.on(PROPERTY_UPDATED, this.onRoomPropertyUpdate); - this.roomProps.on("Room.name", this.onRoomNameUpdate); + this.props.room?.on("Room.name", this.onRoomNameUpdate); CommunityPrototypeStore.instance.on( CommunityPrototypeStore.getUpdateEventName(this.props.room.roomId), this.onCommunityUpdate, From 5048e41e8b64f9a5d315499565cbf90884f9e05b Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Tue, 14 Sep 2021 14:41:51 +0100 Subject: [PATCH 3/4] Space Hierarchy react to known local rooms changing names --- src/components/structures/SpaceHierarchy.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/components/structures/SpaceHierarchy.tsx b/src/components/structures/SpaceHierarchy.tsx index a0d4d9c42a..09099032dc 100644 --- a/src/components/structures/SpaceHierarchy.tsx +++ b/src/components/structures/SpaceHierarchy.tsx @@ -57,6 +57,7 @@ import { Key } from "../../Keyboard"; import { IState, RovingTabIndexProvider, useRovingTabIndex } from "../../accessibility/RovingTabIndex"; import { getDisplayAliasForRoom } from "./RoomDirectory"; import MatrixClientContext from "../../contexts/MatrixClientContext"; +import { useEventEmitterState } from "../../hooks/useEventEmitter"; interface IProps { space: Room; @@ -87,7 +88,8 @@ const Tile: React.FC = ({ }) => { const cli = useContext(MatrixClientContext); const joinedRoom = cli.getRoom(room.room_id)?.getMyMembership() === "join" ? cli.getRoom(room.room_id) : null; - const name = joinedRoom?.name || room.name || room.canonical_alias || room.aliases?.[0] + const joinedRoomName = useEventEmitterState(joinedRoom, "Room.name", room => room?.name); + const name = joinedRoomName || room.name || room.canonical_alias || room.aliases?.[0] || (room.room_type === RoomType.Space ? _t("Unnamed Space") : _t("Unnamed Room")); const [showChildren, toggleShowChildren] = useStateToggle(true); From f59baf1efb1c40a95724ad20b858baae2a46d528 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Tue, 14 Sep 2021 14:41:55 +0100 Subject: [PATCH 4/4] Tidy some types --- src/hooks/useEventEmitter.ts | 12 ++++++++++-- src/hooks/useRoomState.ts | 2 +- 2 files changed, 11 insertions(+), 3 deletions(-) diff --git a/src/hooks/useEventEmitter.ts b/src/hooks/useEventEmitter.ts index 74b23f0198..693eebc0e3 100644 --- a/src/hooks/useEventEmitter.ts +++ b/src/hooks/useEventEmitter.ts @@ -20,7 +20,11 @@ import type { EventEmitter } from "events"; type Handler = (...args: any[]) => void; // Hook to wrap event emitter on and removeListener in hook lifecycle -export const useEventEmitter = (emitter: EventEmitter, eventName: string | symbol, handler: Handler) => { +export const useEventEmitter = ( + emitter: EventEmitter | undefined, + eventName: string | symbol, + handler: Handler, +) => { // Create a ref that stores handler const savedHandler = useRef(handler); @@ -51,7 +55,11 @@ export const useEventEmitter = (emitter: EventEmitter, eventName: string | symbo type Mapper = (...args: any[]) => T; -export const useEventEmitterState = (emitter: EventEmitter, eventName: string | symbol, fn: Mapper): T => { +export const useEventEmitterState = ( + emitter: EventEmitter | undefined, + eventName: string | symbol, + fn: Mapper, +): T => { const [value, setValue] = useState(fn()); const handler = useCallback((...args: any[]) => { setValue(fn(...args)); diff --git a/src/hooks/useRoomState.ts b/src/hooks/useRoomState.ts index e778acf8a9..89c94df10b 100644 --- a/src/hooks/useRoomState.ts +++ b/src/hooks/useRoomState.ts @@ -25,7 +25,7 @@ const defaultMapper: Mapper = (roomState: RoomState) => roomState; // Hook to simplify watching Matrix Room state export const useRoomState = ( - room: Room, + room?: Room, mapper: Mapper = defaultMapper as Mapper, ): T => { const [value, setValue] = useState(room ? mapper(room.currentState) : undefined);