swan-io / swan-partner-frontend

Swan Partner Front-end > Onboarding & Banking clients for Swan • Documentation • Specifications Clone Install • Dependencies Install pnpm (needed for the monorepo management). • Hosts Add the following to your file (so that we're able to replicate the subdomains we'll use in production): • HTTPS In order to replicate the production conditions (for session cookies mostly), the local server runs in HTTPS. By default, your system will warn against a self-signed certificate, but we can use mkcert to make the system trust it. MacOS With homebrew: Windows With chocolatey: Getting started To configure your project, simply the following command, it will prompt you with the required values: and then you start the development server! Environment variables If you want to setup your file manually: Server At the project root, you should find a file. Copy its contents to a new file. Add your values: • - in sandbox • in live • - in sandbox • in live • (generate one using ) And get the following from your dashboard: • : your Swan OAuth2 client ID • : your Swan OAuth2 client secret Don't forget to allow your callback URLs in the dashboard → Developers → API → Redirect URLs, here: • Client You can provide environment variables to the client by adding keys starting with in your file. Then you can run the following command to make the TypeScript compiler aware of these variables: They'll be accessible in the client code in the object. --- Development To start the development server, use the following command: You'll find: • 📁 clients • 📁 **onboarding**: the form for an end user to create a Swan account • 📁 **banking**: the banking interface, including transactions, cards, payments & memberships • 📁 **server**: the NodeJS server to handle OAuth2 callbacks & API proxying Editor We recommend the following setup for an optimal developer experience: • VS Code • VS Code EditorConfig • VS Code Biome • VS Code Prettier • VS Code GraphQL language support and syntax highlighting By default, the VS Code TypeScript extension only checks the types in open files. If you want your IDE to check types in the whole project, check in your VS Code preferences. Linting You can also configure as a pre-commit hook by running the following command : Ignore code If you want to ignore a lint rule for a specific line of the code, you can add a suppression comment above the line that emits the lint diagnostic: For example: For (equivalent of ), you can even specify which dependencies are ignored, on multiple lines: Testing We generally collocate test files next to their implementation, in a directory, with the tested file name suffixed with : We use Vitest and React Testing Library.