FumeNodes/ox_lib
1
0
Fork 0
mirror of https://github.com/CommunityOx/ox_lib.git synced 2026-08-17 23:16:03 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix(web/menu): combine initial select and first render checks (#172)

Browse Source 
* fix(web/menu): Combine initial select and first render

* Combining these checks should fix an issue of having to toggle a checkbox multiple times before it is recognized as being toggled

* Change firstRenderRef current value before first menu movement

* Too many async on change functions are happening let's handle this once the user decides to interact with the menu

* fix(web/menu): remove first render ref check for onSelected

Co-authored-by: Luke <sabolukas03@gmail.com>
This commit is contained in:
Jag
2022-12-14 09:59:49 -08:00
committed by GitHub
parent 944ca2eeee
commit 34022ce81e
1 changed files with 4 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
web/src/features/menu/list/index.tsx
View File

@@ -50,6 +50,7 @@ const ListMenu: React.FC = () => {
};
const moveMenu = (e: React.KeyboardEvent<HTMLDivElement>) => {
if (firstRenderRef.current) firstRenderRef.current = false;
switch (e.code) {
case 'ArrowDown':
setSelected((selected) => {
@@ -95,11 +96,7 @@ const ListMenu: React.FC = () => {
};
useEffect(() => {
if (menu.items[selected]?.checked === undefined) return;
if (firstRenderRef.current) {
firstRenderRef.current = false;
return;
}
if (menu.items[selected]?.checked === undefined || firstRenderRef.current) return;
const timer = setTimeout(() => {
fetchNui('changeChecked', [selected, checkedStates[selected]]).catch();
}, 100);
@@ -107,11 +104,7 @@ const ListMenu: React.FC = () => {
}, [checkedStates]);
useEffect(() => {
if (!menu.items[selected]?.values) return;
if (firstRenderRef.current) {
firstRenderRef.current = false;
return;
}
if (!menu.items[selected]?.values || firstRenderRef.current) return;
const timer = setTimeout(() => {
fetchNui('changeIndex', [selected, indexStates[selected]]).catch();
}, 100);
@@ -162,6 +155,7 @@ const ListMenu: React.FC = () => {
useNuiEvent('closeMenu', () => closeMenu(true, undefined, true));
useNuiEvent('setMenu', (data: MenuSettings) => {
firstRenderRef.current = true;
if (!data.startItemIndex || data.startItemIndex < 0) data.startItemIndex = 0;
else if (data.startItemIndex >= data.items.length) data.startItemIndex = data.items.length - 1;
setSelected(data.startItemIndex);
@@ -178,7 +172,6 @@ const ListMenu: React.FC = () => {
setIndexStates(arrayIndexes);
setCheckedStates(checkedIndexes);
listRefs.current[data.startItemIndex]?.focus();
firstRenderRef.current = true;
});
return (