mirror of
https://github.com/CommunityOx/ox_lib.git
synced 2026-08-17 06:56:03 +01:00
fix(web/menu): combine initial select and first render checks (#172)
* 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:
@@ -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 (
|
||||
|
||||
Reference in New Issue
Block a user