FuelLabs/fuels-ts

Example application for React Native

Open

#2,570 opened on Jun 20, 2024

View on GitHub
 (13 comments) (0 reactions) (0 assignees)TypeScript (43,186 stars) (1,370 forks)batch import
featgood first issue

Description

Summary

Currently, we have no example applications that use React Native. The documentation, suggests to use Expo so we should follow their advice:

  • Create a React Native application in our apps/* directory:

    npx create-expo-app@latest
    
  • Add some simple functionality for testing purposes:

    • Create provider
    • Generate wallet
    • Check balance
  • The following Signer logic has been reported to fail during build, it would be good to confirm it is confirmed:

import { Signer } from "@fuel-ts/account";
const extendedPublicKey = Signer.extendPublicKey(new Uint8Array(publicKey));

Scope of work for React Native support

1. Platform-specific Entry Points

  • We’ll need React Native specific implementations alongside our current Node/browser paths
  • Particularly for crypto operations (we’re heavily using Node’s crypto and browser’s Web Crypto API)
  • Need to configure package.json with proper “react-native” entry points

2. Crypto Implementation

  • Add React Native specific crypto implementations
  • Will need to use RN-compatible alternatives like react-native-get-random-values
  • May need polyfills for Buffer and other Node.js built-ins
  • Test crypto operations thoroughly on mobile environment

3. Module Resolution

  • Need to handle subpath exports properly for Metro bundler
  • Currently seeing issues with imports like @fuel-ts/address/configs
  • May need to restructure how we export our submodules

4. Documentation & Testing

  • Add React Native setup instructions
  • Document required polyfills and Metro config
  • Set up CI with React Native test app
  • Add React Native specific examples

Questions to discuss:

  • Do we want to maintain three separate implementations (Node/Browser/RN)?

Contributor guide