fix: sending data to ui before being loaded

src/client/index.ts

@@ -4,16 +4,12 @@ import { Character, NewCharacter } from '@overextended/ox_core';
 const SPAWN_LOCATION = JSON.parse(GetConvar('ox:spawnLocation', "[-258.211, -293.077, 21.6132, 206.0]"));
 const CHARACTER_SLOTS = GetConvarInt('ox:characterSlots', 1);
 
-setTimeout(() => SendNUIMessage({
-    action: 'setConfig',
-    data: {
-      maxSlots: CHARACTER_SLOTS
-    }
-  }), 250
-);
+let uiLoaded = false;
 
 onNet('ox:startCharacterSelect', async (_userId: number, characters: Character[]) => {
 
+  while (!uiLoaded) await sleep(5);
+
   SendNUIMessage({
     action: 'setData',
     data: {
@@ -70,14 +66,14 @@ onNet('ox:startCharacterSelect', async (_userId: number, characters: Character[]
   // emitNet('ox:setActiveCharacter', characters[0].charId);
 });
 
-interface newCharacterData {
-  firstName: string;
-  lastName: string;
-  gender: string;
-  date: number;
-}
+RegisterNuiCallback('mps-multichar:setConfig', (data: boolean, cb: (data: unknown) => void) => {
+  uiLoaded = data;
+  cb({
+    maxSlots: CHARACTER_SLOTS
+  })
+})
 
-RegisterNuiCallback('mps-multichar:registerIdentity', (data: newCharacterData, cb: (data: unknown) => void) => {
+RegisterNuiCallback('mps-multichar:registerIdentity', (data: NewCharacter, cb: (data: unknown) => void) => {
 
   SwitchInPlayer(PlayerPedId());
   SetGameplayCamRelativeHeading(0);

web/src/App.tsx

@@ -1,27 +1,33 @@
 import { useEffect, useState } from 'react';
 import { isEnvBrowser } from './utils/misc';
 import { useNuiEvent } from './hooks/useNuiEvent';
+import { fetchNui } from './utils/fetchNui';
 import Identity from './pages/Identity';
 import DevDrawer from './utils/DevDrawer';
 import Multichar from './pages/MultiChar';
 
 import { Character } from '@overextended/ox_core';
 
 function App() {
+  const [loaded, setLoaded] = useState<boolean>(false);
   const [visible, setVisible] = useState<boolean>(isEnvBrowser());
   const [page, setPage] = useState<string>('identity');
   const [charSlots, setCharSlots] = useState<number>(1);
   const [characters, setCharacters] = useState<Character[]>([]);
 
+  if (!loaded) {
+    fetchNui('mps-multichar:setConfig', true, {data: {maxSlots: 5}})
+    .then(r => {
+      setLoaded(true);
+      setCharSlots(r.maxSlots);
+    });
+  }
+
   useNuiEvent('setVisible', (data: { visible?: boolean, page?: string }) => {
     setVisible(data.visible || false);
     if (data.page) setPage(data.page);
   });
 
-  useNuiEvent('setConfig', (data: {maxSlots: number}) => {
-    setCharSlots(data.maxSlots);
-  });
-
   useNuiEvent('setData', (data: {characters?: Character[]}) => {
     if (data.characters) setCharacters(data.characters);
   });