Nexus Wallet Module Documentation

DEPRECATED! Nexus Wallet Module documentation has been moved to https://github.com/Nexusoft/NexusInterface/tree/master/docs/Modules

---

Project maintained by Nexusoft Hosted on GitHub Pages — Theme by mattgraham

app module type

app is the only Nexus Wallet Module type that’s currently supported. When an app module is installed in your wallet, its icon will be added to the navigation bar at the bottom of the wallet, and when activated it opens up a separate page in your wallet, similarly to how the built-in modules like Transactions or Settings do.

<webview> tag

Technically, when an app module is opened, all the module code and UI will be embedded in a <webview> tag. A <webview> tag works almost similarly to an <iframe> tag, but webview runs in a separate process than the base wallet. webview ensures that the module code execution environment is isolated from the base wallet for better security.

If you concern about webview’s security, see webview security.

Note: you may have noticed, in Electron’s documentation on <webview> there is a warning about webview tag’s stability. However, the warning only addresses <webview>’s possible future changes in architecture and API, not security problems. This has already been confirmed by Electron team. Architectural and API changes are not too big concerns for us because we control when and whether to update Electron version, and can decide to hold off the update until we can adapt to the changes. So, we can say that it is safe to use <webview> tag.

Since the module code is isolated inside a webview, it needs some ways to communicate with the base wallet to do useful things, such as to receive wallet data, do RPC calls, or get the common styles and current theme from the base wallet so that the module UI blends well into the wallet UI around. NEXUS global variable exists for that reason. It is the bridge between your module and the base wallet, provides you with all the necessary libraries, utilities, common components, and methods for interacting with the base wallet. See NEXUS global variable for more details.

HTML entry file

Just like a regular web page, webview needs a HTML file as the entry to start loading all your module code. Javascript and CSS code can then be linked from the HTML entry file.

By default, Nexus Wallet will look for a file named index.html in your module’s root directory to load and use as the entry file. You can also set a custom path to your entry file by setting the entry field in your nxs_package.json file.

wrapInPanel option

By default, module’s webview will take up the whole area between the header and the navigation bar of your wallet (see image below). If you want to wrap your module UI in a Panel component, you’ll have to render the Panel component in your module code yourself. This way you’ll have a greater control on your UI, you can display a custom title on your Panel, add some buttons to right side of the Panel’s header, or don’t use Panel at all and customize it however you like.

webview’s area by default

However, in case that you don’t have those needs and just want to simplify your code, or you don’t use React on your module (Panel is a React component), yet you still want your module UI to be wrapped in a Panel, in your nxs_package.json file, you can set:

{
  // ...
  "options": {
    // Add this under `options`
    "wrapInPanel": true
  }
}

With the wrapInPanel option set as true, your module’s webview will be wrapped inside a Panel’s body (see image below). The Panel’s title will be automatically set as your module’s displayName preceeded by your module’s icon.

webview’s area with wrapInPanel option