Update hotel view widgets

This commit is contained in:
Bill 2021-08-15 02:56:33 -04:00
parent 56961a448c
commit 69ef7412cf
10 changed files with 88 additions and 64 deletions

View File

@ -1,4 +1,4 @@
import { BonusRareInfoMessageEvent, GetBonusRareInfoMessageComposer } from 'nitro-renderer'; import { BonusRareInfoMessageEvent, GetBonusRareInfoMessageComposer } from '@nitrots/nitro-renderer';
import { FC, useCallback, useEffect, useState } from 'react'; import { FC, useCallback, useEffect, useState } from 'react';
import { CreateMessageHook, SendMessageHook } from '../../../../../hooks/messages/message-event'; import { CreateMessageHook, SendMessageHook } from '../../../../../hooks/messages/message-event';
import { BonusRareWidgetViewProps } from './BonusRareWidgetView.types'; import { BonusRareWidgetViewProps } from './BonusRareWidgetView.types';
@ -10,14 +10,10 @@ export const BonusRareWidgetView: FC<BonusRareWidgetViewProps> = props =>
const [ totalCoinsForBonus, setTotalCoinsForBonus ] = useState<number>(null); const [ totalCoinsForBonus, setTotalCoinsForBonus ] = useState<number>(null);
const [ coinsStillRequiredToBuy, setCoinsStillRequiredToBuy ] = useState<number>(null); const [ coinsStillRequiredToBuy, setCoinsStillRequiredToBuy ] = useState<number>(null);
useEffect(() =>
{
SendMessageHook(new GetBonusRareInfoMessageComposer());
}, []);
const onBonusRareInfoMessageEvent = useCallback((event: BonusRareInfoMessageEvent) => const onBonusRareInfoMessageEvent = useCallback((event: BonusRareInfoMessageEvent) =>
{ {
const parser = event.getParser(); const parser = event.getParser();
setProductType(parser.productType); setProductType(parser.productType);
setProductClassId(parser.productClassId); setProductClassId(parser.productClassId);
setTotalCoinsForBonus(parser.totalCoinsForBonus); setTotalCoinsForBonus(parser.totalCoinsForBonus);
@ -26,7 +22,12 @@ export const BonusRareWidgetView: FC<BonusRareWidgetViewProps> = props =>
CreateMessageHook(BonusRareInfoMessageEvent, onBonusRareInfoMessageEvent); CreateMessageHook(BonusRareInfoMessageEvent, onBonusRareInfoMessageEvent);
if (!productType) return (null); useEffect(() =>
{
SendMessageHook(new GetBonusRareInfoMessageComposer());
}, []);
if(!productType) return null;
return ( return (
<div className="bonus-rare widget d-flex"> <div className="bonus-rare widget d-flex">

View File

@ -0,0 +1,21 @@
import { FC } from 'react';
import { LocalizeText } from '../../../../../utils';
import { AvatarImageView } from '../../../../shared/avatar-image/AvatarImageView';
import { HallOfFameItemViewProps } from './HallOfFameItemView.types';
export const HallOfFameItemView: FC<HallOfFameItemViewProps> = props =>
{
const { data = null, level = 0 } = props;
return (
<div className="hof-user-container cursor-pointer">
<div className="hof-tooltip">
<div className="hof-tooltip-content">
<div className="fw-bold">{ level }. { data.userName }</div>
<div className="muted fst-italic small text-center">{ LocalizeText('landing.view.competition.hof.points', [ 'points' ], [ data.currentScore.toString() ])}</div>
</div>
</div>
<AvatarImageView figure={ data.figure } direction={ 2 } />
</div>
);
}

View File

@ -0,0 +1,7 @@
import { HallOfFameEntryData } from '@nitrots/nitro-renderer';
export interface HallOfFameItemViewProps
{
data: HallOfFameEntryData;
level: number;
}

View File

@ -1,41 +1,36 @@
import { CommunityGoalHallOfFameData, CommunityGoalHallOfFameMessageEvent, GetCommunityGoalHallOfFameMessageComposer } from 'nitro-renderer'; import { CommunityGoalHallOfFameData, CommunityGoalHallOfFameMessageEvent, GetCommunityGoalHallOfFameMessageComposer } from '@nitrots/nitro-renderer';
import { FC, useCallback, useEffect, useState } from 'react'; import { FC, useCallback, useEffect, useState } from 'react';
import { CreateMessageHook, SendMessageHook } from '../../../../../hooks/messages/message-event'; import { CreateMessageHook, SendMessageHook } from '../../../../../hooks/messages/message-event';
import { LocalizeText } from '../../../../../utils/LocalizeText'; import { HallOfFameItemView } from '../hall-of-fame-item/HallOfFameItemView';
import { AvatarImageView } from '../../../../shared/avatar-image/AvatarImageView';
import { HallOfFameWidgetViewProps } from './HallOfFameWidgetView.types'; import { HallOfFameWidgetViewProps } from './HallOfFameWidgetView.types';
export const HallOfFameWidgetView: FC<HallOfFameWidgetViewProps> = props => export const HallOfFameWidgetView: FC<HallOfFameWidgetViewProps> = props =>
{ {
const { slot = -1, conf = '' } = props;
const [ data, setData ] = useState<CommunityGoalHallOfFameData>(null); const [ data, setData ] = useState<CommunityGoalHallOfFameData>(null);
useEffect(() =>
{
SendMessageHook(new GetCommunityGoalHallOfFameMessageComposer(props.conf));
}, [props.conf]);
const onCommunityGoalHallOfFameMessageEvent = useCallback((event: CommunityGoalHallOfFameMessageEvent) => const onCommunityGoalHallOfFameMessageEvent = useCallback((event: CommunityGoalHallOfFameMessageEvent) =>
{ {
const parser = event.getParser(); const parser = event.getParser();
setData(parser.data); setData(parser.data);
}, []); }, []);
CreateMessageHook(CommunityGoalHallOfFameMessageEvent, onCommunityGoalHallOfFameMessageEvent); CreateMessageHook(CommunityGoalHallOfFameMessageEvent, onCommunityGoalHallOfFameMessageEvent);
useEffect(() =>
{
SendMessageHook(new GetCommunityGoalHallOfFameMessageComposer(conf));
}, [ conf ]);
if(!data) return null; if(!data) return null;
return ( return (
<div className="hall-of-fame widget"> <div className="hall-of-fame widget">
{data.hof && (data.hof.length > 0) && data.hof.map((entry, ind) => { data.hof && (data.hof.length > 0) && data.hof.map((entry, index) =>
<div className="hof-user-container cursor-pointer"> {
<div className="hof-tooltip"> return <HallOfFameItemView data={ entry } level={ (index + 1) } />;
<div className="hof-tooltip-content"> }
<div className="fw-bold">{ind + 1}. { entry.userName }</div>
<div className="muted fst-italic small text-center">{LocalizeText('landing.view.competition.hof.points', ['points'], [entry.currentScore.toString()])}</div>
</div>
</div>
<AvatarImageView figure={entry.figure} direction={2} key={ind} />
</div>
)} )}
</div> </div>
); );

View File

@ -1,4 +1,4 @@
import { GetPromoArticlesComposer, PromoArticleData, PromoArticlesMessageEvent } from 'nitro-renderer'; import { GetPromoArticlesComposer, PromoArticleData, PromoArticlesMessageEvent } from '@nitrots/nitro-renderer';
import { FC, useCallback, useEffect, useState } from 'react'; import { FC, useCallback, useEffect, useState } from 'react';
import { CreateMessageHook, SendMessageHook } from '../../../../../hooks'; import { CreateMessageHook, SendMessageHook } from '../../../../../hooks';
import { LocalizeText } from '../../../../../utils/LocalizeText'; import { LocalizeText } from '../../../../../utils/LocalizeText';
@ -14,11 +14,6 @@ export const PromoArticleWidgetView: FC<PromoArticleWidgetViewProps> = props =>
setIndex(selectedIndex); setIndex(selectedIndex);
}; };
useEffect(() =>
{
SendMessageHook(new GetPromoArticlesComposer());
}, []);
const onPromoArticlesMessageEvent = useCallback((event: PromoArticlesMessageEvent) => const onPromoArticlesMessageEvent = useCallback((event: PromoArticlesMessageEvent) =>
{ {
const parser = event.getParser(); const parser = event.getParser();
@ -27,6 +22,11 @@ export const PromoArticleWidgetView: FC<PromoArticleWidgetViewProps> = props =>
CreateMessageHook(PromoArticlesMessageEvent, onPromoArticlesMessageEvent); CreateMessageHook(PromoArticlesMessageEvent, onPromoArticlesMessageEvent);
useEffect(() =>
{
SendMessageHook(new GetPromoArticlesComposer());
}, []);
if (!articles) return null; if (!articles) return null;
return ( return (

View File

@ -1,5 +1,5 @@
import { FC, useCallback, useMemo } from 'react'; import { FC, useCallback, useMemo } from 'react';
import { GetConfigurationManager } from '../../../../../api/core/'; import { GetConfigurationManager } from '../../../../../api/core';
import { LocalizeText } from '../../../../../utils/LocalizeText'; import { LocalizeText } from '../../../../../utils/LocalizeText';
import { WidgetContainerViewProps } from './WidgetContainerView.types'; import { WidgetContainerViewProps } from './WidgetContainerView.types';