diff --git a/src/App.scss b/src/App.scss index 21d61957..f612bddd 100644 --- a/src/App.scss +++ b/src/App.scss @@ -50,8 +50,8 @@ $chat-history-height: 300px; $friends-list-width: 250px; $friends-list-height: 300px; -$help-width: 275px; -$help-height: 450px; +$help-width: 450px; +$help-height: 250px; $nitropedia-width: 400px; $nitropedia-height: 400px; diff --git a/src/components/help/HelpContext.tsx b/src/components/help/HelpContext.tsx new file mode 100644 index 00000000..2905830b --- /dev/null +++ b/src/components/help/HelpContext.tsx @@ -0,0 +1,20 @@ +import { createContext, Dispatch, FC, ProviderProps, SetStateAction, useContext } from 'react'; +import { IHelpReportState } from './common/IHelpReportState'; + +interface IHelpContext +{ + helpReportState: IHelpReportState; + setHelpReportState: Dispatch>; +} + +const HelpContext = createContext({ + helpReportState: null, + setHelpReportState: null +}); + +export const HelpContextProvider: FC> = props => +{ + return { props.children } +} + +export const useHelpContext = () => useContext(HelpContext); diff --git a/src/views/help/HelpMessageHandler.tsx b/src/components/help/HelpMessageHandler.tsx similarity index 91% rename from src/views/help/HelpMessageHandler.tsx rename to src/components/help/HelpMessageHandler.tsx index 1febee73..22b277f1 100644 --- a/src/views/help/HelpMessageHandler.tsx +++ b/src/components/help/HelpMessageHandler.tsx @@ -2,8 +2,8 @@ import { CallForHelpResultMessageEvent, GetPendingCallsForHelpMessageComposer, I import { FC, useCallback } from 'react'; import { LocalizeText } from '../../api'; import { CreateMessageHook, SendMessageHook } from '../../hooks/messages/message-event'; -import { NotificationAlertType } from '../notification-center/common/NotificationAlertType'; -import { NotificationUtilities } from '../notification-center/common/NotificationUtilities'; +import { NotificationAlertType } from '../../views/notification-center/common/NotificationAlertType'; +import { NotificationUtilities } from '../../views/notification-center/common/NotificationUtilities'; import { CallForHelpResult } from './common/CallForHelpResult'; import { GetCloseReasonKey } from './common/GetCloseReasonKey'; diff --git a/src/views/help/HelpView.scss b/src/components/help/HelpView.scss similarity index 80% rename from src/views/help/HelpView.scss rename to src/components/help/HelpView.scss index b6ba7d76..02397a8a 100644 --- a/src/views/help/HelpView.scss +++ b/src/components/help/HelpView.scss @@ -1,6 +1,6 @@ .nitro-help { - height: 430px; - width: 300px; + height: $help-height; + width: $help-width; .index-image { background: url('../../assets/images/help/help_index.png'); diff --git a/src/components/help/HelpView.tsx b/src/components/help/HelpView.tsx new file mode 100644 index 00000000..63d315af --- /dev/null +++ b/src/components/help/HelpView.tsx @@ -0,0 +1,121 @@ +import { ILinkEventTracker } from '@nitrots/nitro-renderer'; +import { FC, useCallback, useEffect, useState } from 'react'; +import { AddEventLinkTracker, LocalizeText, RemoveLinkEventTracker } from '../../api'; +import { HelpReportUserEvent } from '../../events/help/HelpReportUserEvent'; +import { useUiEvent } from '../../hooks'; +import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../layout'; +import { IHelpReportState } from './common/IHelpReportState'; +import { HelpContextProvider } from './HelpContext'; +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'; + +export const HelpView: FC<{}> = props => +{ + const [ isVisible, setIsVisible ] = useState(false); + const [ helpReportState, setHelpReportState ] = useState({ + reportedUserId: -1, + reportedChats: [], + cfhCategory: -1, + cfhTopic: -1, + roomId: -1, + message: '', + currentStep: 0 + }); + + const linkReceived = useCallback((url: string) => + { + const parts = url.split('/'); + + if(parts.length < 2) return; + + switch(parts[1]) + { + case 'show': + setIsVisible(true); + return; + case 'hide': + setIsVisible(false); + return; + case 'toggle': + setIsVisible(prevValue => !prevValue); + return; + } + }, []); + + const onHelpReportUserEvent = useCallback((event: HelpReportUserEvent) => + { + setHelpReportState({ + reportedUserId: event.reportedUserId, + reportedChats: [], + cfhCategory: -1, + cfhTopic: -1, + roomId: -1, + message: '', + currentStep: 2 + }); + + setIsVisible(true); + }, []); + + useUiEvent(HelpReportUserEvent.REPORT_USER, onHelpReportUserEvent); + + useEffect(() => + { + const linkTracker: ILinkEventTracker = { + linkReceived, + eventUrlPrefix: 'help/' + }; + + AddEventLinkTracker(linkTracker); + + return () => RemoveLinkEventTracker(linkTracker); + }, [ linkReceived ]); + + useEffect(() => + { + if(!isVisible) return; + + setHelpReportState({ + reportedUserId: -1, + reportedChats: [], + cfhCategory: -1, + cfhTopic: -1, + roomId: -1, + message: '', + currentStep: 0 + }); + }, [ isVisible ]); + + const CurrentStepView = useCallback(() => + { + switch(helpReportState.currentStep) + { + case 0: return + case 1: return + case 2: return + case 3: return + case 4: return + } + + return null; + }, [helpReportState.currentStep]); + + return ( + + + { isVisible && + + setIsVisible(false) } /> + + + + } + + + ); +} diff --git a/src/views/help/common/CallForHelpResult.ts b/src/components/help/common/CallForHelpResult.ts similarity index 100% rename from src/views/help/common/CallForHelpResult.ts rename to src/components/help/common/CallForHelpResult.ts diff --git a/src/views/help/common/GetCloseReasonKey.ts b/src/components/help/common/GetCloseReasonKey.ts similarity index 100% rename from src/views/help/common/GetCloseReasonKey.ts rename to src/components/help/common/GetCloseReasonKey.ts diff --git a/src/components/help/common/IHelpReportState.ts b/src/components/help/common/IHelpReportState.ts new file mode 100644 index 00000000..eba3d2b6 --- /dev/null +++ b/src/components/help/common/IHelpReportState.ts @@ -0,0 +1,11 @@ +import { IChatEntry } from '../../../views/chat-history/context/ChatHistoryContext.types'; + +export interface IHelpReportState { + reportedUserId: number; + reportedChats: IChatEntry[]; + cfhCategory: number; + cfhTopic: number; + roomId: number; + message: string; + currentStep: number; +} diff --git a/src/views/help/common/IUser.ts b/src/components/help/common/IReportedUser.ts similarity index 57% rename from src/views/help/common/IUser.ts rename to src/components/help/common/IReportedUser.ts index bd3852ab..90a3887e 100644 --- a/src/views/help/common/IUser.ts +++ b/src/components/help/common/IReportedUser.ts @@ -1,4 +1,4 @@ -export interface IUser +export interface IReportedUser { id: number; username: string; diff --git a/src/views/help/views/DescribeReportView.tsx b/src/components/help/views/DescribeReportView.tsx similarity index 85% rename from src/views/help/views/DescribeReportView.tsx rename to src/components/help/views/DescribeReportView.tsx index f936d225..d6f1ff7a 100644 --- a/src/views/help/views/DescribeReportView.tsx +++ b/src/components/help/views/DescribeReportView.tsx @@ -1,9 +1,8 @@ import { CallForHelpMessageComposer } from '@nitrots/nitro-renderer'; import { FC, useCallback, useState } from 'react'; -import { LocalizeText } from '../../../api'; -import { HelpEvent } from '../../../events/help/HelpEvent'; -import { dispatchUiEvent, SendMessageHook } from '../../../hooks'; -import { useHelpContext } from '../context/HelpContext'; +import { CreateLinkEvent, LocalizeText } from '../../../api'; +import { SendMessageHook } from '../../../hooks'; +import { useHelpContext } from '../HelpContext'; export const DescribeReportView: FC<{}> = props => { @@ -30,7 +29,7 @@ export const DescribeReportView: FC<{}> = props => SendMessageHook(new CallForHelpMessageComposer(message, reportState.cfhTopic, reportState.reportedUserId, roomId, chats)); - dispatchUiEvent(new HelpEvent(HelpEvent.HIDE_HELP_CENTER)); + CreateLinkEvent('help/hide'); }, [helpReportState, message, setHelpReportState]); return ( diff --git a/src/components/help/views/HelpIndexView.tsx b/src/components/help/views/HelpIndexView.tsx new file mode 100644 index 00000000..7f6fc743 --- /dev/null +++ b/src/components/help/views/HelpIndexView.tsx @@ -0,0 +1,46 @@ +import { GetCfhStatusMessageComposer } from '@nitrots/nitro-renderer'; +import { FC, useCallback } from 'react'; +import { LocalizeText } from '../../../api'; +import { Button } from '../../../common/Button'; +import { Column } from '../../../common/Column'; +import { Grid } from '../../../common/Grid'; +import { Text } from '../../../common/Text'; +import { SendMessageHook } from '../../../hooks'; +import { useHelpContext } from '../HelpContext'; + +export const HelpIndexView: FC<{}> = props => +{ + const { helpReportState = null, setHelpReportState = null } = useHelpContext(); + + const onReportClick = useCallback(() => + { + const reportState = Object.assign({}, helpReportState ); + reportState.currentStep = 1; + setHelpReportState(reportState); + },[helpReportState, setHelpReportState]); + + const onRequestMySanctionStatusClick = useCallback(() => + { + SendMessageHook(new GetCfhStatusMessageComposer(false)); + }, []); + + return ( + + +
+ + + + { LocalizeText('help.main.frame.title') } + { LocalizeText('help.main.self.description') } + + + + + + + + + + ) +} diff --git a/src/views/help/views/SanctionStatusView.tsx b/src/components/help/views/SanctionStatusView.tsx similarity index 100% rename from src/views/help/views/SanctionStatusView.tsx rename to src/components/help/views/SanctionStatusView.tsx diff --git a/src/views/help/views/SelectReportedChatsView.tsx b/src/components/help/views/SelectReportedChatsView.tsx similarity index 93% rename from src/views/help/views/SelectReportedChatsView.tsx rename to src/components/help/views/SelectReportedChatsView.tsx index ce1080b1..182410f2 100644 --- a/src/views/help/views/SelectReportedChatsView.tsx +++ b/src/components/help/views/SelectReportedChatsView.tsx @@ -2,9 +2,9 @@ import { RoomObjectType } from '@nitrots/nitro-renderer'; import { FC, useCallback, useMemo, useState } from 'react'; import { LocalizeText } from '../../../api'; import { NitroCardGridItemView, NitroCardGridView } from '../../../layout'; -import { GetChatHistory } from '../../chat-history/common/GetChatHistory'; -import { ChatEntryType, IChatEntry } from '../../chat-history/context/ChatHistoryContext.types'; -import { useHelpContext } from '../context/HelpContext'; +import { GetChatHistory } from '../../../views/chat-history/common/GetChatHistory'; +import { ChatEntryType, IChatEntry } from '../../../views/chat-history/context/ChatHistoryContext.types'; +import { useHelpContext } from '../HelpContext'; export const SelectReportedChatsView: FC<{}> = props => { diff --git a/src/components/help/views/SelectReportedUserView.tsx b/src/components/help/views/SelectReportedUserView.tsx new file mode 100644 index 00000000..72ce9611 --- /dev/null +++ b/src/components/help/views/SelectReportedUserView.tsx @@ -0,0 +1,100 @@ +import { RoomObjectType } from '@nitrots/nitro-renderer'; +import { FC, useCallback, useMemo, useState } from 'react'; +import { GetSessionDataManager, LocalizeText } from '../../../api'; +import { Base } from '../../../common/Base'; +import { Button } from '../../../common/Button'; +import { Column } from '../../../common/Column'; +import { Flex } from '../../../common/Flex'; +import { Grid } from '../../../common/Grid'; +import { LayoutGridItem } from '../../../common/layout/LayoutGridItem'; +import { Text } from '../../../common/Text'; +import { GetChatHistory } from '../../../views/chat-history/common/GetChatHistory'; +import { ChatEntryType } from '../../../views/chat-history/context/ChatHistoryContext.types'; +import { IReportedUser } from '../common/IReportedUser'; +import { useHelpContext } from '../HelpContext'; + +export const SelectReportedUserView: FC<{}> = props => +{ + const [ selectedUserId, setSelectedUserId ] = useState(-1); + const { helpReportState = null, setHelpReportState = null } = useHelpContext(); + + const availableUsers = useMemo(() => + { + const users: Map = new Map(); + + GetChatHistory().chats + .forEach(chat => + { + if((chat.type === ChatEntryType.TYPE_CHAT) && (chat.entityType === RoomObjectType.USER) && (chat.entityId !== GetSessionDataManager().userId)) + { + if(!users.has(chat.entityId)) + { + users.set(chat.entityId, { id: chat.entityId, username: chat.name }) + } + } + }); + + return Array.from(users.values()); + }, []); + + const submitUser = useCallback(() => + { + if(selectedUserId <= 0) return; + + const reportState = Object.assign({}, helpReportState); + reportState.reportedUserId = selectedUserId; + reportState.currentStep = 2; + setHelpReportState(reportState); + }, [helpReportState, selectedUserId, setHelpReportState]); + + const selectUser = useCallback((userId: number) => + { + if(selectedUserId === userId) setSelectedUserId(-1); + else setSelectedUserId(userId); + }, [selectedUserId]); + + const back = useCallback(() => + { + const reportState = Object.assign({}, helpReportState); + reportState.currentStep = --reportState.currentStep; + setHelpReportState(reportState); + }, [helpReportState, setHelpReportState]); + + return ( + + + + + + + { LocalizeText('help.emergency.main.step.two.title') } + { (availableUsers.length > 0) && + { LocalizeText('report.user.pick.user') } } + + + { !!!availableUsers.length && + { LocalizeText('report.user.error.nolist') } } + { (availableUsers.length > 0) && + + { availableUsers.map((user, index) => + { + return ( + selectUser(user.id) } itemActive={ (selectedUserId === user.id) }> + + + ); + }) } + } + + + + + + + + ) +} diff --git a/src/views/help/views/SelectTopicView.tsx b/src/components/help/views/SelectTopicView.tsx similarity index 95% rename from src/views/help/views/SelectTopicView.tsx rename to src/components/help/views/SelectTopicView.tsx index 654f6cc3..a5921c21 100644 --- a/src/views/help/views/SelectTopicView.tsx +++ b/src/components/help/views/SelectTopicView.tsx @@ -1,7 +1,7 @@ import { FC, useCallback, useMemo, useState } from 'react'; import { LocalizeText } from '../../../api'; -import { GetCfhCategories } from '../../mod-tools/common/GetCFHCategories'; -import { useHelpContext } from '../context/HelpContext'; +import { GetCfhCategories } from '../../../views/mod-tools/common/GetCFHCategories'; +import { useHelpContext } from '../HelpContext'; export const SelectTopicView: FC<{}> = props => { diff --git a/src/components/index.scss b/src/components/index.scss index 56a8c8ad..2dcfaf9b 100644 --- a/src/components/index.scss +++ b/src/components/index.scss @@ -2,6 +2,7 @@ @import './avatar-editor/AvatarEditorView'; @import './camera/CameraWidgetView'; @import './catalog/CatalogView'; +@import './help/HelpView'; @import './inventory/InventoryView'; @import './navigator/NavigatorView'; @import './toolbar/ToolbarView'; diff --git a/src/events/help/HelpEvent.ts b/src/events/help/HelpEvent.ts deleted file mode 100644 index 1403f20f..00000000 --- a/src/events/help/HelpEvent.ts +++ /dev/null @@ -1,8 +0,0 @@ -import { NitroEvent } from '@nitrots/nitro-renderer'; - -export class HelpEvent extends NitroEvent -{ - public static SHOW_HELP_CENTER: string = 'HCE_SHOW_HELP_CENTER'; - public static HIDE_HELP_CENTER: string = 'HCE_HIDE_HELP_CENTER'; - public static TOGGLE_HELP_CENTER: string = 'HCE_TOGGLE_HELP_CENTER'; -} diff --git a/src/events/help/HelpReportUserEvent.ts b/src/events/help/HelpReportUserEvent.ts index b4711b76..82148610 100644 --- a/src/events/help/HelpReportUserEvent.ts +++ b/src/events/help/HelpReportUserEvent.ts @@ -1,6 +1,6 @@ -import { HelpEvent } from './HelpEvent'; +import { NitroEvent } from '@nitrots/nitro-renderer'; -export class HelpReportUserEvent extends HelpEvent +export class HelpReportUserEvent extends NitroEvent { public static REPORT_USER: string = 'HCE_HELP_CENTER_REPORT_USER'; diff --git a/src/views/Styles.scss b/src/views/Styles.scss index 29280d21..127ef9e0 100644 --- a/src/views/Styles.scss +++ b/src/views/Styles.scss @@ -13,7 +13,6 @@ @import "./user-settings/UserSettingsView"; @import "./user-profile/UserProfileVew"; @import "./chat-history/ChatHistoryView"; -@import "./help/HelpView"; @import "./floorplan-editor/FloorplanEditorView"; @import "./nitropedia/NitropediaView"; @import "./hc-center/HcCenterView.scss"; diff --git a/src/views/help/HelpView.tsx b/src/views/help/HelpView.tsx deleted file mode 100644 index 9ebea6eb..00000000 --- a/src/views/help/HelpView.tsx +++ /dev/null @@ -1,81 +0,0 @@ -import { FC, useCallback, useState } from 'react'; -import { LocalizeText } from '../../api'; -import { HelpEvent } from '../../events/help/HelpEvent'; -import { HelpReportUserEvent } from '../../events/help/HelpReportUserEvent'; -import { useUiEvent } from '../../hooks'; -import { NitroCardContentView, NitroCardHeaderView, NitroCardView } from '../../layout'; -import { HelpContextProvider } from './context/HelpContext'; -import { IHelpReportState, initialReportState } from './context/HelpContext.types'; -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'; - -export const HelpView: FC<{}> = props => -{ - const [isVisible, setIsVisible] = useState(false); - const [ helpReportState, setHelpReportState ] = useState(initialReportState); - - const onHelpEvent = useCallback((event: HelpEvent) => - { - setHelpReportState(initialReportState); - - switch(event.type) - { - case HelpEvent.SHOW_HELP_CENTER: - setIsVisible(true); - break; - case HelpEvent.HIDE_HELP_CENTER: - setIsVisible(false); - break; - case HelpEvent.TOGGLE_HELP_CENTER: - setIsVisible(!isVisible); - break; - case HelpReportUserEvent.REPORT_USER: - const reportEvent = event as HelpReportUserEvent; - const reportState = Object.assign({}, helpReportState ); - reportState.reportedUserId = reportEvent.reportedUserId; - reportState.currentStep = 2; - setHelpReportState(reportState); - setIsVisible(true); - break; - } - }, [helpReportState, isVisible]); - - useUiEvent(HelpEvent.TOGGLE_HELP_CENTER, onHelpEvent); - useUiEvent(HelpEvent.SHOW_HELP_CENTER, onHelpEvent); - useUiEvent(HelpEvent.HIDE_HELP_CENTER, onHelpEvent); - useUiEvent(HelpReportUserEvent.REPORT_USER, onHelpEvent); - - const CurrentStepView = useCallback(() => - { - switch(helpReportState.currentStep) - { - case 0: return - case 1: return - case 2: return - case 3: return - case 4: return - } - - return null; - }, [helpReportState.currentStep]); - - return ( - - - {isVisible && - - setIsVisible(false)} /> - - - - - } - - - ); -} diff --git a/src/views/help/context/HelpContext.tsx b/src/views/help/context/HelpContext.tsx deleted file mode 100644 index 2cad4a52..00000000 --- a/src/views/help/context/HelpContext.tsx +++ /dev/null @@ -1,14 +0,0 @@ -import { createContext, FC, useContext } from 'react'; -import { HelpContextProps, IHelpContext } from './HelpContext.types'; - -const HelpContext = createContext({ - helpReportState: null, - setHelpReportState: null -}); - -export const HelpContextProvider: FC = props => -{ - return { props.children } -} - -export const useHelpContext = () => useContext(HelpContext); diff --git a/src/views/help/context/HelpContext.types.ts b/src/views/help/context/HelpContext.types.ts deleted file mode 100644 index 9368308b..00000000 --- a/src/views/help/context/HelpContext.types.ts +++ /dev/null @@ -1,33 +0,0 @@ -import { ProviderProps } from 'react'; -import { IChatEntry } from '../../chat-history/context/ChatHistoryContext.types'; - -export interface IHelpContext -{ - helpReportState: IHelpReportState; - setHelpReportState: React.Dispatch>; -} - -export interface IHelpReportState { - reportedUserId: number; - reportedChats: IChatEntry[]; - cfhCategory: number; - cfhTopic: number; - roomId: number; - message: string; - currentStep: number; -} - -export const initialReportState: IHelpReportState = { - reportedUserId: -1, - reportedChats: [], - cfhCategory: -1, - cfhTopic: -1, - roomId: -1, - message: '', - currentStep: 0 -} - -export interface HelpContextProps extends ProviderProps -{ - -} diff --git a/src/views/help/views/HelpIndexView.tsx b/src/views/help/views/HelpIndexView.tsx deleted file mode 100644 index 27ce5a04..00000000 --- a/src/views/help/views/HelpIndexView.tsx +++ /dev/null @@ -1,43 +0,0 @@ -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 => -{ - const { helpReportState = null, setHelpReportState = null } = useHelpContext(); - - const onReportClick = useCallback(() => - { - const reportState = Object.assign({}, helpReportState ); - reportState.currentStep = 1; - setHelpReportState(reportState); - },[helpReportState, setHelpReportState]); - - const onRequestMySanctionStatusClick = useCallback(() => - { - SendMessageHook(new GetCfhStatusMessageComposer(false)); - }, []); - - return ( - <> -
-

{LocalizeText('help.main.frame.title')}

-
-

{LocalizeText('help.main.self.description')}

-
- -
- - - -
- -
- -
- - - ) -} diff --git a/src/views/help/views/SelectReportedUserView.tsx b/src/views/help/views/SelectReportedUserView.tsx deleted file mode 100644 index 7f9aefdb..00000000 --- a/src/views/help/views/SelectReportedUserView.tsx +++ /dev/null @@ -1,88 +0,0 @@ -import { RoomObjectType } from '@nitrots/nitro-renderer'; -import { FC, useCallback, useMemo, useState } from 'react'; -import { GetSessionDataManager, LocalizeText } from '../../../api'; -import { NitroCardGridItemView, NitroCardGridView } from '../../../layout'; -import { GetChatHistory } from '../../chat-history/common/GetChatHistory'; -import { ChatEntryType } from '../../chat-history/context/ChatHistoryContext.types'; -import { IUser } from '../common/IUser'; -import { useHelpContext } from '../context/HelpContext'; - -export const SelectReportedUserView: FC<{}> = props => -{ - const { helpReportState = null, setHelpReportState = null } = useHelpContext(); - const [selectedUserId, setSelectedUserId] = useState(-1); - - const availableUsers = useMemo(() => - { - const users: Map = new Map(); - - GetChatHistory().chats - .forEach(chat => - { - if((chat.type === ChatEntryType.TYPE_CHAT) && (chat.entityType === RoomObjectType.USER) && (chat.entityId !== GetSessionDataManager().userId)) - { - if(!users.has(chat.entityId)) - { - users.set(chat.entityId, { id: chat.entityId, username: chat.name }) - } - } - }); - - return Array.from(users.values()); - }, []); - - const submitUser = useCallback(() => - { - if(selectedUserId <= 0) return; - - const reportState = Object.assign({}, helpReportState); - reportState.reportedUserId = selectedUserId; - reportState.currentStep = 2; - setHelpReportState(reportState); - }, [helpReportState, selectedUserId, setHelpReportState]); - - const selectUser = useCallback((userId: number) => - { - if(selectedUserId === userId) setSelectedUserId(-1); - else setSelectedUserId(userId); - }, [selectedUserId]); - - const back = useCallback(() => - { - const reportState = Object.assign({}, helpReportState); - reportState.currentStep = --reportState.currentStep; - setHelpReportState(reportState); - }, [helpReportState, setHelpReportState]); - - return ( - <> -
-

{LocalizeText('help.emergency.main.step.two.title')}

-

{(availableUsers.length > 0) ? LocalizeText('report.user.pick.user') : ''}

-
- { - (availableUsers.length <= 0) &&
{LocalizeText('report.user.error.nolist')}
- } - { - (availableUsers.length > 0) && - <> - - {availableUsers.map((user, index) => - { - return ( - selectUser(user.id)} itemActive={(selectedUserId === user.id)}> - - - ) - })} - - -
- - -
- - } - - ) -} diff --git a/src/views/main/MainView.tsx b/src/views/main/MainView.tsx index 7c1d36cb..36790abc 100644 --- a/src/views/main/MainView.tsx +++ b/src/views/main/MainView.tsx @@ -5,6 +5,7 @@ import { AchievementsView } from '../../components/achievements/AchievementsView import { AvatarEditorView } from '../../components/avatar-editor/AvatarEditorView'; import { CameraWidgetView } from '../../components/camera/CameraWidgetView'; import { CatalogView } from '../../components/catalog/CatalogView'; +import { HelpView } from '../../components/help/HelpView'; import { InventoryView } from '../../components/inventory/InventoryView'; import { NavigatorView } from '../../components/navigator/NavigatorView'; import { ToolbarView } from '../../components/toolbar/ToolbarView'; @@ -17,7 +18,6 @@ import { FloorplanEditorView } from '../floorplan-editor/FloorplanEditorView'; import { FriendsView } from '../friends/FriendsView'; import { GroupsView } from '../groups/GroupsView'; import { HcCenterView } from '../hc-center/HcCenterView'; -import { HelpView } from '../help/HelpView'; import { HotelView } from '../hotel-view/HotelView'; import { ModToolsView } from '../mod-tools/ModToolsView'; import { NitropediaView } from '../nitropedia/NitropediaView'; diff --git a/src/views/purse/PurseView.tsx b/src/views/purse/PurseView.tsx index 89a06071..5fd95166 100644 --- a/src/views/purse/PurseView.tsx +++ b/src/views/purse/PurseView.tsx @@ -1,8 +1,7 @@ import { FriendlyTime, HabboClubLevelEnum, UserCurrencyComposer, UserSubscriptionComposer } from '@nitrots/nitro-renderer'; import { FC, useCallback, useEffect, useMemo, useState } from 'react'; -import { GetConfiguration, LocalizeText } from '../../api'; +import { CreateLinkEvent, GetConfiguration, LocalizeText } from '../../api'; import { HcCenterEvent } from '../../events/hc-center/HcCenterEvent'; -import { HelpEvent } from '../../events/help/HelpEvent'; import { UserSettingsUIEvent } from '../../events/user-settings/UserSettingsUIEvent'; import { dispatchUiEvent } from '../../hooks'; import { SendMessageHook } from '../../hooks/messages/message-event'; @@ -28,7 +27,7 @@ export const PurseView: FC<{}> = props => const handleHelpCenterClick = useCallback(() => { - dispatchUiEvent(new HelpEvent(HelpEvent.TOGGLE_HELP_CENTER)); + CreateLinkEvent('help/show'); }, []); const handleHcCenterClick = useCallback(() =>