Add separate icon for public rooms and spaces

Signed-off-by: Ajay Bura <ajbura@gmail.com>
This commit is contained in:
Ajay Bura 2021-12-26 11:26:41 +05:30
parent 7c368ae029
commit 07b1fe8e47
3 changed files with 39 additions and 3 deletions

View file

@ -0,0 +1,14 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
<g>
<polygon points="16,12 14,12 14,14 10,14 10,10 12,10 12,8 10,8 10,3 8,3 8,8 3,8 3,10 8,10 8,14 3,14 3,16 8,16 8,21 10,21 10,16
14,16 14,21 16,21 16,16 21,16 21,14 16,14 "/>
<path d="M18.5,1C16,1,14,3,14,5.5s2,4.5,4.5,4.5S23,8,23,5.5S21,1,18.5,1z M17.5,7C17.5,7,17.5,7,17.5,7c-0.2-0.1-0.3-0.1-0.3-0.2
c-0.6-0.5-1.7-1.1-1.8-2c-0.1-0.7,0.8-1.6,1.3-2c0.8-0.6,2.3-1.1,3.2-0.5c0.6,0.4-1.2,1-1.4,1.3c-0.3,0.4-0.3,0.9-0.3,1.4
c0,0.5,0.1,1.2-0.2,1.6C17.9,6.9,17.7,7,17.5,7z M20.8,7.9c-0.4,0.3-0.9,0.2-1.3,0.5c-0.1,0.1-0.2,0.2-0.3,0.2
c-0.2,0.1-0.5-0.1-0.5-0.3c-0.3-0.8,0.3-1.2,0.9-1.3c0.3,0,0.7,0,1,0c0.2,0,0.4,0.1,0.4,0.3C21.1,7.5,20.9,7.7,20.8,7.9z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.1 KiB

View file

@ -0,0 +1,15 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 18.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
<g>
<path d="M15.4,13.7L14,14l-0.2,1.4c-0.4,2.8-1.3,4.2-1.7,4.6c-0.4-0.3-1.3-1.8-1.7-4.6L10,14l-1.4-0.2c-2.8-0.4-4.2-1.3-4.6-1.7
c0.3-0.4,1.8-1.3,4.6-1.7L10,10l0.2-1.4c0.4-2.8,1.3-4.2,1.7-4.6V2c-1.7,0-3.1,2.6-3.7,6.3C4.6,8.9,2,10.3,2,12s2.6,3.1,6.3,3.7
c0.6,3.7,2,6.3,3.7,6.3s3.1-2.6,3.7-6.3c3.7-0.6,6.3-2,6.3-3.7h-2.1C19.6,12.4,18.2,13.3,15.4,13.7z"/>
<path d="M18.5,1C16,1,14,3,14,5.5s2,4.5,4.5,4.5S23,8,23,5.5S21,1,18.5,1z M17.5,7C17.5,7,17.5,7,17.5,7c-0.2-0.1-0.3-0.1-0.3-0.2
c-0.6-0.5-1.7-1.1-1.8-2c-0.1-0.7,0.8-1.6,1.3-2c0.8-0.6,2.3-1.1,3.2-0.5c0.6,0.4-1.2,1-1.4,1.3c-0.3,0.4-0.3,0.9-0.3,1.4
c0,0.5,0.1,1.2-0.2,1.6C17.9,6.9,17.7,7,17.5,7z M20.8,7.9c-0.4,0.3-0.9,0.2-1.3,0.5c-0.1,0.1-0.2,0.2-0.3,0.2
c-0.2,0.1-0.5-0.1-0.5-0.3c-0.3-0.8,0.3-1.2,0.9-1.3c0.3,0,0.7,0,1,0c0.2,0,0.4,0.1,0.4,0.3C21.1,7.5,20.9,7.7,20.8,7.9z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

View file

@ -12,8 +12,10 @@ import IconButton from '../../atoms/button/IconButton';
import RoomSelector from '../../molecules/room-selector/RoomSelector';
import HashIC from '../../../../public/res/ic/outlined/hash.svg';
import HashGlobeIC from '../../../../public/res/ic/outlined/hash-globe.svg';
import HashLockIC from '../../../../public/res/ic/outlined/hash-lock.svg';
import SpaceIC from '../../../../public/res/ic/outlined/space.svg';
import SpaceGlobeIC from '../../../../public/res/ic/outlined/space-globe.svg';
import SpaceLockIC from '../../../../public/res/ic/outlined/space-lock.svg';
import PinIC from '../../../../public/res/ic/outlined/pin.svg';
import PinFilledIC from '../../../../public/res/ic/filled/pin.svg';
@ -47,13 +49,19 @@ function Selector({
};
}, []);
const joinRuleToIconSrc = {
restricted: () => (room.isSpaceRoom() ? SpaceIC : HashIC),
invite: () => (room.isSpaceRoom() ? SpaceLockIC : HashLockIC),
public: () => (room.isSpaceRoom() ? SpaceGlobeIC : HashGlobeIC),
};
if (room.isSpaceRoom()) {
return (
<RoomSelector
key={roomId}
name={room.name}
roomId={roomId}
iconSrc={room.getJoinRule() === 'invite' ? SpaceLockIC : SpaceIC}
iconSrc={joinRuleToIconSrc[room.getJoinRule()]?.() || null}
isUnread={noti.hasNoti(roomId)}
notificationCount={abbreviateNumber(noti.getTotalNoti(roomId))}
isAlert={noti.getHighlightNoti(roomId) !== 0}
@ -82,8 +90,7 @@ function Selector({
name={room.name}
roomId={roomId}
imageSrc={isDM ? imageSrc : null}
// eslint-disable-next-line no-nested-ternary
iconSrc={isDM ? null : room.getJoinRule() === 'invite' ? HashLockIC : HashIC}
iconSrc={isDM ? null : joinRuleToIconSrc[room.getJoinRule()]?.() || null}
isSelected={isSelected}
isUnread={noti.hasNoti(roomId)}
notificationCount={abbreviateNumber(noti.getTotalNoti(roomId))}