feat(menu): Open Menu with specified item index selected

* Allows a user to pass in a start index to have pre-selected when a menu is opening
* Cleaned up whitespace inconsistencies in menu.lua
This commit is contained in:
Jag
2022-09-17 11:03:10 -07:00
parent cd8e4bbd4d
commit 47163748d5
2 changed files with 30 additions and 27 deletions

View File

@@ -10,7 +10,7 @@ function lib.registerMenu(data, cb)
registeredMenus[data.id] = data registeredMenus[data.id] = data
end end
function lib.showMenu(id) function lib.showMenu(id, startIndex)
local menu = registeredMenus[id] local menu = registeredMenus[id]
if not menu then if not menu then
@@ -45,7 +45,8 @@ function lib.showMenu(id)
position = menu.position, position = menu.position,
canClose = menu.canClose, canClose = menu.canClose,
title = menu.title, title = menu.title,
items = menu.options items = menu.options,
startItemIndex = startIndex and startIndex - 1 or 0
} }
}) })
end end
@@ -98,7 +99,6 @@ RegisterNUICallback('confirmSelected', function(data, cb)
if menu.cb then if menu.cb then
menu.cb(data[1], data[2], menu.options[data[1]].args) menu.cb(data[1], data[2], menu.options[data[1]].args)
end end
end) end)
RegisterNUICallback('changeIndex', function(data, cb) RegisterNUICallback('changeIndex', function(data, cb)

View File

@@ -23,6 +23,7 @@ export interface MenuSettings {
title: string; title: string;
canClose?: boolean; canClose?: boolean;
items: Array<MenuItem>; items: Array<MenuItem>;
startItemIndex?: number;
} }
const ListMenu: React.FC = () => { const ListMenu: React.FC = () => {
@@ -121,7 +122,9 @@ const ListMenu: React.FC = () => {
useNuiEvent('closeMenu', () => closeMenu(true)); useNuiEvent('closeMenu', () => closeMenu(true));
useNuiEvent('setMenu', (data: MenuSettings) => { useNuiEvent('setMenu', (data: MenuSettings) => {
setSelected(0); 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);
if (!data.position) data.position = 'top-left'; if (!data.position) data.position = 'top-left';
listRefs.current = []; listRefs.current = [];
setMenu(data); setMenu(data);
@@ -131,7 +134,7 @@ const ListMenu: React.FC = () => {
if (Array.isArray(data.items[i].values)) arrayIndexes[i] = (data.items[i].defaultIndex || 1) - 1; if (Array.isArray(data.items[i].values)) arrayIndexes[i] = (data.items[i].defaultIndex || 1) - 1;
} }
setIndexStates(arrayIndexes); setIndexStates(arrayIndexes);
listRefs.current[0]?.focus(); listRefs.current[data.startItemIndex]?.focus();
}); });
return ( return (