Skip to content

Moving to Lumo UI ​

For a full step-by-step install per framework (QBCore, Qbox, ESX, standalone), see Installation. This page is the reference for the shims and the notify/HUD/radial details.

Lumo UI takes over jobs that several resources used to do. The [compat] folder keeps your other scripts working without edits: each shim has the same name as the resource it replaces and forwards its exports and events to lumo-ui.

ShimReplacesKeeps working
qb-targetqb-target, qtargetexports['qb-target']:*, exports.qtarget:*, qb-target:client:*
qb-menuqb-menuexports['qb-menu']:openMenu/closeMenu/showHeader, qb-menu:client:openMenu/closeMenu
qb-inputqb-inputexports['qb-input']:ShowInput
qb-radialmenuqb-radialmenuexports['qb-radialmenu']:AddOption/RemoveOption, open/close events
progressbarprogressbarexports['progressbar']:Progress*, progressbar:client:*, QBCore.Functions.Progressbar
esx_notifyesx_notifyESX.ShowNotification, ESX:Notify (ESX only)
esx_progressbaresx_progressbarESX.Progressbar, exports.esx_progressbar:Progressbar/CancelProgressbar (ESX only)
esx_textuiesx_textuiESX.TextUI, ESX.HideUI, ESX:TextUI / ESX:HideUI (ESX only)
lumo-hud-uiearlier Lumo HUDexports['lumo-hud-ui']:* used by older Lumo products

Steps ​

  1. Back up resources/ and server.cfg.
  2. Stop the old resources. Remove or comment out their ensure lines and move their folders out of resources/ (a shim and the original cannot both exist: FiveM refuses two resources with one name). Usually: qb-hud, qb-target (or qtarget), qb-menu, qb-input, qb-radialmenu, progressbar, and on ESX esx_notify.
  3. Ensure lumo-ui, then the shims you need (see the README).
  4. Restart the whole server once. After that, /uirestart (admins) restarts lumo-ui and the shims in the right order.

Only ensure the shims for resources you actually removed. A server without qb-input has no use for the qb-input shim.

Notifications per framework ​

  • QBCore — make QBCore.Functions.Notify hand over to lumo-ui. In qb-core/client/functions.lua, at the top of QBCore.Functions.Notify:

    lua
    if GetResourceState('lumo-ui') == 'started' then
        return exports['lumo-ui']:Notify(text, texttype, length, icon)
    end

    QBCore:Notify (server → client) goes through the same function.

  • Qbox — qbx_core sends notifications through ox_lib. To have lumo-ui draw them, edit Notify in qbx_core/client/functions.lua and qbx_core/server/functions.lua (exact lines in INSTALLATION.md → Qbox); otherwise ox_lib keeps drawing them and nothing breaks.

  • ESX — ensure the esx_notify shim (and remove the original). ESX Legacy calls exports.esx_notify:Notify for every ESX.ShowNotification. The esx_progressbar and esx_textui shims do the same for ESX.Progressbar and ESX.TextUI.

  • Standalone — call exports['lumo-ui']:Notify(...) or trigger lumo-ui:client:notify.

HUD ​

  • Status bars. QBCore/Qbox: read from player metadata and the hud:client:UpdateNeeds / UpdateStress events, as qb-hud did. ESX: from esx_status (hunger, thirst; stress if you add it). Anything else: exports['lumo-ui']:SetStatus('hunger', 80).
  • Stress is stored in metadata.stress (QBCore/Qbox), setMeta('stress') (ESX) or a player state bag (standalone). hud:server:GainStress and RelieveStress work as before. Jobs in Hud.Stress.WhitelistedJobs gain none.
  • Fuel with Hud.Fuel = 'auto': the GetFuel export of LegacyFuel, cdn-fuel, ps-fuel, lc_fuel or qb-fuel, then the vehicle's fuel state bag (ox_fuel), then the game's own fuel level.
  • Seatbelt, cruise, harness, nitrous: the seatbelt:client:* and hud:client:* events from qb-hud and qb-smallresources are handled.
  • Minimap shapes. Circle and square masks are drawn from the game's own textures. If you stream your own squaremap / circlemap textures, list them in Hud.RadarMaskTextures.

Radial menu ​

Items from your old qb-radialmenu/config.lua go into LumoUiConfig.Radial.Items (same fields) or JobItems (by job name). Scripts that call exports['qb-radialmenu']:AddOption(...) keep working through the shim; their items are removed when the calling resource stops.

The built-in vehicle menu (seats, engine, doors, extras) shows while you are seated. If your server opens doors from the target eye instead, set VehicleMenu = { Seats = true, Engine = false, Doors = false, Extras = true }.

Target ​

PolyZone is not needed for lumo-ui's zones. Keep PolyZone if other scripts use it directly. While the eye is open, zone centres are marked (Target.ZoneMarkers). Admins can run /targetdebug to add test options to every ped, vehicle and object.

What resets ​

Player /ui choices (preset, layout, minimap mode) are saved per resource, so moving from the old Lumo HUD or qb-hud starts players on LumoUiConfig.PlayerDefaults once.

Going back ​

Stop lumo-ui and the shims, put the original resources back, restore your server.cfg. Nothing in the database is changed by lumo-ui except the stress value it shares with qb-hud.