# Interface (/docs/orbit-studios-resources/orbit-dynamichud/interface)



# Interface [#interface]

Interface integrations are UI features exposed through DynamicHUD or planned for DynamicHUD-style integration.

<Tabs items="['Notifications', 'TextUI', 'Skill Check', 'Progress Bar']">
  <Tab value="Notifications">
    DynamicHUD notifications use the client event `orbit-dynamichud:notify`.

    ```lua title="resources/[custom]/client/notifications.lua"
    TriggerEvent('orbit-dynamichud:notify', {
        description = 'Vehicle locked',
        type = 'success',
        duration = 3000
    })
    ```

    Server scripts should send the notification to a specific player with `TriggerClientEvent`.

    ```lua title="resources/[custom]/server/main.lua"
    TriggerClientEvent('orbit-dynamichud:notify', source, {
        description = 'Welcome back',
        type = 'info',
        duration = 3000
    })
    ```

    When using `orbit-lib`, set `Config.Notify = 'orbit-dynamichud'` if you want supported Orbit resources to send notifications through DynamicHUD.

    ```lua title="resources/[orbit]/orbit-lib/config.lua"
    Config.Notify = 'orbit-dynamichud'
    ```

    <Tabs items="['Replacing ox_lib notify', 'Replacing QB notify', 'Replacing ESX notify']">
      <Tab value="Replacing ox_lib notify">
        Replace `lib.notify` if you want every existing `lib.notify({...})` call to use DynamicHUD notifications without editing every resource.

        Open `ox_lib/resource/interface/client/notify.lua`, find the client-side `lib.notify` function, and replace the function body with the DynamicHUD event.

        ```lua title="resources/[standalone]/ox_lib/resource/interface/client/notify.lua"
        ---`client`
        ---@param data NotifyProps
        ---@diagnostic disable-next-line: duplicate-set-field
        function lib.notify(data)
            TriggerEvent('orbit-dynamichud:notify', data)
        end
        ```

        After this, calls like `lib.notify({ description = 'Saved', type = 'success' })` are displayed through Orbit DynamicHUD.
      </Tab>

      <Tab value="Replacing QB notify">
        Replace QBCore's notify helper if you want existing `QBCore.Functions.Notify(...)` calls to use DynamicHUD.

        Open `qb-core/client/functions.lua`, find `QBCore.Functions.Notify`, and replace the whole function.

        ```lua title="resources/[qb]/qb-core/client/functions.lua"
        function QBCore.Functions.Notify(text, texttype, length, icon)
            local data = {}

            if type(text) == "table" then
                local ttext = text.text or "Placeholder"
                local caption = text.caption or nil
                local ttype = texttype or "primary"
                local duration = length or 5000

                data = {
                    title = caption,
                    description = ttext,
                    duration = duration,
                    type = ttype,
                    icon = icon
                }
            else
                local ttype = texttype or "primary"
                local duration = length or 5000

                data = {
                    title = nil,
                    description = text,
                    duration = duration,
                    type = ttype,
                    icon = icon
                }
            end

            TriggerEvent('orbit-dynamichud:notify', data)
        end
        ```

        This preserves both common QBCore notify styles: string messages and table messages with `text` and `caption`.
      </Tab>

      <Tab value="Replacing ESX notify">
        Replace `ESX.ShowNotification` if you want existing ESX scripts to use DynamicHUD notifications.

        Open `es_extended/client/functions.lua`, find `ESX.ShowNotification`, and replace the whole function.

        ```lua title="resources/[esx]/es_extended/client/functions.lua"
        ---@param message string The message to show
        ---@param notifyType? string The type of notification to show
        ---@param length? number The length of the notification
        ---@param title? string The title of the notification
        ---@param position? string The position of the notification
        ---@return nil
        function ESX.ShowNotification(message, notifyType, length, title, position)
            local data = {
                title = title or nil,
                description = message,
                duration = length or 5000,
                type = notifyType or "info"
            }

            TriggerEvent('orbit-dynamichud:notify', data)
        end
        ```

        The `position` argument is kept in the function signature for compatibility, but DynamicHUD handles notification placement itself.
      </Tab>
    </Tabs>
  </Tab>

  <Tab value="TextUI" />

  <Tab value="Skill Check" />

  <Tab value="Progress Bar" />
</Tabs>