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

add my sanction status view

Browse Source
This commit is contained in:
dank074 2021-11-13 19:11:26 -06:00
parent 29fcaa31b4
commit b70e828659
4 changed files with 101 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/views/help/HelpView.scss
View File

@ -8,3 +8,7 @@
height: 105px;
}
}
.nitro-cfh-sanction-status {
width: 400px;
}

2
src/views/help/HelpView.tsx
View File

@ -9,6 +9,7 @@ import { IHelpReportState, initialReportState } from './context/HelpContext.type
import { HelpMessageHandler } from './HelpMessageHandler';
import { DescribeReportView } from './views/DescribeReportView';
import { HelpIndexView } from './views/HelpIndexView';
import { SanctionSatusView } from './views/SanctionStatusView';
import { SelectReportedChatsView } from './views/SelectReportedChatsView';
import { SelectReportedUserView } from './views/SelectReportedUserView';
import { SelectTopicView } from './views/SelectTopicView';
@ -74,6 +75,7 @@ export const HelpView: FC<{}> = props =>
</NitroCardContentView>
</NitroCardView>
}
<SanctionSatusView />
</HelpContextProvider>
);
}

13
src/views/help/views/HelpIndexView.tsx
View File

@ -1,5 +1,7 @@
import { GetCfhStatusMessageComposer } from '@nitrots/nitro-renderer';
import { FC, useCallback } from 'react';
import { LocalizeText } from '../../../api';
import { SendMessageHook } from '../../../hooks';
import { useHelpContext } from '../context/HelpContext';
export const HelpIndexView: FC<{}> = props =>
@ -13,6 +15,11 @@ export const HelpIndexView: FC<{}> = props =>
setHelpReportState(reportState);
},[helpReportState, setHelpReportState]);
const onRequestMySanctionStatusClick = useCallback(() =>
{
SendMessageHook(new GetCfhStatusMessageComposer(false));
}, []);
return (
<>
<div className="d-grid col-12 mx-auto justify-content-center">
@ -23,12 +30,12 @@ export const HelpIndexView: FC<{}> = props =>
<div className="d-grid gap-2 col-8 mx-auto">
<button className="btn btn-primary" type="button" onClick={onReportClick}>{LocalizeText('help.main.bully.subtitle')}</button>
<button className="btn btn-primary" type="button">{LocalizeText('help.main.help.title')}</button>
<button className="btn btn-primary" type="button">{LocalizeText('help.main.self.tips.title')}</button>
<button className="btn btn-primary" type="button" disabled={true}>{LocalizeText('help.main.help.title')}</button>
<button className="btn btn-primary" type="button" disabled={true}>{LocalizeText('help.main.self.tips.title')}</button>
</div>
<div className="d-grid gap-2 col-8 mx-auto">
<button className="btn btn-link" type="button">{LocalizeText('help.main.my.sanction.status')}</button>
<button className="btn btn-link" type="button" onClick={onRequestMySanctionStatusClick}>{LocalizeText('help.main.my.sanction.status')}</button>
</div>
</>

85
src/views/help/views/SanctionStatusView.tsx Normal file
View File

@ -0,0 +1,85 @@
import { SanctionStatusEvent, SanctionStatusMessageParser } from '@nitrots/nitro-renderer';
import { FC, useCallback, useState } from 'react';
import { LocalizeText } from '../../../api';
import { CreateMessageHook } from '../../../hooks';
import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../../layout';
export const SanctionSatusView:FC<{}> = props =>
{
const [ sanctionInfo, setSanctionInfo ] = useState<SanctionStatusMessageParser>(null);
const onSanctionStatusEvent = useCallback((event: SanctionStatusEvent) =>
{
const parser = event.getParser();
if(!parser) return;
setSanctionInfo(parser);
}, []);
CreateMessageHook(SanctionStatusEvent, onSanctionStatusEvent);
const sanctionLocalization = useCallback((param: string, sanctionName: string, length?: number) =>
{
let localizationName = `help.sanction.${param}`;
switch(sanctionName)
{
case 'ALERT':
localizationName = (localizationName + '.alert');
break;
case 'MUTE':
localizationName = (localizationName + '.mute');
break;
case 'BAN_PERMANENT':
localizationName = (localizationName + '.permban');
break;
default:
localizationName = (localizationName + '.ban');
if(length > 24)
{
localizationName = (localizationName + '.days');
return LocalizeText(localizationName, ['days'], [(length / 24).toString()]);
}
}
return LocalizeText(localizationName, ['hours'], [length.toString()]);
}, []);
if(!sanctionInfo) return null;
return (
<NitroCardView className="nitro-cfh-sanction-status">
<NitroCardHeaderView headerText={LocalizeText('help.sanction.info.title')} onCloseClick={() => setSanctionInfo(null)} />
<NitroCardContentView className="text-black">
<div className="d-grid gap-2 col-12 mx-auto justify-content-start">
{(sanctionInfo.sanctionReason === 'cfh.reason.EMPTY')
? <div className="col-12 fw-bold">{LocalizeText('help.sanction.current.none')}</div>
: <>
{((sanctionInfo.probationHoursLeft > 0) || (sanctionInfo.isSanctionActive)) &&
<div className="col-12 fw-bold">{LocalizeText('help.sanction.probation.reminder')}</div>
}
<div className={`col-12 fw-bold ${sanctionInfo.isSanctionNew ? 'text-danger' : ''}`}>
{LocalizeText('help.sanction.last.sanction')} {sanctionLocalization('current', sanctionInfo.sanctionName, sanctionInfo.sanctionLengthHours)}
</div>
<div className="col-12">{LocalizeText('generic.start.time')} {sanctionInfo.sanctionCreationTime}</div>
<div className="col-12">{LocalizeText('generic.reason')} {sanctionInfo.sanctionReason}</div>
<div className="col-12">{LocalizeText('help.sanction.probation.days.left')} {Math.trunc((sanctionInfo.probationHoursLeft / 24)) + 1}</div>
</>
}
{ ((sanctionInfo.hasCustomMute) && (!(sanctionInfo.isSanctionActive))) &&
<div className="col-12 fw-bold">{LocalizeText('help.sanction.custom.mute')}</div>
}
{ (sanctionInfo.tradeLockExpiryTime && sanctionInfo.tradeLockExpiryTime.length > 0) &&
<div className="col-12 fw-bold">{LocalizeText('trade.locked.until')} {sanctionInfo.tradeLockExpiryTime}</div>
}
<div className="col-12">{sanctionLocalization('next', sanctionInfo.nextSanctionName, sanctionInfo.nextSanctionLengthHours)}</div>
</div>
<div className="d-grid gap-2 col-8 mx-auto mt-2">
<button className="btn btn-success" type="button" onClick={() => setSanctionInfo(null)}>{LocalizeText('habbo.way.ok.button')}</button>
</div>
</NitroCardContentView>
</NitroCardView>
)
}