API - FRONTEND

Signatures and Usage Details

Overview

Signatures are not included for these utilities as the type definitions are sufficient enough.

fromMessageAction

This function returns a subject that can be subscribed to receive updates for a specific action, facilitating the creation of passive listeners.

Note: Multiple observers can be registered for the same action.

Usage:

export class MyComponent implements OnInit {
  count: number = 0;

  constructor(private nui: NuiService) {}

  ngOnInit(): void {
    // This listens for the "setCount" message
    this.nui.fromMessageAction<number>("setCount").subscribe({
      next: (value) => {
        // Implement your logic here
        this.count = value;
      }
    });
  }
}

getLastMessageData

Retrieves the last data received for a specific action. This is useful when a component is initialized after an event has been dispatched but still requires the event's data.

Usage:

export class MyComponent {
  constructor(private data: DataService) {
    let lastData = this.data.getLastMessageData<Player>("updatePlayer");
    if (lastData) {
      this.player = lastData;
    }
  }
}

fetchNui

A simple NUI-focused wrapper around the standard fetch API, designed for active NUI data fetching or triggering NUI callbacks in the game scripts.

Usage:

this.nui.fetchNui<ReturnData>("getClientData")
  .then((retData) => {
    console.log("Got return data from client scripts:");
    console.dir(retData);
    setClientData(retData);
  })
  .catch((e) => {
    console.error("Setting mock data due to error", e);
    setClientData({ x: 500, y: 300, z: 200 });
  });

dispatchBackEvents

Allows for mocking dispatched game script actions in a browser environment, targeting fromMessageAction observers.

Usage:

this.nui.dispatchBackEvents([
  {
    action: "setVisible",
    data: true
  }
]);

Misc Utils

• this.nui.isEnvBrowser(): Returns a boolean indicating if the current environment is a regular browser, useful for development logic.