Merge branch 'dev' into @update/groups

This commit is contained in:
Bill 2022-03-01 13:47:22 -05:00
commit 47d4838366
46 changed files with 219 additions and 252 deletions

View File

@ -6,7 +6,10 @@
&.active {
border-color: $grid-active-border-color !important;
background-color: $grid-active-bg-color;
&:not(.clear-bg) {
background-color: $grid-active-bg-color !important;
}
}
&.disabled {

View File

@ -26,7 +26,7 @@ export const AvatarEditorPaletteSetItem: FC<AvatarEditorPaletteSetItemProps> = p
});
return (
<LayoutGridItem itemHighlight itemColor={ colorItem.color } itemActive={ colorItem.isSelected } { ...rest }>
<LayoutGridItem itemHighlight itemColor={ colorItem.color } itemActive={ colorItem.isSelected } className="clear-bg" { ...rest }>
{ colorItem.isHC && <CurrencyIcon className="position-absolute end-1 bottom-1" type={ 'hc' } /> }
{ children }
</LayoutGridItem>

View File

@ -3,8 +3,7 @@ import { FC, useCallback, useRef } from 'react';
import { GetRoomEngine } from '../../../../api';
import { CatalogPurchasedEvent } from '../../../../events';
import { useUiEvent } from '../../../../hooks';
import { RoomPreviewerView } from '../../../../views/shared/room-previewer/RoomPreviewerView';
import { RoomPreviewerViewProps } from '../../../../views/shared/room-previewer/RoomPreviewerView.types';
import { RoomPreviewerView, RoomPreviewerViewProps } from '../../../../views/shared/room-previewer/RoomPreviewerView';
export const CatalogRoomPreviewerView: FC<RoomPreviewerViewProps> = props =>
{

View File

@ -0,0 +1,32 @@
import { createContext, FC, ProviderProps, useContext } from 'react';
import { MessengerFriend } from './common/MessengerFriend';
import { MessengerRequest } from './common/MessengerRequest';
import { MessengerSettings } from './common/MessengerSettings';
interface IFriendsContext
{
friends: MessengerFriend[];
requests: MessengerRequest[];
settings: MessengerSettings;
canRequestFriend: (userId: number) => boolean;
requestFriend: (userId: number, userName: string) => void;
acceptFriend: (userId: number) => void;
declineFriend: (userId: number, declineAll?: boolean) => void;
}
const FriendsContext = createContext<IFriendsContext>({
friends: null,
requests: null,
settings: null,
canRequestFriend: null,
requestFriend: null,
acceptFriend: null,
declineFriend: null
});
export const FriendsContextProvider: FC<ProviderProps<IFriendsContext>> = props =>
{
return <FriendsContext.Provider value={ props.value }>{ props.children }</FriendsContext.Provider>
}
export const useFriendsContext = () => useContext(FriendsContext);

View File

@ -12,7 +12,7 @@ import { FriendsHelper } from './common/FriendsHelper';
import { MessengerFriend } from './common/MessengerFriend';
import { MessengerRequest } from './common/MessengerRequest';
import { MessengerSettings } from './common/MessengerSettings';
import { FriendsContextProvider } from './context/FriendsContext';
import { FriendsContextProvider } from './FriendsContext';
import { FriendBarView } from './views/friend-bar/FriendBarView';
import { FriendsListView } from './views/friends-list/FriendsListView';
import { FriendsMessengerView } from './views/messenger/FriendsMessengerView';

View File

@ -1,6 +0,0 @@
export class FriendListTabs
{
public static readonly FRIENDS: string = 'friendlist.friends';
public static readonly REQUESTS: string = 'friendlist.requests';
public static readonly SEARCH: string = 'generic.search';
}

View File

@ -1,19 +0,0 @@
import { createContext, FC, useContext } from 'react';
import { FriendsContextProps, IFriendsContext } from './FriendsContext.type';
const FriendsContext = createContext<IFriendsContext>({
friends: null,
requests: null,
settings: null,
canRequestFriend: null,
requestFriend: null,
acceptFriend: null,
declineFriend: null
});
export const FriendsContextProvider: FC<FriendsContextProps> = props =>
{
return <FriendsContext.Provider value={ props.value }>{ props.children }</FriendsContext.Provider>
}
export const useFriendsContext = () => useContext(FriendsContext);

View File

@ -1,20 +0,0 @@
import { ProviderProps } from 'react';
import { MessengerFriend } from '../common/MessengerFriend';
import { MessengerRequest } from '../common/MessengerRequest';
import { MessengerSettings } from '../common/MessengerSettings';
export interface IFriendsContext
{
friends: MessengerFriend[];
requests: MessengerRequest[];
settings: MessengerSettings;
canRequestFriend: (userId: number) => boolean;
requestFriend: (userId: number, userName: string) => void;
acceptFriend: (userId: number) => void;
declineFriend: (userId: number, declineAll?: boolean) => void;
}
export interface FriendsContextProps extends ProviderProps<IFriendsContext>
{
}

View File

@ -1,35 +0,0 @@
.friend-bar-item {
width: 130px;
margin: 0 3px;
z-index: 0;
position: relative;
padding-left:38px;
text-align: left;
&.friend-bar-item-active {
margin-bottom:21px;
}
.friend-bar-item-head {
&.avatar {
top: -30px;
left: -30px;
}
&.group {
top: -5px;
left: -5px;
}
pointer-events: none;
}
&.friend-bar-search {
.friend-bar-item-head {
top: -3px;
left: 5px;
width: 31px;
height: 34px;
background-image: url('../../../../assets/images/toolbar/friend-search.png');
}
}
}

View File

@ -1,6 +0,0 @@
import { MessengerFriend } from '../../common/MessengerFriend';
export interface FriendBarItemViewProps
{
friend: MessengerFriend;
}

View File

@ -5,7 +5,12 @@ import { SendMessageHook } from '../../../../hooks/messages';
import { NitroLayoutBase } from '../../../../layout/base';
import { AvatarImageView } from '../../../shared/avatar-image/AvatarImageView';
import { BadgeImageView } from '../../../shared/badge-image/BadgeImageView';
import { FriendBarItemViewProps } from './FriendBarItemView.types';
import { MessengerFriend } from '../../common/MessengerFriend';
interface FriendBarItemViewProps
{
friend: MessengerFriend;
}
export const FriendBarItemView: FC<FriendBarItemViewProps> = props =>
{

View File

@ -1,7 +1,42 @@
.friend-bar {
.friend-bar-button {
z-index: 2;
}
@import '../friend-bar-item/FriendBarItemView.scss';
.friend-bar-item {
width: 130px;
margin: 0 3px;
z-index: 0;
position: relative;
padding-left:38px;
text-align: left;
&.friend-bar-item-active {
margin-bottom:21px;
}
.friend-bar-item-head {
&.avatar {
top: -30px;
left: -30px;
}
&.group {
top: -5px;
left: -5px;
}
pointer-events: none;
}
&.friend-bar-search {
.friend-bar-item-head {
top: -3px;
left: 5px;
width: 31px;
height: 34px;
background-image: url('../../../../assets/images/toolbar/friend-search.png');
}
}
}
}

View File

@ -1,9 +1,14 @@
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { FC, useMemo, useState } from 'react';
import { Button } from '../../../../common';
import { Flex } from '../../../../common/Flex';
import { NitroLayoutButton } from '../../../../layout';
import { NitroLayoutBase } from '../../../../layout/base';
import { FriendBarItemView } from '../friend-bar-item/FriendBarItemView';
import { FriendBarViewProps } from './FriendBarView.types';
import { MessengerFriend } from '../../common/MessengerFriend';
import { FriendBarItemView } from './FriendBarItemView';
interface FriendBarViewProps
{
onlineFriends: MessengerFriend[];
}
export const FriendBarView: FC<FriendBarViewProps> = props =>
{
@ -28,16 +33,16 @@ export const FriendBarView: FC<FriendBarViewProps> = props =>
return (
<Flex alignItems="center" className="friend-bar">
<NitroLayoutButton className="friend-bar-button" variant="black" size="sm" disabled={ !canDecreaseIndex } onClick={ event => setIndexOffset(indexOffset - 1) }>
<NitroLayoutBase className="fas fa-chevron-left" />
</NitroLayoutButton>
<Button variant="black" className="friend-bar-button" disabled={ !canDecreaseIndex } onClick={ event => setIndexOffset(indexOffset - 1) }>
<FontAwesomeIcon icon="chevron-left" />
</Button>
{ Array.from(Array(maxDisplayCount), (e, i) =>
{
return <FriendBarItemView key={ i } friend={ (onlineFriends[ indexOffset + i ] || null) } />;
}) }
<button type="button" className="btn btn-sm btn-black align-self-center friend-bar-button" disabled={ !canIncreaseIndex } onClick={ event => setIndexOffset(indexOffset + 1) }>
<i className="fas fa-chevron-right" />
</button>
<Button variant="black" className="friend-bar-button" disabled={ !canIncreaseIndex } onClick={ event => setIndexOffset(indexOffset + 1) }>
<FontAwesomeIcon icon="chevron-right" />
</Button>
</Flex>
);
}

View File

@ -1,5 +0,0 @@
import { MessengerFriend } from './../../common/MessengerFriend';
export interface FriendBarViewProps
{
onlineFriends: MessengerFriend[];
}

View File

@ -1,9 +0,0 @@
import { NitroLayoutFlexProps } from '../../../../layout';
import { MessengerFriend } from '../../common/MessengerFriend';
export interface FriendsGroupItemViewProps extends NitroLayoutFlexProps
{
friend: MessengerFriend;
selected?: boolean;
selectFriend: () => void;
}

View File

@ -3,10 +3,16 @@ import classNames from 'classnames';
import { FC, useCallback, useState } from 'react';
import { LocalizeText, OpenMessengerChat } from '../../../../api';
import { SendMessageHook } from '../../../../hooks';
import { NitroLayoutFlex, UserProfileIconView } from '../../../../layout';
import { NitroLayoutFlex, NitroLayoutFlexProps, UserProfileIconView } from '../../../../layout';
import { NitroLayoutBase } from '../../../../layout/base';
import { MessengerFriend } from '../../common/MessengerFriend';
import { FriendsGroupItemViewProps } from './FriendsGroupItemView.types';
interface FriendsGroupItemViewProps extends NitroLayoutFlexProps
{
friend: MessengerFriend;
selected?: boolean;
selectFriend: () => void;
}
export const FriendsGroupItemView: FC<FriendsGroupItemViewProps> = props =>
{

View File

@ -1,6 +1,13 @@
import React, { FC } from 'react';
import { FriendsGroupItemView } from '../friends-group-item/FriendsGroupItemView';
import { FriendsGroupViewProps } from './FriendsGroupView.types';
import { FC } from 'react';
import { MessengerFriend } from '../../common/MessengerFriend';
import { FriendsGroupItemView } from './FriendsGroupItemView';
interface FriendsGroupViewProps
{
list: MessengerFriend[];
selectedFriendsIds: number[];
selectFriend: (userId: number) => void;
}
export const FriendsGroupView: FC<FriendsGroupViewProps> = props =>
{

View File

@ -1,8 +0,0 @@
import { MessengerFriend } from '../../common/MessengerFriend';
export interface FriendsGroupViewProps
{
list: MessengerFriend[];
selectedFriendsIds: number[];
selectFriend: (userId: number) => void;
}

View File

@ -4,12 +4,20 @@ import { LocalizeText } from '../../../../api';
import { SendMessageHook } from '../../../../hooks';
import { NitroCardAccordionSetView, NitroCardAccordionView, NitroCardContentView, NitroCardHeaderView, NitroCardTabsItemView, NitroCardTabsView, NitroCardView } from '../../../../layout';
import { MessengerFriend } from '../../common/MessengerFriend';
import { MessengerRequest } from '../../common/MessengerRequest';
import { FriendsGroupView } from '../friends-group/FriendsGroupView';
import { FriendsRemoveConfirmationView } from '../friends-remove-confirmation/FriendsRemoveConfirmationView';
import { FriendsRequestView } from '../friends-request/FriendsRequestView';
import { FriendsRoomInviteView } from '../friends-room-invite/FriendsRoomInviteView';
import { FriendsSearchView } from '../friends-search/FriendsSearchView';
import { FriendsListViewProps } from './FriendsListView.types';
interface FriendsListViewProps
{
onCloseClick: () => void;
onlineFriends: MessengerFriend[];
offlineFriends: MessengerFriend[];
friendRequests: MessengerRequest[];
}
const MODE_FRIENDS: number = 0;
const MODE_SEARCH: number = 1;

View File

@ -1,9 +0,0 @@
import { MessengerFriend } from './../../common/MessengerFriend';
import { MessengerRequest } from './../../common/MessengerRequest';
export interface FriendsListViewProps
{
onCloseClick: () => void;
onlineFriends: MessengerFriend[];
offlineFriends: MessengerFriend[];
friendRequests: MessengerRequest[];
}

View File

@ -1,7 +1,14 @@
import { FC } from 'react';
import { LocalizeText } from '../../../../api';
import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../../../layout';
import { FriendsRemoveConfirmationViewProps } from './FriendsRemoveConfirmationView.types';
interface FriendsRemoveConfirmationViewProps
{
selectedFriendsIds: number[];
removeFriendsText: string;
removeSelectedFriends: () => void;
onCloseClick: () => void;
}
export const FriendsRemoveConfirmationView: FC<FriendsRemoveConfirmationViewProps> = props =>
{

View File

@ -1,7 +0,0 @@
export interface FriendsRemoveConfirmationViewProps
{
selectedFriendsIds: number[];
removeFriendsText: string;
removeSelectedFriends: () => void;
onCloseClick: () => void;
}

View File

@ -1,6 +0,0 @@
import { MessengerRequest } from '../../common/MessengerRequest';
export interface FriendsRequestItemViewProps
{
request: MessengerRequest;
}

View File

@ -1,8 +1,13 @@
import { FC } from 'react';
import { NitroCardAccordionItemView, NitroLayoutFlex, UserProfileIconView } from '../../../../layout';
import { NitroLayoutBase } from '../../../../layout/base';
import { useFriendsContext } from '../../context/FriendsContext';
import { FriendsRequestItemViewProps } from './FriendsRequestItemView.types';
import { MessengerRequest } from '../../common/MessengerRequest';
import { useFriendsContext } from '../../FriendsContext';
interface FriendsRequestItemViewProps
{
request: MessengerRequest;
}
export const FriendsRequestItemView: FC<FriendsRequestItemViewProps> = props =>
{

View File

@ -1,9 +1,14 @@
import { FC } from 'react';
import { LocalizeText } from '../../../../api';
import { NitroCardAccordionSetView, NitroLayoutButton, NitroLayoutFlex } from '../../../../layout';
import { useFriendsContext } from '../../context/FriendsContext';
import { FriendsRequestItemView } from '../friends-request-item/FriendsRequestItemView';
import { FriendsRequestViewProps } from './FriendsRequestView.types';
import { MessengerRequest } from '../../common/MessengerRequest';
import { useFriendsContext } from '../../FriendsContext';
import { FriendsRequestItemView } from './FriendsRequestItemView';
interface FriendsRequestViewProps
{
requests: MessengerRequest[];
}
export const FriendsRequestView: FC<FriendsRequestViewProps> = props =>
{

View File

@ -1,6 +0,0 @@
import { MessengerRequest } from '../../common/MessengerRequest';
export interface FriendsRequestViewProps
{
requests: MessengerRequest[];
}

View File

@ -1,7 +1,13 @@
import { FC, useState } from 'react';
import { LocalizeText } from '../../../../api';
import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../../../layout';
import { FriendsRoomInviteViewProps } from './FriendsRoomInviteView.types';
interface FriendsRoomInviteViewProps
{
selectedFriendsIds: number[];
onCloseClick: () => void;
sendRoomInvite: (message: string) => void;
}
export const FriendsRoomInviteView: FC<FriendsRoomInviteViewProps> = props =>
{

View File

@ -1,6 +0,0 @@
export interface FriendsRoomInviteViewProps
{
selectedFriendsIds: number[];
onCloseClick: () => void;
sendRoomInvite: (message: string) => void;
}

View File

@ -4,7 +4,7 @@ import { LocalizeText, OpenMessengerChat } from '../../../../api';
import { BatchUpdates, CreateMessageHook, SendMessageHook } from '../../../../hooks';
import { NitroCardAccordionItemView, NitroCardAccordionSetView, NitroCardAccordionView, NitroLayoutFlex, UserProfileIconView } from '../../../../layout';
import { NitroLayoutBase } from '../../../../layout/base';
import { useFriendsContext } from '../../context/FriendsContext';
import { useFriendsContext } from '../../FriendsContext';
export const FriendsSearchView: FC<{}> = props =>
{

View File

@ -1,8 +0,0 @@
import { MessengerThread } from '../../common/MessengerThread';
import { MessengerThreadChatGroup } from '../../common/MessengerThreadChatGroup';
export interface FriendsMessengerThreadGroupProps
{
thread: MessengerThread;
group: MessengerThreadChatGroup;
}

View File

@ -1,6 +0,0 @@
import { MessengerThread } from '../../common/MessengerThread';
export interface FriendsMessengerThreadViewProps
{
thread: MessengerThread;
}

View File

@ -4,9 +4,16 @@ import { NitroLayoutFlex } from '../../../../layout';
import { NitroLayoutBase } from '../../../../layout/base';
import { AvatarImageView } from '../../../shared/avatar-image/AvatarImageView';
import { GroupType } from '../../common/GroupType';
import { MessengerThread } from '../../common/MessengerThread';
import { MessengerThreadChat } from '../../common/MessengerThreadChat';
import { MessengerThreadChatGroup } from '../../common/MessengerThreadChatGroup';
import { getGroupChatData } from '../../common/Utils';
import { FriendsMessengerThreadGroupProps } from './FriendsMessengerThreadGroup.types';
interface FriendsMessengerThreadGroupProps
{
thread: MessengerThread;
group: MessengerThreadChatGroup;
}
export const FriendsMessengerThreadGroup: FC<FriendsMessengerThreadGroupProps> = props =>
{

View File

@ -1,6 +1,11 @@
import { FC } from 'react';
import { FriendsMessengerThreadGroup } from '../messenger-thread-group/FriendsMessengerThreadGroup';
import { FriendsMessengerThreadViewProps } from './FriendsMessengerThreadView.types';
import { MessengerThread } from '../../common/MessengerThread';
import { FriendsMessengerThreadGroup } from './FriendsMessengerThreadGroup';
interface FriendsMessengerThreadViewProps
{
thread: MessengerThread;
}
export const FriendsMessengerThreadView: FC<FriendsMessengerThreadViewProps> = props =>
{

View File

@ -11,8 +11,8 @@ import { BadgeImageView } from '../../../shared/badge-image/BadgeImageView';
import { ItemCountView } from '../../../shared/item-count/ItemCountView';
import { MessengerThread } from '../../common/MessengerThread';
import { MessengerThreadChat } from '../../common/MessengerThreadChat';
import { useFriendsContext } from '../../context/FriendsContext';
import { FriendsMessengerThreadView } from '../messenger-thread/FriendsMessengerThreadView';
import { useFriendsContext } from '../../FriendsContext';
import { FriendsMessengerThreadView } from './FriendsMessengerThreadView';
export const FriendsMessengerView: FC<{}> = props =>
{

View File

@ -1,5 +1,10 @@
import { FC } from 'react';
import { BadgeInformationViewProps } from './BadgeInformationView.types';
interface BadgeInformationViewProps
{
title: string;
description: string;
}
export const BadgeInformationView: FC<BadgeInformationViewProps> = props =>
{

View File

@ -1,5 +0,0 @@
export interface BadgeInformationViewProps
{
title: string;
description: string;
}

View File

@ -1,16 +1,19 @@
import { FriendlyTime } from '@nitrots/nitro-renderer';
import { FC, useCallback, useEffect, useMemo, useState } from 'react';
import { FriendlyTimeViewProps } from './FriendlyTimeView.types';
import { Base, BaseProps } from '../../../common';
interface FriendlyTimeViewProps extends BaseProps<HTMLDivElement>
{
seconds: number;
isShort?: boolean;
}
export const FriendlyTimeView: FC<FriendlyTimeViewProps> = props =>
{
const { seconds = 0, isShort = false, ...rest } = props;
const { seconds = 0, isShort = false, children = null, ...rest } = props;
const [ updateId, setUpdateId ] = useState(-1);
const getStartSeconds = useMemo(() =>
{
return (Math.round(new Date().getSeconds()) - seconds);
}, [ seconds ]);
const getStartSeconds = useMemo(() => (Math.round(new Date().getSeconds()) - seconds), [ seconds ]);
const getFriendlyTime = useCallback(() =>
{
@ -28,7 +31,5 @@ export const FriendlyTimeView: FC<FriendlyTimeViewProps> = props =>
return () => clearInterval(interval);
}, []);
return (
<div { ...rest }>{ getFriendlyTime() }</div>
);
return <Base { ...rest }>{ getFriendlyTime() }</Base>;
}

View File

@ -1,7 +0,0 @@
import { DetailsHTMLAttributes } from 'react';
export interface FriendlyTimeViewProps extends DetailsHTMLAttributes<HTMLDivElement>
{
seconds: number;
isShort?: boolean;
}

View File

@ -1,5 +1,9 @@
import { FC } from 'react';
import { ItemCountViewProps } from './ItemCountView.types';
interface ItemCountViewProps
{
count: number;
}
export const ItemCountView: FC<ItemCountViewProps> = props =>
{

View File

@ -1,4 +0,0 @@
export interface ItemCountViewProps
{
count: number;
}

View File

@ -1,7 +1,19 @@
import { PetFigureData, TextureUtils, Vector3d } from '@nitrots/nitro-renderer';
import { PetCustomPart, PetFigureData, TextureUtils, Vector3d } from '@nitrots/nitro-renderer';
import { FC, useEffect, useRef, useState } from 'react';
import { GetRoomEngine } from '../../../api';
import { PetImageViewProps } from './PetImageView.types';
interface PetImageViewProps
{
figure?: string;
typeId?: number;
paletteId?: number;
color?: number;
customParts?: PetCustomPart[];
posture?: string;
headOnly?: boolean;
direction?: number;
scale?: number;
}
export const PetImageView: FC<PetImageViewProps> = props =>
{

View File

@ -1,14 +0,0 @@
import { PetCustomPart } from '@nitrots/nitro-renderer';
export interface PetImageViewProps
{
figure?: string;
typeId?: number;
paletteId?: number;
color?: number;
customParts?: PetCustomPart[];
posture?: string;
headOnly?: boolean;
direction?: number;
scale?: number;
}

View File

@ -1,6 +1,10 @@
import { FC, useMemo } from 'react';
import { Base } from '../../../common/Base';
import { RarityLevelViewProps } from './RarityLevelView.types';
import { Base, BaseProps } from '../../../common';
interface RarityLevelViewProps extends BaseProps<HTMLDivElement>
{
level: number;
}
export const RarityLevelView: FC<RarityLevelViewProps> = props =>
{

View File

@ -1,6 +0,0 @@
import { BaseProps } from '../../../common/Base';
export interface RarityLevelViewProps extends BaseProps<HTMLDivElement>
{
level: number;
}

View File

@ -1,7 +1,12 @@
import { ColorConverter, IRoomRenderingCanvas, TextureUtils } from '@nitrots/nitro-renderer';
import { ColorConverter, IRoomRenderingCanvas, RoomPreviewer, TextureUtils } from '@nitrots/nitro-renderer';
import { FC, useCallback, useEffect, useRef, useState } from 'react';
import { GetNitroInstance } from '../../../api';
import { RoomPreviewerViewProps } from './RoomPreviewerView.types';
export interface RoomPreviewerViewProps
{
roomPreviewer: RoomPreviewer;
height?: number;
}
export const RoomPreviewerView: FC<RoomPreviewerViewProps> = props =>
{

View File

@ -1,7 +0,0 @@
import { RoomPreviewer } from '@nitrots/nitro-renderer';
export interface RoomPreviewerViewProps
{
roomPreviewer: RoomPreviewer;
height?: number;
}