This commit is contained in:
MyNameIsBatman 2022-02-23 01:07:22 -03:00
parent d359862e1c
commit e93c37efbb
2 changed files with 30 additions and 21 deletions

View File

@ -4,7 +4,8 @@ import { LocalizeText } from '../../../api';
import { Button } from '../../../common/Button'; import { Button } from '../../../common/Button';
import { Column } from '../../../common/Column'; import { Column } from '../../../common/Column';
import { Text } from '../../../common/Text'; import { Text } from '../../../common/Text';
import { SendMessageHook } from '../../../hooks'; import { GuideToolEvent } from '../../../events/guide-tool/GuideToolEvent';
import { dispatchUiEvent, SendMessageHook } from '../../../hooks';
import { useHelpContext } from '../HelpContext'; import { useHelpContext } from '../HelpContext';
export const HelpIndexView: FC<{}> = props => export const HelpIndexView: FC<{}> = props =>
@ -23,6 +24,11 @@ export const HelpIndexView: FC<{}> = props =>
SendMessageHook(new GetCfhStatusMessageComposer(false)); SendMessageHook(new GetCfhStatusMessageComposer(false));
}, []); }, []);
const onNewHelpRequestClick = useCallback(() =>
{
dispatchUiEvent(new GuideToolEvent(GuideToolEvent.CREATE_HELP_REQUEST));
}, []);
return ( return (
<> <>
<Column gap={ 1 }> <Column gap={ 1 }>
@ -31,7 +37,7 @@ export const HelpIndexView: FC<{}> = props =>
</Column> </Column>
<Column gap={ 1 }> <Column gap={ 1 }>
<Button onClick={ onReportClick }>{ LocalizeText('help.main.bully.subtitle') }</Button> <Button onClick={ onReportClick }>{ LocalizeText('help.main.bully.subtitle') }</Button>
<Button disabled={ true }>{ LocalizeText('help.main.help.title') }</Button> <Button onClick={ onNewHelpRequestClick }>{ LocalizeText('help.main.help.title') }</Button>
<Button disabled={ true }>{ LocalizeText('help.main.self.tips.title') }</Button> <Button disabled={ true }>{ LocalizeText('help.main.self.tips.title') }</Button>
<Button variant="link" className="text-black" onClick={ onRequestMySanctionStatusClick }>{ LocalizeText('help.main.my.sanction.status') }</Button> <Button variant="link" className="text-black" onClick={ onRequestMySanctionStatusClick }>{ LocalizeText('help.main.my.sanction.status') }</Button>
</Column> </Column>

View File

@ -53,6 +53,11 @@ export const GuideToolOngoingView: FC<GuideToolOngoingViewProps> = props =>
sendMessage(); sendMessage();
}, [ sendMessage ]); }, [ sendMessage ]);
const isOwnChat = useCallback((userId: number) =>
{
return userId === GetSessionDataManager().userId;
}, []);
return ( return (
<NitroCardContentView className="p-0"> <NitroCardContentView className="p-0">
<div className="d-flex gap-2 align-items-center bg-secondary p-2 text-white"> <div className="d-flex gap-2 align-items-center bg-secondary p-2 text-white">
@ -71,26 +76,24 @@ export const GuideToolOngoingView: FC<GuideToolOngoingViewProps> = props =>
{ messageGroups.map((group, index) => { messageGroups.map((group, index) =>
{ {
return ( return (
<NitroLayoutFlex className={ 'w-100 justify-content-' + (group.userId === 0 ? 'end' : 'start') } gap={ 2 }> <NitroLayoutFlex className={ 'w-100 justify-content-' + (isOwnChat(group.userId) ? 'end' : 'start') } gap={ 2 }>
{ (group.userId === userId) && <NitroLayoutBase className="message-avatar flex-shrink-0">
<NitroLayoutBase className="message-avatar flex-shrink-0"> { (!isOwnChat(group.userId)) &&
<AvatarImageView figure={ userFigure } direction={ 2 } /> <AvatarImageView figure={ userFigure } direction={ 2 } />
</NitroLayoutBase> } }
<NitroLayoutBase className={ 'bg-light text-black border-radius mb-2 rounded py-1 px-2 messages-group-' + (group.userId !== userId ? 'right' : 'left') }>
{ group.messages.map((message, index) =>
{
return (
<NitroLayoutBase key={ index } className="text-break">
{ message.roomId > 0 ? LocalizeText('guide.help.request.user.ongoing.visit.guide.request.message', ['name', 'roomname'], [userName, message.message]) : message.message }
</NitroLayoutBase>
);
}) }
</NitroLayoutBase> </NitroLayoutBase>
{ (group.userId !== userId) && <NitroLayoutBase className={ 'bg-light text-black border-radius mb-2 rounded py-1 px-2 messages-group-' + (isOwnChat(group.userId) ? 'right' : 'left') }>
<NitroLayoutBase className="message-avatar flex-shrink-0"> <NitroLayoutBase className='fw-bold'>
<AvatarImageView figure={ GetSessionDataManager().figure } direction={ 4 } /> { (isOwnChat(group.userId)) && GetSessionDataManager().userName }
</NitroLayoutBase> } { (!isOwnChat(group.userId)) && userName }
</NitroLayoutFlex> </NitroLayoutBase>
{ group.messages.map((chat, index) =><NitroLayoutBase key={ index } className="text-break">{ chat.message }</NitroLayoutBase>) }
</NitroLayoutBase>
{ (isOwnChat(group.userId)) &&
<NitroLayoutBase className="message-avatar flex-shrink-0">
<AvatarImageView figure={ GetSessionDataManager().figure } direction={ 4 } />
</NitroLayoutBase> }
</NitroLayoutFlex>
); );
}) } }) }
</div> </div>