Fix: Player ready stuff

phone/src/Phone.tsx

@@ -10,7 +10,7 @@ import { Navigation } from './os/navigation-bar/components/Navigation';
 import { useSimcardService } from './os/simcard/hooks/useSimcardService';
 import { usePhoneService } from './os/phone/hooks/usePhoneService';
 import { useApps } from './os/apps/hooks/useApps';
-
+import { useNuiRequest } from 'fivem-nui-react-lib';
 import { useContactsService } from './apps/contacts/hooks/useContactsService';
 import { useTwitterService } from './apps/twitter/hooks/useTwitterService';
 import { useMatchService } from './apps/match/hooks/useMatchService';
@@ -47,6 +47,8 @@ function Phone() {
 
   const { addAlert } = useSnackbar();
 
+  const Nui = useNuiRequest();
+
   // Set language from local storage
   // This will only trigger on first mount & settings changes
   useEffect(() => {
@@ -65,6 +67,11 @@ function Phone() {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
+  useEffect(() => {
+    Nui.send(PhoneEvents.UI_IS_READY);
+    console.log('when are you firing the UI_IS_READY?');
+  }, [Nui]);
+
   useKeyboardService();
   usePhoneService();
   useSimcardService();
@@ -81,14 +88,10 @@ function Phone() {
 
   const { modal: callModal } = useCallModal();
 
-  //const { isPhoneReady } = usePhone();
-
   return (
     <div>
       <WindowSnackbar />
       <PhoneWrapper>
-        {/*{isPhoneReady ? (
-          <>*/}
         <NotificationBar />
         <div className="PhoneAppContainer">
           <>
@@ -102,23 +105,6 @@ function Phone() {
           <PhoneSnackbar />
         </div>
         <Navigation />
-        {/*</>
-        ) : (
-          <Box
-            component={Paper}
-            height="100%"
-            width="100%"
-            display="flex"
-            flexDirection="column"
-            alignItems="center"
-            justifyContent="center"
-          >
-            <Typography paragraph variant="h6">
-              NPWD {t('INITIALIZING')}
-            </Typography>
-            <Typography paragraph>{t('GENERIC_WAIT')}</Typography>
-          </Box>
-        )}*/}
       </PhoneWrapper>
     </div>
   );

phone/src/os/phone/hooks/state.ts

@@ -10,10 +10,6 @@ export const phoneState = {
     key: 'resourceConfig',
     default: null,
   }),
-  /*phoneReady: atom<boolean>({
-    key: 'phoneReady',
-    default: false,
-  }),*/
   phoneTime: atom<string>({
     key: 'phoneTime',
     default: null,

phone/src/os/phone/hooks/usePhone.ts

@@ -16,7 +16,6 @@ interface IUsePhone {
 export const usePhone = (): IUsePhone => {
   const Nui = useNuiRequest();
   const isPhoneOpen = useRecoilValue(phoneState.visibility);
-  //const isPhoneReady = useRecoilValue(phoneState.phoneReady);
   const config = useRecoilValue(phoneState.resourceConfig);
 
   const { removeAlerts } = useNotifications();
@@ -34,6 +33,5 @@ export const usePhone = (): IUsePhone => {
     closePhone,
     openPhone,
     isPhoneOpen,
-    //isPhoneReady,
   };
 };

phone/src/os/phone/hooks/usePhoneService.ts

@@ -1,22 +1,12 @@
-import { useNuiEvent, useNuiRequest } from 'fivem-nui-react-lib';
+import { useNuiEvent } from 'fivem-nui-react-lib';
 import { useSetRecoilState } from 'recoil';
 import { PhoneEvents } from '../../../../../typings/phone';
 import { phoneState } from './state';
-import { useEffect } from 'react';
 
 export const usePhoneService = () => {
-  const { send } = useNuiRequest();
-
-  // Let client know UI is ready to accept events
-  useEffect(() => {
-    send(PhoneEvents.UI_IS_READY);
-  }, [send]);
-
   const setVisibility = useSetRecoilState(phoneState.visibility);
   const setResourceConfig = useSetRecoilState(phoneState.resourceConfig);
-  //const setPhoneReady = useSetRecoilState(phoneState.phoneReady);
   const setPhoneTime = useSetRecoilState(phoneState.phoneTime);
-  //useNuiEvent('PHONE', PhoneEvents.SET_PHONE_READY, setPhoneReady);
   useNuiEvent('PHONE', PhoneEvents.SET_VISIBILITY, setVisibility);
   useNuiEvent('PHONE', PhoneEvents.SET_CONFIG, setResourceConfig);
   useNuiEvent('PHONE', PhoneEvents.SET_TIME, setPhoneTime);

resources/client/cl_main.ts

@@ -25,6 +25,12 @@ function fetchOnInitialize() {
   sendMessage('PHONE', PhoneEvents.SET_CONFIG, config);
 }
 
+if (config.general.enableMultiChar) {
+  onNet(PhoneEvents.ON_INIT, () => {
+    fetchOnInitialize();
+  });
+}
+
 RegisterKeyMapping('phone', 'Open Phone', 'keyboard', 'f1');
 
 const getCurrentGameTime = () => {

resources/server/players/player.controller.ts

@@ -1,8 +1,9 @@
 import { getSource } from '../utils/miscUtils';
 import PlayerService from './player.service';
-import { config } from '../server';
+import { config, ESX } from '../server';
 import { PlayerAddData } from './player.interfaces';
 import { playerLogger } from './player.utils';
+import { XPlayer } from 'esx.js/@types/server';
 
 /**
  * Essentially this whole file acts as a controller layer
@@ -52,6 +53,37 @@ if (!config.general.enableMultiChar) {
   });
 }
 
+//// comment out this if you're not using ESX, idk. Testing purpose
+
+if (config.general.enableMultiChar) {
+  on('onServerResourceStart', async (resource: string) => {
+    if (resource === GetCurrentResourceName()) {
+      // Workaround till https://github.com/citizenfx/fivem/pull/682
+      // is merged
+      // @ts-ignore
+      const onlinePlayers: XPlayer[] = ESX.GetPlayers();
+      console.log(onlinePlayers);
+      for (const id of onlinePlayers) {
+        const Player = ESX.GetPlayerFromId(id);
+        const source = Player.source;
+        const identifier = Player.getIdentifier();
+        const firstname = Player.getName();
+        await PlayerService.handleNewPlayerEvent({ source, identifier, firstname });
+      }
+    }
+  });
+}
+
+on('esx:playerLoaded', (playerId: number, xPlayer: XPlayer) => {
+  emit('npwd:newPlayer', {
+    source: playerId,
+    identifier: xPlayer.getIdentifier(),
+    firstname: xPlayer.getName(),
+  });
+});
+
+////
+
 // For multicharacter frameworks, we enable these events for
 // instantiating/deleting a player. The config option must be set to true
 // for these to be available

resources/server/players/player.service.ts

@@ -178,6 +178,8 @@ class _PlayerService {
 
     playerLogger.info(`New NPWD Player added through event (${src}) (${identifier})`);
     playerLogger.debug(player);
+
+    emitNet(PhoneEvents.ON_INIT, src);
   }
 
   /**