Fixed #59 : Consistant channel avatar bg

This commit is contained in:
unknown 2021-08-17 17:04:21 +05:30
parent e95a859ee9
commit d7e3e70430
3 changed files with 5 additions and 3 deletions

View file

@ -13,11 +13,11 @@ function linkifyContent(content) {
} }
function ChannelIntro({ function ChannelIntro({
avatarSrc, name, heading, desc, time, roomId, avatarSrc, name, heading, desc, time,
}) { }) {
return ( return (
<div className="channel-intro"> <div className="channel-intro">
<Avatar imageSrc={avatarSrc} text={name.slice(0, 1)} bgColor={colorMXID(name)} size="large" /> <Avatar imageSrc={avatarSrc} text={name.slice(0, 1)} bgColor={colorMXID(roomId)} size="large" />
<div className="channel-intro__content"> <div className="channel-intro__content">
<Text className="channel-intro__name" variant="h1">{heading}</Text> <Text className="channel-intro__name" variant="h1">{heading}</Text>
<Text className="channel-intro__desc" variant="b1">{linkifyContent(desc)}</Text> <Text className="channel-intro__desc" variant="b1">{linkifyContent(desc)}</Text>
@ -33,6 +33,7 @@ ChannelIntro.defaultProps = {
}; };
ChannelIntro.propTypes = { ChannelIntro.propTypes = {
roomId: PropTypes.string.isRequired,
avatarSrc: PropTypes.oneOfType([ avatarSrc: PropTypes.oneOfType([
PropTypes.string, PropTypes.string,
PropTypes.bool, PropTypes.bool,

View file

@ -127,6 +127,7 @@ function genChannelIntro(mEvent, roomTimeline) {
return ( return (
<ChannelIntro <ChannelIntro
key={mEvent ? mEvent.getId() : Math.random().toString(20).substr(2, 6)} key={mEvent ? mEvent.getId() : Math.random().toString(20).substr(2, 6)}
roomId={roomTimeline.roomId}
avatarSrc={avatarSrc} avatarSrc={avatarSrc}
name={roomTimeline.room.name} name={roomTimeline.room.name}
heading={`Welcome to ${roomTimeline.room.name}`} heading={`Welcome to ${roomTimeline.room.name}`}

View file

@ -27,7 +27,7 @@ function ChannelViewHeader({ roomId }) {
return ( return (
<Header> <Header>
<Avatar imageSrc={avatarSrc} text={roomName.slice(0, 1)} bgColor={colorMXID(roomName)} size="small" /> <Avatar imageSrc={avatarSrc} text={roomName.slice(0, 1)} bgColor={colorMXID(roomId)} size="small" />
<TitleWrapper> <TitleWrapper>
<Text variant="h2">{roomName}</Text> <Text variant="h2">{roomName}</Text>
{ typeof roomTopic !== 'undefined' && <p title={roomTopic} className="text text-b3">{roomTopic}</p>} { typeof roomTopic !== 'undefined' && <p title={roomTopic} className="text text-b3">{roomTopic}</p>}