31e68b2671
* feat(gui): add IntroductionModal component * feat(gui): add interactivity to IntroductionModal * feat(gui): create SlideTemplate component for IntroductionModal Slides * feat(gui): add generic slides to IntroductionModal with images and content * feat(gui): add Slide with SwapStatusAlert to IntroductionModal * feat(gui): show the introduction only on the first app start * feat(gui): make external links functional * fix(gui): update github link to link to active repo * feat(gui): replace old images with new mockups and update Slide05 content * feat(gui): add CardSelectionGroup and CardSelectionOption components for improved card selection UI * feat(gui): add FiatPricePreference slide to IntroductionModal * feat(gui): save user preference regarding fiat prices I set the initial store configuration for fetching fiat prices to false to avoid any calls to coingecko without user consent * refactor(gui): remove old Slide05 component for improved codebase maintenance * fix(gui): add UnstoppableSwap logo to FiatPricePreference slide * refactor(gui): update image imports and improve slide content for introduction modal * fix(gui): introduce ExternalLink component and update Slide05 to use it for external navigation * fix(gui): replace webp images for introduction with svg mockups for improved quality * fix(gui): change order of introduction slides, to asking for fiat price preference at the end * refactor(gui): implement CardSelectionContext for managing card selection state * refactor: texts in intro modakl * fix(gui): update currency fetching SVG for improved design and clarity * feat(gui): added changelog entry for introduction --------- Co-authored-by: Binarybaron <binarybaron@protonmail.com> |
||
|---|---|---|
| .. | ||
| public | ||
| src | ||
| .env.development | ||
| .gitignore | ||
| eslint.config.js | ||
| index.html | ||
| package.json | ||
| README.md | ||
| tsconfig.json | ||
| tsconfig.node.json | ||
| vite.config.ts | ||
| yarn.lock | ||
Recommended IDE Setup
Requirements
- For compiling the Rust code:
cargoandcargo tauri(installation) - For running the Typescript code:
nodeandyarn - For formatting and bindings:
dprint(cargo install dprint@0.39.1) andtypeshare(cargo install typeshare-cli) - If you are on Windows and you want to use the
check-bindingscommand you'll need to manually install the GNU DiffUtils (installation) and GNU CoreUtils (installtion). Remember to add the installation path (probablyC:\Program Files (x86)\GnuWin32\bin) to thePATHin 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