Official THORWallet
The official wallet app for the THORChain community. Built with React-Native.
▶️ Usage
Prerequisites
To work with React Native, you will need to have an understanding of JavaScript fundamentals.
- Mac OS
- Install xcode 9.4+
- Install node 8.3+
- Install JDK 8
Install
In case you don't have cocoapods installed, run:
sudo gem install cocoapods
And then run within the project root
yarn && cd ios && pod install
Open xcode and the following file:
ios/thorwallet.xcworkspace
Start the iOS app
npx react-native run-ios
or simply press the play
button on your xcode project.
? Contributing
Follow style conventions and folder structure. If you want to actively contribute get in touch with [email protected]
or [email protected]
for being updated on our roadmap and feature list. Any help is more than welcome!
Folder structure
-
assets
- Any kind of assets (such as
svgs
,fonts
,images
, etc.) - Lottie animations are supported only if exported as
.json
files
- Any kind of assets (such as
-
clients
- Entry point for
@thorwallet
. Each chain client is exposed as single file in the following format:Yourclient.ts
- A higher react
hook
exposes and clusters all clients together through the whole app. The hook is already memoized and reacts on network or seed phrase changes. See hookuseChainClient.ts
inMultiChainClient.ts
- Entry point for
-
components
- This folder contains any kind of React components in the following format:
Yourcomponent.tsx
- Managers
- Components which do not render anything (
return null
) but have some core logic withinuseEffects()
- Components which do not render anything (
- Screens
- Final screens which get rendered and passed as props to navigators.
- This folder contains any kind of React components in the following format:
-
helpers
- Utility functions or utility hooks in the following format:
your-helper-function.ts
- Utility functions or utility hooks in the following format:
-
navigation
- Navigation components which render screens and handle navigation logic. Entry point is
DrawerNavigator.tsx
- Navigation components which render screens and handle navigation logic. Entry point is
-
store
- Global states shared among the whole app. For each new state instance, create a new folder (
YourFolder
) and a file in the following format:yourfolder-state.ts
- Based on the complexity of your state instance, you can either use
redux
orreact-hooks-global-state
- Global states shared among the whole app. For each new state instance, create a new folder (
-
types
- Typescript files which declare new types. These types are then imported and used everywhere. Format:
your-new-type.ts
- Typescript files which declare new types. These types are then imported and used everywhere. Format:
-
ui
- UI components with tho main folders:
- core
- Core and fundamental UI components for THORWallet in the following format:
YourUIComponent.tsx
. This folder contains components such asButton.tsx
,Input.tsx
,Flex.tsx
,Spacer.tsx
,Checkbox.tsx
. These components are exposed with simple APIs through typed props.
- Core and fundamental UI components for THORWallet in the following format:
- theme
- Core theme for THORWallet. This folder includes files such as
colors.ts
,fonts.ts
, etc.
- Core theme for THORWallet. This folder includes files such as
- core
- UI components with tho main folders: