xmr-btc-swap/src-gui/README.md
b-enedict 430a22fbf6
refactor(gui): Update MUI to v7 (#383)
* task(gui): update to mui v5

* task(gui): use sx prop instead of system props

* task(gui): update to mui v6 and replace makeStyles with sx prop

* task(gui): update to mui v7

* task(gui): update react

* fix(gui): fix import

* task(gui): adjust theme and few components to fix migration introduced styling errors

* fix(gui): animation issues with text field animations

* fix(gui): remove 'darker' theme and make 'dark' theme the default

- with the new update 'dark' theme is already quite dark and therefore a 'darker' theme not necessary
- the default theme is set to 'dark' now in settings initialization

* feat(tooling): Upgrade dprint to 0.50.0, eslint config, prettier, justfile commands

- Upgrade dprint to 0.50.0
- Use sane default eslint config (fairly permissive)
- `dprint fmt` now runs prettier for the `src-gui` folder
- Added `check_gui_eslint`, `check_gui_tsc` and `check_gui` commands

* refactor: fix a few eslint errors

* dprint fmt

* fix tsc complains

* nitpick: small spacing issue

---------

Co-authored-by: Binarybaron <binarybaron@protonmail.com>
Co-authored-by: Mohan <86064887+binarybaron@users.noreply.github.com>
2025-06-06 22:31:33 +02:00

2.3 KiB

Requirements

  • For compiling the Rust code: cargo and cargo tauri (installation)
  • For running the Typescript code: node and yarn
  • For formatting and bindings: dprint (cargo install dprint@0.50.0) and typeshare (cargo install typeshare-cli)
  • If you are on Windows and you want to use the check-bindings command you'll need to manually install the GNU DiffUtils (installation) and GNU CoreUtils (installtion). Remember to add the installation path (probably C:\Program Files (x86)\GnuWin32\bin) to the PATH in your enviroment variables.

Start development servers

For development, we need to run both vite and tauri servers:

cd src-gui
yarn install && yarn run dev
# let this run
cd src-tauri
cargo tauri dev --no-watch -- -- --testnet
# let this run as well

Generate bindings for Tauri API

Running yarn run dev or yarn build should automatically re-build the Typescript bindings whenever something changes. You can also manually trigger this using the gen-bindings command:

yarn run gen-bindings

You can also check whether the current bindings are up to date:

yarn run check-bindings

Debugging

Because the GUI is running in an embedded browser, we can't use the usual Browser extensions to debug the GUI. Instead we use standalone React DevTools / Redux DevTools.

React DevTools

Run this command to start the React DevTools server. The frontend will connect to this server automatically:

npx react-devtools

Redux DevTools

Run this command to start the Redux DevTools server. The frontend will connect to this server automatically. You can then debug the global Redux state. Observe how it changes over time, go back in time, see dispatch history, etc.

You may have to go to Settings -> 'use local custom server' -> connect inside the devtools window for the state to be reflected correctly.

npx redux-devtools --hostname=localhost --port=8098 --open