Notifications Zome

Appearance

Setup ​

WARNING

This guide assumes that you have scaffolded a hApp with the TNESH stack template.

Run this to scaffold this zome in your hApp:

bash
nix run github:darksoil-studio/notifications-zome#scaffold

This will do the following:

  • Add the github:darksoil-studio/notifications-zome flake input to your flake.nix.
  • Add the notifications coordinator and zome packages to the dna.nix that you select.
  • Add the UI package for @darksoil-studio/notifications-zome as a dependency of your UI package.
  • Add the <notifications-context> element at the top level of your application.

That's it! You have now integrated the notifications coordinator and integrity zomes and their UI into your app!

Now, choose which elements you need and import them like this:

js
import "@darksoil-studio/notifications-zome/dist/elements/my-notifications-icon-button.js";

And then they are ready be used inside the <notifications-context> just like any other HTML tag.

NOTE

Importing the elements from the UI package will define them in the global CustomElementsRegistry, which makes them available to be used like any normal HTML tag. You can read more about custom elements here.

Example ​

You can see a full working example of the UI working in here.