nitro/nitro-react
1
0
Fork 0
mirror of https://github.com/billsonnn/nitro-react.git synced 2024-11-22 22:30:52 +01:00
Code Issues Packages Projects Releases Wiki Activity

Feature - User tags (#104)

Browse Source
This commit is contained in:
object 2023-01-03 08:08:33 +01:00 committed by GitHub
parent ae2f38c917
commit afec012eb6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 61 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
public/ui-config.json.example
View File

@ -11,6 +11,7 @@
"widget.dimmer.colorwheel": false,
"avatar.wardrobe.max.slots": 10,
"user.badges.max.slots": 5,
"user.tags.enabled": false,
"camera.publish.disabled": false,
"hc.disabled": false,
"badge.descriptions.enabled": true,

16
src/components/room/widgets/avatar-info/AvatarInfoWidgetView.scss
View File

@ -106,6 +106,22 @@
font-style: italic;
}
}
.flex-tags
{
flex-wrap: wrap;
margin-bottom: -10px;
.text-tags
{
padding: 2px;
border-radius: 3px;
background: #333;
margin-right: 5px;
margin-bottom: 10px;
cursor: pointer;
}
}
}
.button-container {

5
src/components/room/widgets/avatar-info/AvatarInfoWidgetView.tsx
View File

@ -1,6 +1,6 @@
import { RoomEngineEvent, RoomEnterEffect, RoomSessionDanceEvent } from '@nitrots/nitro-renderer';
import { FC, useState } from 'react';
import { AvatarInfoFurni, AvatarInfoPet, AvatarInfoRentableBot, AvatarInfoUser, GetSessionDataManager, RoomWidgetUpdateRentableBotChatEvent } from '../../../../api';
import { AvatarInfoFurni, AvatarInfoPet, AvatarInfoRentableBot, AvatarInfoUser, GetConfiguration, GetSessionDataManager, RoomWidgetUpdateRentableBotChatEvent } from '../../../../api';
import { Column } from '../../../../common';
import { useAvatarInfoWidget, useRoom, useRoomEngineEvent, useRoomSessionManagerEvent, useUiEvent } from '../../../../hooks';
import { AvatarInfoRentableBotChatView } from './AvatarInfoRentableBotChatView';
@ -67,6 +67,7 @@ export const AvatarInfoWidgetView: FC<{}> = props =>
case AvatarInfoUser.OWN_USER:
case AvatarInfoUser.PEER: {
const info = (avatarInfo as AvatarInfoUser);
if (GetConfiguration('user.tags.enabled')) GetSessionDataManager().getUserTags(info.roomIndex);
if(info.isSpectatorMode) return null;
@ -111,7 +112,7 @@ export const AvatarInfoWidgetView: FC<{}> = props =>
case AvatarInfoRentableBot.RENTABLE_BOT:
return <InfoStandWidgetRentableBotView avatarInfo={ (avatarInfo as AvatarInfoRentableBot) } onClose={ () => setAvatarInfo(null) } />;
case AvatarInfoPet.PET_INFO:
return <InfoStandWidgetPetView avatarInfo={ (avatarInfo as AvatarInfoPet) } onClose={ () => setAvatarInfo(null) } />
return <InfoStandWidgetPetView avatarInfo={ (avatarInfo as AvatarInfoPet) } onClose={ () => setAvatarInfo(null) } />
}
}

31
src/components/room/widgets/avatar-info/infostand/InfoStandWidgetUserTagsView.tsx Normal file
View File

@ -0,0 +1,31 @@
import { NavigatorSearchComposer } from '@nitrots/nitro-renderer';
import { FC } from 'react';
import { CreateLinkEvent, SendMessageComposer } from '../../../../../api';
import { Flex, Text } from '../../../../../common';
interface InfoStandWidgetUserTagsViewProps
{
tags: string[];
}
const processAction = (tag: string) =>
{
CreateLinkEvent(`navigator/search/${ tag }`);
SendMessageComposer(new NavigatorSearchComposer('hotel_view', `tag:${ tag }`));
}
export const InfoStandWidgetUserTagsView: FC<InfoStandWidgetUserTagsViewProps> = props =>
{
const { tags = null } = props;
if(!tags || !tags.length) return null;
return (
<>
<hr className="m-0" />
<Flex className="flex-tags">
{ tags && (tags.length > 0) && tags.map((tag, index) => <Text key={ index } variant="white" className="text-tags" onClick={ event => processAction(tag) }>{ tag }</Text>) }
</Flex>
</>
);
}

14
src/components/room/widgets/avatar-info/infostand/InfoStandWidgetUserView.tsx
View File

@ -5,6 +5,7 @@ import { AvatarInfoUser, CloneObject, GetConfiguration, GetGroupInformation, Get
import { Column, Flex, LayoutAvatarImageView, LayoutBadgeImageView, Text, UserProfileIconView } from '../../../../../common';
import { useMessageEvent, useRoom, useRoomSessionManagerEvent } from '../../../../../hooks';
import { InfoStandWidgetUserRelationshipsView } from './InfoStandWidgetUserRelationshipsView';
import { InfoStandWidgetUserTagsView } from './InfoStandWidgetUserTagsView';
interface InfoStandWidgetUserViewProps
{
@ -35,7 +36,7 @@ export const InfoStandWidgetUserView: FC<InfoStandWidgetUserViewProps> = props =
const onMottoKeyDown = (event: KeyboardEvent<HTMLInputElement>) =>
{
event.stopPropagation();
switch(event.key)
{
case 'Enter':
@ -49,7 +50,7 @@ export const InfoStandWidgetUserView: FC<InfoStandWidgetUserViewProps> = props =
if(!avatarInfo || (avatarInfo.webID !== event.userId)) return;
const oldBadges = avatarInfo.badges.join('');
if(oldBadges === event.badges.join('')) return;
setAvatarInfo(prevValue =>
@ -108,10 +109,10 @@ export const InfoStandWidgetUserView: FC<InfoStandWidgetUserViewProps> = props =
{
setIsEditingMotto(false);
setMotto(avatarInfo.motto);
SendMessageComposer(new UserRelationshipsComposer(avatarInfo.webID));
return () =>
return () =>
{
setIsEditingMotto(false);
setMotto(null);
@ -203,6 +204,11 @@ export const InfoStandWidgetUserView: FC<InfoStandWidgetUserViewProps> = props =
<Column gap={ 1 }>
<InfoStandWidgetUserRelationshipsView relationships={ relationships } />
</Column>
{ GetConfiguration('user.tags.enabled') &&
<Column gap={ 1 } className="mt-1">
<InfoStandWidgetUserTagsView tags={ GetSessionDataManager().tags } />
</Column>
}
</Column>
</Column>
);