n/nyxmuks
1
0
Fork 0
forked from Mirrors/gomuks
Code Pull requests Activity

web/api: add helper for getting room avatar url

Browse source
This commit is contained in:
Tulir Asokan 2024-11-27 01:12:52 +02:00
parent a0ab756562
commit f4020f588f
3 changed files with 17 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
web/src/api/media.ts
View file

@ -13,8 +13,9 @@
// //
// You should have received a copy of the GNU Affero General Public License // You should have received a copy of the GNU Affero General Public License
// along with this program. If not, see <https://www.gnu.org/licenses/>. // along with this program. If not, see <https://www.gnu.org/licenses/>.
import type { RoomListEntry } from "@/api/statestore"
import { parseMXC } from "@/util/validation.ts" import { parseMXC } from "@/util/validation.ts"
import { UserID, UserProfile } from "./types" import { ContentURI, DBRoom, UserID, UserProfile } from "./types"
export const getMediaURL = (mxc?: string, encrypted: boolean = false): string | undefined => { export const getMediaURL = (mxc?: string, encrypted: boolean = false): string | undefined => {
const [server, mediaID] = parseMXC(mxc) const [server, mediaID] = parseMXC(mxc)
@ -88,3 +89,14 @@ export const getAvatarURL = (userID: UserID, content?: UserProfile | null): stri
const fallback = `${backgroundColor}:${fallbackCharacter}` const fallback = `${backgroundColor}:${fallbackCharacter}`
return `_gomuks/media/${server}/${mediaID}?encrypted=false&fallback=${encodeURIComponent(fallback)}` return `_gomuks/media/${server}/${mediaID}?encrypted=false&fallback=${encodeURIComponent(fallback)}`
} }
export const getRoomAvatarURL = (room: DBRoom | RoomListEntry, avatarOverride?: ContentURI): string | undefined => {
let dmUserID: UserID | undefined
if ("dm_user_id" in room) {
dmUserID = room.dm_user_id
} else if ("lazy_load_summary" in room) {
dmUserID = room.lazy_load_summary?.heroes?.length === 1
? room.lazy_load_summary.heroes[0] : undefined
}
return getAvatarURL(dmUserID ?? room.room_id, { displayname: room.name, avatar_url: avatarOverride ?? room.avatar })
}

4
web/src/ui/roomlist/Entry.tsx
View file

@ -14,7 +14,7 @@
// You should have received a copy of the GNU Affero General Public License // You should have received a copy of the GNU Affero General Public License
// along with this program. If not, see <https://www.gnu.org/licenses/>. // along with this program. If not, see <https://www.gnu.org/licenses/>.
import { memo, use } from "react" import { memo, use } from "react"
import { getAvatarURL } from "@/api/media.ts" import { getRoomAvatarURL } from "@/api/media.ts"
import type { RoomListEntry } from "@/api/statestore" import type { RoomListEntry } from "@/api/statestore"
import type { MemDBEvent, MemberEventContent } from "@/api/types" import type { MemDBEvent, MemberEventContent } from "@/api/types"
import useContentVisibility from "@/util/contentvisibility.ts" import useContentVisibility from "@/util/contentvisibility.ts"
@ -60,7 +60,7 @@ const EntryInner = ({ room }: InnerProps) => {
<img <img
loading="lazy" loading="lazy"
className="avatar room-avatar" className="avatar room-avatar"
src={getAvatarURL(room.dm_user_id ?? room.room_id, { avatar_url: room.avatar, displayname: room.name })} src={getRoomAvatarURL(room)}
alt="" alt=""
/> />
</div> </div>

6
web/src/ui/roomview/RoomViewHeader.tsx
View file

@ -14,7 +14,7 @@
// You should have received a copy of the GNU Affero General Public License // You should have received a copy of the GNU Affero General Public License
// along with this program. If not, see <https://www.gnu.org/licenses/>. // along with this program. If not, see <https://www.gnu.org/licenses/>.
import { use, useCallback } from "react" import { use, useCallback } from "react"
import { getAvatarURL } from "@/api/media.ts" import { getRoomAvatarURL } from "@/api/media.ts"
import { RoomStateStore } from "@/api/statestore" import { RoomStateStore } from "@/api/statestore"
import { useEventAsState } from "@/util/eventdispatcher.ts" import { useEventAsState } from "@/util/eventdispatcher.ts"
import MainScreenContext from "../MainScreenContext.ts" import MainScreenContext from "../MainScreenContext.ts"
@ -33,8 +33,6 @@ interface RoomViewHeaderProps {
const RoomViewHeader = ({ room }: RoomViewHeaderProps) => { const RoomViewHeader = ({ room }: RoomViewHeaderProps) => {
const roomMeta = useEventAsState(room.meta) const roomMeta = useEventAsState(room.meta)
const avatarSourceID = roomMeta.lazy_load_summary?.heroes?.length === 1
? roomMeta.lazy_load_summary.heroes[0] : room.roomID
const mainScreen = use(MainScreenContext) const mainScreen = use(MainScreenContext)
const openModal = use(ModalContext) const openModal = use(ModalContext)
const openSettings = useCallback(() => { const openSettings = useCallback(() => {
@ -50,7 +48,7 @@ const RoomViewHeader = ({ room }: RoomViewHeaderProps) => {
<img <img
className="avatar" className="avatar"
loading="lazy" loading="lazy"
src={getAvatarURL(avatarSourceID, { avatar_url: roomMeta.avatar, displayname: roomMeta.name })} src={getRoomAvatarURL(roomMeta)}
onClick={use(LightboxContext)} onClick={use(LightboxContext)}
alt="" alt=""
/> />