diff --git a/res/themes/superhero/img/icons/community-room.svg b/res/themes/superhero/img/icons/community-room.svg new file mode 100644 index 0000000000..887fc83c37 --- /dev/null +++ b/res/themes/superhero/img/icons/community-room.svg @@ -0,0 +1,6 @@ + + + + diff --git a/res/welcome.html b/res/welcome.html index 6014cc4d49..7d812da14b 100644 --- a/res/welcome.html +++ b/res/welcome.html @@ -171,7 +171,6 @@ we don't have an account and should hide them. No account == no guest account ei

_t("welcome_to_superhero")

-

_t("powered_by_matrix_with_logo")

diff --git a/src/components/views/elements/RoomName.tsx b/src/components/views/elements/RoomName.tsx index 39a11df23c..d7c1859690 100644 --- a/src/components/views/elements/RoomName.tsx +++ b/src/components/views/elements/RoomName.tsx @@ -18,6 +18,7 @@ import { IPublicRoomsChunkRoom, Room } from "matrix-js-sdk/src/matrix"; import React, { useCallback, useMemo } from "react"; import { Icon as TokenGatedRoomIcon } from "../../../../res/themes/superhero/img/icons/tokengated-room.svg"; +import { Icon as CommunityRoomIcon } from "../../../../res/themes/superhero/img/icons/community-room.svg"; import { useRoomName } from "../../../hooks/useRoomName"; import { useVerifiedRoom } from "../../../hooks/useVerifiedRoom"; import { UserVerifiedBadge } from "./UserVerifiedBadge"; @@ -30,7 +31,7 @@ interface IProps { export const RoomName = ({ room, children, maxLength }: IProps): JSX.Element => { const roomName = useRoomName(room); - const isVerifiedRoom = useVerifiedRoom(room); + const { isTokenGatedRoom, isCommunityRoom } = useVerifiedRoom(room); const roomUsers: string[] = useMemo(() => { return ( @@ -51,12 +52,13 @@ export const RoomName = ({ room, children, maxLength }: IProps): JSX.Element => const renderRoomName = useCallback( () => ( - {isVerifiedRoom && } + {isCommunityRoom && } + {isTokenGatedRoom && } {truncatedRoomName} {roomUsers?.length && } ), - [truncatedRoomName, isVerifiedRoom, roomUsers], + [truncatedRoomName, isCommunityRoom, isTokenGatedRoom, roomUsers], ); if (children) return children(renderRoomName()); diff --git a/src/hooks/useRoomName.ts b/src/hooks/useRoomName.ts index 2bc1a48b61..ced2c4ba05 100644 --- a/src/hooks/useRoomName.ts +++ b/src/hooks/useRoomName.ts @@ -10,7 +10,7 @@ import { useMemo } from "react"; * @returns {string} */ export function getSafeRoomName(roomName?: string): string { - return roomName?.replace(/^(\s|\[TG\])*/, "") || ""; + return roomName?.replace(/^(\s|\[TG\])*/, "").replace(/^(\s|\$)*/, "") || ""; } /** diff --git a/src/hooks/useVerifiedRoom.ts b/src/hooks/useVerifiedRoom.ts index 32fd1d29b1..9b9cffe7de 100644 --- a/src/hooks/useVerifiedRoom.ts +++ b/src/hooks/useVerifiedRoom.ts @@ -1,24 +1,24 @@ import { IPublicRoomsChunkRoom, Room } from "matrix-js-sdk/src/matrix"; import { useMemo } from "react"; -/** - * Determines if a room is a token gated room - * @param room - The room model - * @returns {boolean} true if the room is token gated - */ -export function isTokenGatedRoom(room?: Room | IPublicRoomsChunkRoom): boolean { - return !!room?.name?.startsWith("[TG]"); -} - /** * Custom hook to check if a room is verified * @param room - The room model - * @returns {boolean} true if the room is verified, false otherwise */ -export function useVerifiedRoom(room?: Room | IPublicRoomsChunkRoom): boolean { - const isVerifiedRoom = useMemo(() => { - return isTokenGatedRoom(room); +export function useVerifiedRoom(room?: Room | IPublicRoomsChunkRoom): { + isTokenGatedRoom: boolean; + isCommunityRoom: boolean; +} { + const isTokenGatedRoom = useMemo(() => { + return !!room?.name?.startsWith("[TG]"); }, [room]); - return isVerifiedRoom; + const isCommunityRoom = useMemo(() => { + return !!room?.name?.startsWith("$"); + }, [room]); + + return { + isTokenGatedRoom, + isCommunityRoom, + }; }