QuaXar: Cross-Platform GUI for Celestia Light Nodes

Say bye to complex build steps. Just double-click and ta-da in every platform! QuaXar (/ˈkweɪzɑːr/, pronounced exactly as quaxar), all-in-one feature-packed Celestia light node GUI.

Comment

Github repositories:

  • QuaXar, the main application
  • celestia-node, a fork of celestia-node with Windows support and prebuilt binaries

Presentation file: uploaded as a project file, also available at Google Slides App binaries: released in the repository due to their sizes

Inspiration

Even for a simple DA light node, we had to download a bunch of stuffs and make builds by our own. It is a hassle for whoever wants to simply run a light node. Yes, there is quazar (https://quazarxyz.app), but it is only for macOS and its features are quite limited. This is the reason why I built QuaXar, which could be an improvement over quazar.

What it does

It performs as a GUI layer for running and communicating with a Celestia light node. We can create or run a light node by just one click, or remove it with some confirmation steps to prevent any mistakes to accidentally remove a light node. Not only it polls wallet information and some DAS statistics regularly like quazar, it also has a GUI for sending and receiving transactions with simple and clear UI elements. We don't have to stare at JSONs anymore. And, thanks to a built-in context-aware autocompltion feature, we don't have to copy and paste heights, addresses, namespaces, and commitments anymore. Currently it has a limited set of RPC schema defined in the app, but it is straightforward to extend it.

How we built it

I used Electron.js to make the desktop app cross-platform and keep track of spawned Celestia processes using node.js. For the frontend, I used good ol' React to design a good-looking pages. Tailwind CSS has chosen as it is the CSS framework allowing me to style blazingly fast, and @tanstack/react-query to keeping track of asynchronous responses from the main process of the Electron.js. For making the app super simple to run, I made the app download pre-built Celestia binary at the very first startup of it. Although there was a small issue regarding the build step for Windows, I managed to handle that. For communications with Celestia CLI from the React web app, I used Electron.js' IPC handler to do those jobs. Using it, one can invoke some predefined functions with (serializable) parameters and subscribe to signals from the main process.

Challenges we ran into

Note that Windows is not mentioned in the official documentation of Celestia Node (https://docs.celestia.org/nodes/environment), and actually there was a build error while compiling the binary for Windows. But those errors were just related to libs/fslock in the repo, which can be replaced with other filesystem lock libraries supporting Windows as well. After a bit of modification of the source code, I managed to compile the binary successfully on Windows as well. Another one is something I have not figured out yet: Celestia binary sometimes doesn't give response to queries like celestia rpc state Balance. Possibly it is because the fetching step is not done completely. Anyway, it results into a hanging process that indefinitely waits for the response. For a workaround, I added a timeout mechanism to each query so that there are less hanging processes in those cases.

Accomplishments that we're proud of

It is always intriguing to implement an easy-to-use API especially for people not used to deal with CLI. Instead of just running and stopping the node, QuaXar makes people to look around the APIs and send transactions without reading through the RPC API documentation. It is a truly amazing accomplishment for both newcomers and anyone having an intersection with the Celestia network!

What we learned

Among many things I learned, I need to get used to Celestia itself, such as concepts like blocks, heights, addresses, namespaces, or transactions. As myself being a newcomer to this blockchain world, I have to learn many new things during the hackathon week. Thanks to workshops and participants of the interchain hacker house event, my knowledge pool has been expanded and now I'm pretty obsessed with interchain ecosystem!

What's next for QuaXar: Cross-Platform GUI for Celestia Light Nodes

There are some ideas for future works which were not implemented due to the time limit and low priority.

  • A tab for viewing actual log from Celestia processes. Some users might want to figure out some issues using the direct outputs from the CLI.
  • Enrich the list of defined RPC schema.
  • Provide some descriptions and examples for each field of parameters/responses.
  • Let users customize options such as rpc.port
  • Implement user-friendly error messages in toasts

Built With

Share this project:

Updates