├── .all-contributorsrc ├── .buckconfig ├── .bundle └── config ├── .eslintrc.js ├── .flowconfig ├── .github ├── FUNDING.yml └── dependabot.yml ├── .gitignore ├── .husky ├── .gitignore └── pre-commit ├── .nvmrc ├── .prettierignore ├── .prettierrc.js ├── .ruby-version ├── .travis.yml ├── .watchmanconfig ├── Gemfile ├── Gemfile.lock ├── LICENSE ├── README.md ├── __tests__ └── App-test.js ├── android ├── app │ ├── BUCK │ ├── build.gradle │ ├── build_defs.bzl │ ├── debug.keystore │ ├── proguard-rules.pro │ └── src │ │ ├── debug │ │ ├── AndroidManifest.xml │ │ └── java │ │ │ └── com │ │ │ └── reactnativestarterapp │ │ │ └── ReactNativeFlipper.java │ │ └── main │ │ ├── AndroidManifest.xml │ │ ├── assets │ │ └── fonts │ │ │ ├── Lato-Black.ttf │ │ │ ├── Lato-BlackItalic.ttf │ │ │ ├── Lato-Bold.ttf │ │ │ ├── Lato-BoldItalic.ttf │ │ │ ├── Lato-Italic.ttf │ │ │ ├── Lato-Light.ttf │ │ │ ├── Lato-LightItalic.ttf │ │ │ ├── Lato-Regular.ttf │ │ │ ├── Lato-Thin.ttf │ │ │ └── Lato-ThinItalic.ttf │ │ ├── java │ │ └── com │ │ │ └── reactnativestarterapp │ │ │ ├── MainActivity.java │ │ │ ├── MainApplication.java │ │ │ ├── SplashActivity.java │ │ │ └── newarchitecture │ │ │ ├── MainApplicationReactNativeHost.java │ │ │ ├── components │ │ │ └── MainComponentsRegistry.java │ │ │ └── modules │ │ │ └── MainApplicationTurboModuleManagerDelegate.java │ │ ├── jni │ │ ├── Android.mk │ │ ├── MainApplicationModuleProvider.cpp │ │ ├── MainApplicationModuleProvider.h │ │ ├── MainApplicationTurboModuleManagerDelegate.cpp │ │ ├── MainApplicationTurboModuleManagerDelegate.h │ │ ├── MainComponentsRegistry.cpp │ │ ├── MainComponentsRegistry.h │ │ └── OnLoad.cpp │ │ └── res │ │ ├── drawable │ │ └── rn_edit_text_material.xml │ │ ├── layout │ │ └── launch_screen.xml │ │ └── values │ │ ├── colors.xml │ │ ├── strings.xml │ │ └── styles.xml ├── build.gradle ├── gradle.properties ├── gradle │ └── wrapper │ │ ├── gradle-wrapper.jar │ │ └── gradle-wrapper.properties ├── gradlew ├── gradlew.bat └── settings.gradle ├── app.json ├── assets ├── icon.png └── splashscreen.png ├── babel.config.js ├── index.js ├── ios ├── .xcode.env ├── LaunchScreen.storyboard ├── Podfile ├── Podfile.lock ├── ReactNativeStarterApp.xcodeproj │ ├── project.pbxproj │ └── xcshareddata │ │ └── xcschemes │ │ └── ReactNativeStarterApp.xcscheme ├── ReactNativeStarterApp.xcworkspace │ ├── contents.xcworkspacedata │ └── xcshareddata │ │ └── IDEWorkspaceChecks.plist ├── ReactNativeStarterApp │ ├── AppDelegate.h │ ├── AppDelegate.mm │ ├── Base.lproj │ │ └── LaunchScreen.xib │ ├── Images.xcassets │ │ └── Contents.json │ ├── Info.plist │ ├── LaunchScreen.storyboard │ └── main.m └── ReactNativeStarterAppTests │ ├── Info.plist │ └── ReactNativeStarterAppTests.m ├── jest.config.js ├── metro.config.js ├── package.json ├── react-native-starter-kit.png ├── react-native.config.js ├── screenshots ├── screenshot1.png ├── screenshot2.png └── screenshot3.png ├── scripts └── set-environment.js ├── src ├── App.tsx ├── api │ ├── hooks │ │ ├── useUser.ts │ │ └── useUsers.ts │ ├── index.ts │ └── users │ │ ├── types.ts │ │ └── users.ts ├── assets │ ├── fonts │ │ ├── Lato-Black.ttf │ │ ├── Lato-BlackItalic.ttf │ │ ├── Lato-Bold.ttf │ │ ├── Lato-BoldItalic.ttf │ │ ├── Lato-Italic.ttf │ │ ├── Lato-Light.ttf │ │ ├── Lato-LightItalic.ttf │ │ ├── Lato-Regular.ttf │ │ ├── Lato-Thin.ttf │ │ └── Lato-ThinItalic.ttf │ └── images │ │ └── reactnative.png ├── components │ ├── AppVersion │ │ └── index.tsx │ ├── CLoader │ │ ├── index.tsx │ │ └── styles.ts │ ├── CSafeAreaView │ │ └── index.tsx │ ├── CToaster │ │ └── index.tsx │ ├── GenericHeader │ │ ├── index.tsx │ │ └── styles.ts │ ├── GenericModal │ │ └── index.tsx │ └── Splashscreen │ │ └── index.tsx ├── hooks │ └── useNavigationBack.ts ├── i18n │ ├── index.ts │ ├── languageConfig.ts │ ├── languageDetector.ts │ └── locales │ │ ├── en.json │ │ └── it.json ├── routes │ ├── index.tsx │ ├── navigationUtils.ts │ ├── routeOptions.ts │ ├── stacks │ │ └── MainStack.tsx │ └── types.ts ├── scenes │ ├── Homepage │ │ └── index.tsx │ ├── ModalPage │ │ └── index.tsx │ ├── UserDetails │ │ └── index.tsx │ └── UsersList │ │ └── index.tsx ├── theme │ ├── colors.ts │ ├── fonts.ts │ ├── index.ts │ ├── margin.ts │ └── padding.ts └── utils │ └── toast.tsx ├── tsconfig.jest.json ├── tsconfig.json └── yarn.lock /.all-contributorsrc: -------------------------------------------------------------------------------- 1 | { 2 | "projectName": "react-native-starter-app", 3 | "projectOwner": "IronTony", 4 | "repoType": "github", 5 | "repoHost": "https://github.com", 6 | "files": [ 7 | "README.md" 8 | ], 9 | "imageSize": 100, 10 | "commit": true, 11 | "commitConvention": "none", 12 | "badgeTemplate": "[![All Contributors](https://img.shields.io/badge/all_contributors-<%= contributors.length %>-screen.svg?style=flat)](#contributors-:sparkles:)", 13 | "contributors": [ 14 | { 15 | "login": "IronTony", 16 | "name": "IronTony", 17 | "avatar_url": "https://avatars3.githubusercontent.com/u/3645225?v=4", 18 | "profile": "https://github.com/IronTony", 19 | "contributions": [ 20 | "ideas", 21 | "code", 22 | "doc", 23 | "bug", 24 | "maintenance", 25 | "platform", 26 | "question", 27 | "review", 28 | "test", 29 | "example" 30 | ] 31 | }, 32 | { 33 | "login": "panz3r", 34 | "name": "Mattia Panzeri", 35 | "avatar_url": "https://avatars3.githubusercontent.com/u/1754457?v=4", 36 | "profile": "http://panz3r.dev", 37 | "contributions": [ 38 | "tool" 39 | ] 40 | } 41 | ], 42 | "contributorsPerLine": 7 43 | } 44 | -------------------------------------------------------------------------------- /.buckconfig: -------------------------------------------------------------------------------- 1 | 2 | [android] 3 | target = Google Inc.:Google APIs:23 4 | 5 | [maven_repositories] 6 | central = https://repo1.maven.org/maven2 7 | -------------------------------------------------------------------------------- /.bundle/config: -------------------------------------------------------------------------------- 1 | BUNDLE_PATH: "vendor/bundle" 2 | BUNDLE_FORCE_RUBY_PLATFORM: 1 -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | parser: '@typescript-eslint/parser', 4 | plugins: ['@typescript-eslint', 'react-hooks'], 5 | extends: [ 6 | '@react-native-community', 7 | 'plugin:prettier/recommended', 8 | 'eslint:recommended', 9 | 'plugin:@typescript-eslint/eslint-recommended', 10 | 'plugin:@typescript-eslint/recommended', 11 | ], 12 | rules: { 13 | 'ordered-imports': 0, 14 | }, 15 | overrides: [ 16 | { 17 | files: ['src/**/*.{ts,tsx}'], 18 | extends: [ 19 | 'plugin:@typescript-eslint/recommended', 20 | // 'plugin:@typescript-eslint/recommended-requiring-type-checking', // @TODO: Commented due the chaining-optional-operator bug: https://github.com/typescript-eslint/typescript-eslint/issues/2728 21 | ], 22 | rules: { 23 | '@typescript-eslint/ban-ts-comment': 'off', 24 | '@typescript-eslint/explicit-function-return-type': 'off', 25 | '@typescript-eslint/no-unused-vars': 'off', 26 | // All the @typescript-eslint/* rules here... 27 | '@typescript-eslint/no-unnecessary-type-arguments': 'error', 28 | '@typescript-eslint/prefer-nullish-coalescing': 'error', 29 | '@typescript-eslint/prefer-optional-chain': 'error', 30 | '@typescript-eslint/explicit-module-boundary-types': 'off', 31 | 'react-native/no-inline-styles': 'off', 32 | 'react-hooks/rules-of-hooks': 'error', 33 | 'react-hooks/exhaustive-deps': 'warn', 34 | }, 35 | parser: '@typescript-eslint/parser', 36 | parserOptions: { 37 | tsconfigRootDir: './', 38 | project: './tsconfig.json', 39 | }, 40 | }, 41 | ], 42 | }; 43 | -------------------------------------------------------------------------------- /.flowconfig: -------------------------------------------------------------------------------- 1 | [ignore] 2 | ; We fork some components by platform 3 | .*/*[.]android.js 4 | 5 | ; Ignore "BUCK" generated dirs 6 | /\.buckd/ 7 | 8 | ; Ignore polyfills 9 | node_modules/react-native/Libraries/polyfills/.* 10 | 11 | ; Flow doesn't support platforms 12 | .*/Libraries/Utilities/LoadingView.js 13 | 14 | .*/node_modules/resolve/test/resolver/malformed_package_json/package\.json$ 15 | 16 | [untyped] 17 | .*/node_modules/@react-native-community/cli/.*/.* 18 | 19 | [include] 20 | 21 | [libs] 22 | node_modules/react-native/interface.js 23 | node_modules/react-native/flow/ 24 | 25 | [options] 26 | emoji=true 27 | 28 | exact_by_default=true 29 | 30 | format.bracket_spacing=false 31 | 32 | module.file_ext=.js 33 | module.file_ext=.json 34 | module.file_ext=.ios.js 35 | 36 | munge_underscores=true 37 | 38 | module.name_mapper='^react-native/\(.*\)$' -> '/node_modules/react-native/\1' 39 | module.name_mapper='^@?[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> '/node_modules/react-native/Libraries/Image/RelativeImageStub' 40 | 41 | suppress_type=$FlowIssue 42 | suppress_type=$FlowFixMe 43 | suppress_type=$FlowFixMeProps 44 | suppress_type=$FlowFixMeState 45 | 46 | [lints] 47 | sketchy-null-number=warn 48 | sketchy-null-mixed=warn 49 | sketchy-number=warn 50 | untyped-type-import=warn 51 | nonstrict-import=warn 52 | deprecated-type=warn 53 | unsafe-getters-setters=warn 54 | unnecessary-invariant=warn 55 | signature-verification-failure=warn 56 | 57 | [strict] 58 | deprecated-type 59 | nonstrict-import 60 | sketchy-null 61 | unclear-type 62 | unsafe-getters-setters 63 | untyped-import 64 | untyped-type-import 65 | 66 | [version] 67 | ^0.176.3 68 | -------------------------------------------------------------------------------- /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | # These are supported funding model platforms 2 | 3 | custom: ['https://www.buymeacoffee.com/IronTony'] 4 | -------------------------------------------------------------------------------- /.github/dependabot.yml: -------------------------------------------------------------------------------- 1 | version: 2 2 | updates: 3 | - package-ecosystem: npm 4 | directory: "/" 5 | schedule: 6 | interval: weekly 7 | timezone: Europe/Rome 8 | open-pull-requests-limit: 10 9 | reviewers: 10 | - IronTony 11 | labels: 12 | - dependencies 13 | ignore: 14 | - dependency-name: typescript 15 | versions: 16 | - 4.2.4 17 | - dependency-name: "@typescript-eslint/eslint-plugin" 18 | versions: 19 | - 4.14.0 20 | - 4.15.2 21 | - 4.19.0 22 | - dependency-name: "@types/react-native" 23 | versions: 24 | - 0.63.50 25 | - 0.64.2 26 | - dependency-name: "@typescript-eslint/parser" 27 | versions: 28 | - 4.14.0 29 | - 4.17.0 30 | - dependency-name: "@react-navigation/stack" 31 | versions: 32 | - 5.14.1 33 | - dependency-name: eslint 34 | versions: 35 | - 7.18.0 36 | - dependency-name: "@babel/runtime" 37 | versions: 38 | - 7.13.8 39 | - dependency-name: react-native-screens 40 | versions: 41 | - 2.18.0 42 | - dependency-name: "@types/node" 43 | versions: 44 | - 14.14.28 45 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # OSX 2 | # 3 | .DS_Store 4 | 5 | # expo 6 | .expo/ 7 | 8 | # Xcode 9 | # 10 | build/ 11 | *.pbxuser 12 | !default.pbxuser 13 | *.mode1v3 14 | !default.mode1v3 15 | *.mode2v3 16 | !default.mode2v3 17 | *.perspectivev3 18 | !default.perspectivev3 19 | xcuserdata 20 | *.xccheckout 21 | *.moved-aside 22 | DerivedData 23 | *.hmap 24 | *.ipa 25 | *.xcuserstate 26 | ios/.xcode.env.local 27 | 28 | # Android/IntelliJ 29 | # 30 | build/ 31 | .idea 32 | .gradle 33 | local.properties 34 | *.iml 35 | android/app/release 36 | 37 | # Android 38 | *.hprof 39 | *.old 40 | 41 | # node.js 42 | # 43 | node_modules/ 44 | npm-debug.log 45 | yarn-error.log 46 | 47 | # BUCK 48 | buck-out/ 49 | \.buckd/ 50 | *.keystore 51 | !debug.keystore 52 | 53 | # fastlane 54 | # 55 | # It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the 56 | # screenshots whenever they are needed. 57 | # For more information about the recommended setup visit: 58 | # https://docs.fastlane.tools/best-practices/source-control/ 59 | 60 | **/fastlane/report.xml 61 | **/fastlane/Preview.html 62 | **/fastlane/screenshots 63 | **/fastlane/test_output 64 | 65 | # Bundle artifact 66 | *.jsbundle 67 | android/app/src/main/assets/index.android.bundle 68 | ios/assets/src 69 | ios/assets/app.json 70 | 71 | # Ruby / CocoaPods 72 | /ios/Pods/ 73 | /vendor/bundle/ 74 | 75 | # project 76 | .vscode/ 77 | android/.settings 78 | android/.project 79 | 80 | # Icons 81 | # These files are excluded since are generated by 'assets:icons' script 82 | #android/app/src/*/web_hi_res_512.png 83 | #android/app/src/*/res/mipmap-*/ic_launcher*.png 84 | ios/*/Images.xcassets/AppIcon.appiconset/* 85 | 86 | # Splashscreen 87 | # These files are excluded since are generated by 'assets:splashscreen' script 88 | android/app/src/*/res/drawable-*/splashscreen.png 89 | android/app/src/*/res/mipmap-*/ic_launcher_round.png 90 | android/app/src/*/res/mipmap-*/ic_launcher.png 91 | android/app/src/*/web_hi_res_512.png 92 | android/app/src/*/res/raw/ 93 | ios/*/Images.xcassets/Splashscreen.imageset/* 94 | 95 | # Environments 96 | # These files are excluded since are generated by 'set-*' scripts 97 | src/env.js 98 | 99 | deps-graph.svg 100 | .eslintcache 101 | -------------------------------------------------------------------------------- /.husky/.gitignore: -------------------------------------------------------------------------------- 1 | _ 2 | -------------------------------------------------------------------------------- /.husky/pre-commit: -------------------------------------------------------------------------------- 1 | #!/bin/sh 2 | . "$(dirname "$0")/_/husky.sh" 3 | 4 | yarn run pre-commit -------------------------------------------------------------------------------- /.nvmrc: -------------------------------------------------------------------------------- 1 | 16.13.0 -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | tsconfig.json -------------------------------------------------------------------------------- /.prettierrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | arrowParens: 'avoid', 3 | bracketSameLine: true, 4 | semi: true, 5 | trailingComma: 'all', 6 | singleQuote: true, 7 | printWidth: 120, 8 | bracketSpacing: true, 9 | importOrder: ['', '^[./]'], 10 | importOrderSeparation: false, 11 | }; 12 | -------------------------------------------------------------------------------- /.ruby-version: -------------------------------------------------------------------------------- 1 | 2.7.5 -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | branches: 2 | only: 3 | - master 4 | cache: false 5 | 6 | jobs: 7 | include: 8 | - stage: Dev Build Android 🤖 9 | env: 10 | global: 11 | - ANDROID_API_LEVEL=28 12 | - ANDROID_BUILD_TOOLS_VERSION=28.0.3 13 | - ADB_INSTALL_TIMEOUT=20 # minutes (2 minutes by default) 14 | language: android 15 | jdk: oraclejdk8 16 | android: 17 | components: 18 | - tools 19 | - platform-tools 20 | - build-tools-$ANDROID_BUILD_TOOLS_VERSION 21 | - android-$ANDROID_API_LEVEL 22 | - extra 23 | - add-on 24 | - extra-google-m2repository 25 | - extra-android-m2repository 26 | before_install: 27 | - yes | sdkmanager "platforms;android-28" 28 | - nvm install 13.7.0 29 | - nvm alias default v13.7.0 30 | - gem install bundler 31 | - bundle install 32 | install: yarn 33 | script: yarn build:dev:android 34 | -------------------------------------------------------------------------------- /.watchmanconfig: -------------------------------------------------------------------------------- 1 | {} -------------------------------------------------------------------------------- /Gemfile: -------------------------------------------------------------------------------- 1 | source 'https://rubygems.org' 2 | 3 | # You may use http://rbenv.org/ or https://rvm.io/ to install and use this version 4 | ruby '2.7.5' 5 | 6 | gem 'cocoapods', '~> 1.11', '>= 1.11.2' 7 | -------------------------------------------------------------------------------- /Gemfile.lock: -------------------------------------------------------------------------------- 1 | GEM 2 | remote: https://rubygems.org/ 3 | specs: 4 | CFPropertyList (3.0.5) 5 | rexml 6 | activesupport (6.1.5) 7 | concurrent-ruby (~> 1.0, >= 1.0.2) 8 | i18n (>= 1.6, < 2) 9 | minitest (>= 5.1) 10 | tzinfo (~> 2.0) 11 | zeitwerk (~> 2.3) 12 | addressable (2.8.0) 13 | public_suffix (>= 2.0.2, < 5.0) 14 | algoliasearch (1.27.5) 15 | httpclient (~> 2.8, >= 2.8.3) 16 | json (>= 1.5.1) 17 | atomos (0.1.3) 18 | claide (1.1.0) 19 | cocoapods (1.11.3) 20 | addressable (~> 2.8) 21 | claide (>= 1.0.2, < 2.0) 22 | cocoapods-core (= 1.11.3) 23 | cocoapods-deintegrate (>= 1.0.3, < 2.0) 24 | cocoapods-downloader (>= 1.4.0, < 2.0) 25 | cocoapods-plugins (>= 1.0.0, < 2.0) 26 | cocoapods-search (>= 1.0.0, < 2.0) 27 | cocoapods-trunk (>= 1.4.0, < 2.0) 28 | cocoapods-try (>= 1.1.0, < 2.0) 29 | colored2 (~> 3.1) 30 | escape (~> 0.0.4) 31 | fourflusher (>= 2.3.0, < 3.0) 32 | gh_inspector (~> 1.0) 33 | molinillo (~> 0.8.0) 34 | nap (~> 1.0) 35 | ruby-macho (>= 1.0, < 3.0) 36 | xcodeproj (>= 1.21.0, < 2.0) 37 | cocoapods-core (1.11.3) 38 | activesupport (>= 5.0, < 7) 39 | addressable (~> 2.8) 40 | algoliasearch (~> 1.0) 41 | concurrent-ruby (~> 1.1) 42 | fuzzy_match (~> 2.0.4) 43 | nap (~> 1.0) 44 | netrc (~> 0.11) 45 | public_suffix (~> 4.0) 46 | typhoeus (~> 1.0) 47 | cocoapods-deintegrate (1.0.5) 48 | cocoapods-downloader (1.6.3) 49 | cocoapods-plugins (1.0.0) 50 | nap 51 | cocoapods-search (1.0.1) 52 | cocoapods-trunk (1.6.0) 53 | nap (>= 0.8, < 2.0) 54 | netrc (~> 0.11) 55 | cocoapods-try (1.2.0) 56 | colored2 (3.1.2) 57 | concurrent-ruby (1.1.10) 58 | escape (0.0.4) 59 | ethon (0.15.0) 60 | ffi (>= 1.15.0) 61 | ffi (1.15.5) 62 | fourflusher (2.3.1) 63 | fuzzy_match (2.0.4) 64 | gh_inspector (1.1.3) 65 | httpclient (2.8.3) 66 | i18n (1.10.0) 67 | concurrent-ruby (~> 1.0) 68 | json (2.6.1) 69 | minitest (5.15.0) 70 | molinillo (0.8.0) 71 | nanaimo (0.3.0) 72 | nap (1.1.0) 73 | netrc (0.11.0) 74 | public_suffix (4.0.7) 75 | rexml (3.2.5) 76 | ruby-macho (2.5.1) 77 | typhoeus (1.4.0) 78 | ethon (>= 0.9.0) 79 | tzinfo (2.0.4) 80 | concurrent-ruby (~> 1.0) 81 | xcodeproj (1.21.0) 82 | CFPropertyList (>= 2.3.3, < 4.0) 83 | atomos (~> 0.1.3) 84 | claide (>= 1.0.2, < 2.0) 85 | colored2 (~> 3.1) 86 | nanaimo (~> 0.3.0) 87 | rexml (~> 3.2.4) 88 | zeitwerk (2.5.4) 89 | 90 | PLATFORMS 91 | ruby 92 | 93 | DEPENDENCIES 94 | cocoapods (~> 1.11, >= 1.11.2) 95 | 96 | RUBY VERSION 97 | ruby 2.7.4p191 98 | 99 | BUNDLED WITH 100 | 2.2.27 -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | Mozilla Public License Version 2.0 2 | ================================== 3 | 4 | 1. Definitions 5 | -------------- 6 | 7 | 1.1. "Contributor" 8 | means each individual or legal entity that creates, contributes to 9 | the creation of, or owns Covered Software. 10 | 11 | 1.2. "Contributor Version" 12 | means the combination of the Contributions of others (if any) used 13 | by a Contributor and that particular Contributor's Contribution. 14 | 15 | 1.3. "Contribution" 16 | means Covered Software of a particular Contributor. 17 | 18 | 1.4. "Covered Software" 19 | means Source Code Form to which the initial Contributor has attached 20 | the notice in Exhibit A, the Executable Form of such Source Code 21 | Form, and Modifications of such Source Code Form, in each case 22 | including portions thereof. 23 | 24 | 1.5. "Incompatible With Secondary Licenses" 25 | means 26 | 27 | (a) that the initial Contributor has attached the notice described 28 | in Exhibit B to the Covered Software; or 29 | 30 | (b) that the Covered Software was made available under the terms of 31 | version 1.1 or earlier of the License, but not also under the 32 | terms of a Secondary License. 33 | 34 | 1.6. "Executable Form" 35 | means any form of the work other than Source Code Form. 36 | 37 | 1.7. "Larger Work" 38 | means a work that combines Covered Software with other material, in 39 | a separate file or files, that is not Covered Software. 40 | 41 | 1.8. "License" 42 | means this document. 43 | 44 | 1.9. "Licensable" 45 | means having the right to grant, to the maximum extent possible, 46 | whether at the time of the initial grant or subsequently, any and 47 | all of the rights conveyed by this License. 48 | 49 | 1.10. "Modifications" 50 | means any of the following: 51 | 52 | (a) any file in Source Code Form that results from an addition to, 53 | deletion from, or modification of the contents of Covered 54 | Software; or 55 | 56 | (b) any new file in Source Code Form that contains any Covered 57 | Software. 58 | 59 | 1.11. "Patent Claims" of a Contributor 60 | means any patent claim(s), including without limitation, method, 61 | process, and apparatus claims, in any patent Licensable by such 62 | Contributor that would be infringed, but for the grant of the 63 | License, by the making, using, selling, offering for sale, having 64 | made, import, or transfer of either its Contributions or its 65 | Contributor Version. 66 | 67 | 1.12. "Secondary License" 68 | means either the GNU General Public License, Version 2.0, the GNU 69 | Lesser General Public License, Version 2.1, the GNU Affero General 70 | Public License, Version 3.0, or any later versions of those 71 | licenses. 72 | 73 | 1.13. "Source Code Form" 74 | means the form of the work preferred for making modifications. 75 | 76 | 1.14. "You" (or "Your") 77 | means an individual or a legal entity exercising rights under this 78 | License. For legal entities, "You" includes any entity that 79 | controls, is controlled by, or is under common control with You. For 80 | purposes of this definition, "control" means (a) the power, direct 81 | or indirect, to cause the direction or management of such entity, 82 | whether by contract or otherwise, or (b) ownership of more than 83 | fifty percent (50%) of the outstanding shares or beneficial 84 | ownership of such entity. 85 | 86 | 2. License Grants and Conditions 87 | -------------------------------- 88 | 89 | 2.1. Grants 90 | 91 | Each Contributor hereby grants You a world-wide, royalty-free, 92 | non-exclusive license: 93 | 94 | (a) under intellectual property rights (other than patent or trademark) 95 | Licensable by such Contributor to use, reproduce, make available, 96 | modify, display, perform, distribute, and otherwise exploit its 97 | Contributions, either on an unmodified basis, with Modifications, or 98 | as part of a Larger Work; and 99 | 100 | (b) under Patent Claims of such Contributor to make, use, sell, offer 101 | for sale, have made, import, and otherwise transfer either its 102 | Contributions or its Contributor Version. 103 | 104 | 2.2. Effective Date 105 | 106 | The licenses granted in Section 2.1 with respect to any Contribution 107 | become effective for each Contribution on the date the Contributor first 108 | distributes such Contribution. 109 | 110 | 2.3. Limitations on Grant Scope 111 | 112 | The licenses granted in this Section 2 are the only rights granted under 113 | this License. No additional rights or licenses will be implied from the 114 | distribution or licensing of Covered Software under this License. 115 | Notwithstanding Section 2.1(b) above, no patent license is granted by a 116 | Contributor: 117 | 118 | (a) for any code that a Contributor has removed from Covered Software; 119 | or 120 | 121 | (b) for infringements caused by: (i) Your and any other third party's 122 | modifications of Covered Software, or (ii) the combination of its 123 | Contributions with other software (except as part of its Contributor 124 | Version); or 125 | 126 | (c) under Patent Claims infringed by Covered Software in the absence of 127 | its Contributions. 128 | 129 | This License does not grant any rights in the trademarks, service marks, 130 | or logos of any Contributor (except as may be necessary to comply with 131 | the notice requirements in Section 3.4). 132 | 133 | 2.4. Subsequent Licenses 134 | 135 | No Contributor makes additional grants as a result of Your choice to 136 | distribute the Covered Software under a subsequent version of this 137 | License (see Section 10.2) or under the terms of a Secondary License (if 138 | permitted under the terms of Section 3.3). 139 | 140 | 2.5. Representation 141 | 142 | Each Contributor represents that the Contributor believes its 143 | Contributions are its original creation(s) or it has sufficient rights 144 | to grant the rights to its Contributions conveyed by this License. 145 | 146 | 2.6. Fair Use 147 | 148 | This License is not intended to limit any rights You have under 149 | applicable copyright doctrines of fair use, fair dealing, or other 150 | equivalents. 151 | 152 | 2.7. Conditions 153 | 154 | Sections 3.1, 3.2, 3.3, and 3.4 are conditions of the licenses granted 155 | in Section 2.1. 156 | 157 | 3. Responsibilities 158 | ------------------- 159 | 160 | 3.1. Distribution of Source Form 161 | 162 | All distribution of Covered Software in Source Code Form, including any 163 | Modifications that You create or to which You contribute, must be under 164 | the terms of this License. You must inform recipients that the Source 165 | Code Form of the Covered Software is governed by the terms of this 166 | License, and how they can obtain a copy of this License. You may not 167 | attempt to alter or restrict the recipients' rights in the Source Code 168 | Form. 169 | 170 | 3.2. Distribution of Executable Form 171 | 172 | If You distribute Covered Software in Executable Form then: 173 | 174 | (a) such Covered Software must also be made available in Source Code 175 | Form, as described in Section 3.1, and You must inform recipients of 176 | the Executable Form how they can obtain a copy of such Source Code 177 | Form by reasonable means in a timely manner, at a charge no more 178 | than the cost of distribution to the recipient; and 179 | 180 | (b) You may distribute such Executable Form under the terms of this 181 | License, or sublicense it under different terms, provided that the 182 | license for the Executable Form does not attempt to limit or alter 183 | the recipients' rights in the Source Code Form under this License. 184 | 185 | 3.3. Distribution of a Larger Work 186 | 187 | You may create and distribute a Larger Work under terms of Your choice, 188 | provided that You also comply with the requirements of this License for 189 | the Covered Software. If the Larger Work is a combination of Covered 190 | Software with a work governed by one or more Secondary Licenses, and the 191 | Covered Software is not Incompatible With Secondary Licenses, this 192 | License permits You to additionally distribute such Covered Software 193 | under the terms of such Secondary License(s), so that the recipient of 194 | the Larger Work may, at their option, further distribute the Covered 195 | Software under the terms of either this License or such Secondary 196 | License(s). 197 | 198 | 3.4. Notices 199 | 200 | You may not remove or alter the substance of any license notices 201 | (including copyright notices, patent notices, disclaimers of warranty, 202 | or limitations of liability) contained within the Source Code Form of 203 | the Covered Software, except that You may alter any license notices to 204 | the extent required to remedy known factual inaccuracies. 205 | 206 | 3.5. Application of Additional Terms 207 | 208 | You may choose to offer, and to charge a fee for, warranty, support, 209 | indemnity or liability obligations to one or more recipients of Covered 210 | Software. However, You may do so only on Your own behalf, and not on 211 | behalf of any Contributor. You must make it absolutely clear that any 212 | such warranty, support, indemnity, or liability obligation is offered by 213 | You alone, and You hereby agree to indemnify every Contributor for any 214 | liability incurred by such Contributor as a result of warranty, support, 215 | indemnity or liability terms You offer. You may include additional 216 | disclaimers of warranty and limitations of liability specific to any 217 | jurisdiction. 218 | 219 | 4. Inability to Comply Due to Statute or Regulation 220 | --------------------------------------------------- 221 | 222 | If it is impossible for You to comply with any of the terms of this 223 | License with respect to some or all of the Covered Software due to 224 | statute, judicial order, or regulation then You must: (a) comply with 225 | the terms of this License to the maximum extent possible; and (b) 226 | describe the limitations and the code they affect. Such description must 227 | be placed in a text file included with all distributions of the Covered 228 | Software under this License. Except to the extent prohibited by statute 229 | or regulation, such description must be sufficiently detailed for a 230 | recipient of ordinary skill to be able to understand it. 231 | 232 | 5. Termination 233 | -------------- 234 | 235 | 5.1. The rights granted under this License will terminate automatically 236 | if You fail to comply with any of its terms. However, if You become 237 | compliant, then the rights granted under this License from a particular 238 | Contributor are reinstated (a) provisionally, unless and until such 239 | Contributor explicitly and finally terminates Your grants, and (b) on an 240 | ongoing basis, if such Contributor fails to notify You of the 241 | non-compliance by some reasonable means prior to 60 days after You have 242 | come back into compliance. Moreover, Your grants from a particular 243 | Contributor are reinstated on an ongoing basis if such Contributor 244 | notifies You of the non-compliance by some reasonable means, this is the 245 | first time You have received notice of non-compliance with this License 246 | from such Contributor, and You become compliant prior to 30 days after 247 | Your receipt of the notice. 248 | 249 | 5.2. If You initiate litigation against any entity by asserting a patent 250 | infringement claim (excluding declaratory judgment actions, 251 | counter-claims, and cross-claims) alleging that a Contributor Version 252 | directly or indirectly infringes any patent, then the rights granted to 253 | You by any and all Contributors for the Covered Software under Section 254 | 2.1 of this License shall terminate. 255 | 256 | 5.3. In the event of termination under Sections 5.1 or 5.2 above, all 257 | end user license agreements (excluding distributors and resellers) which 258 | have been validly granted by You or Your distributors under this License 259 | prior to termination shall survive termination. 260 | 261 | ************************************************************************ 262 | * * 263 | * 6. Disclaimer of Warranty * 264 | * ------------------------- * 265 | * * 266 | * Covered Software is provided under this License on an "as is" * 267 | * basis, without warranty of any kind, either expressed, implied, or * 268 | * statutory, including, without limitation, warranties that the * 269 | * Covered Software is free of defects, merchantable, fit for a * 270 | * particular purpose or non-infringing. The entire risk as to the * 271 | * quality and performance of the Covered Software is with You. * 272 | * Should any Covered Software prove defective in any respect, You * 273 | * (not any Contributor) assume the cost of any necessary servicing, * 274 | * repair, or correction. This disclaimer of warranty constitutes an * 275 | * essential part of this License. No use of any Covered Software is * 276 | * authorized under this License except under this disclaimer. * 277 | * * 278 | ************************************************************************ 279 | 280 | ************************************************************************ 281 | * * 282 | * 7. Limitation of Liability * 283 | * -------------------------- * 284 | * * 285 | * Under no circumstances and under no legal theory, whether tort * 286 | * (including negligence), contract, or otherwise, shall any * 287 | * Contributor, or anyone who distributes Covered Software as * 288 | * permitted above, be liable to You for any direct, indirect, * 289 | * special, incidental, or consequential damages of any character * 290 | * including, without limitation, damages for lost profits, loss of * 291 | * goodwill, work stoppage, computer failure or malfunction, or any * 292 | * and all other commercial damages or losses, even if such party * 293 | * shall have been informed of the possibility of such damages. This * 294 | * limitation of liability shall not apply to liability for death or * 295 | * personal injury resulting from such party's negligence to the * 296 | * extent applicable law prohibits such limitation. Some * 297 | * jurisdictions do not allow the exclusion or limitation of * 298 | * incidental or consequential damages, so this exclusion and * 299 | * limitation may not apply to You. * 300 | * * 301 | ************************************************************************ 302 | 303 | 8. Litigation 304 | ------------- 305 | 306 | Any litigation relating to this License may be brought only in the 307 | courts of a jurisdiction where the defendant maintains its principal 308 | place of business and such litigation shall be governed by laws of that 309 | jurisdiction, without reference to its conflict-of-law provisions. 310 | Nothing in this Section shall prevent a party's ability to bring 311 | cross-claims or counter-claims. 312 | 313 | 9. Miscellaneous 314 | ---------------- 315 | 316 | This License represents the complete agreement concerning the subject 317 | matter hereof. If any provision of this License is held to be 318 | unenforceable, such provision shall be reformed only to the extent 319 | necessary to make it enforceable. Any law or regulation which provides 320 | that the language of a contract shall be construed against the drafter 321 | shall not be used to construe this License against a Contributor. 322 | 323 | 10. Versions of the License 324 | --------------------------- 325 | 326 | 10.1. New Versions 327 | 328 | Mozilla Foundation is the license steward. Except as provided in Section 329 | 10.3, no one other than the license steward has the right to modify or 330 | publish new versions of this License. Each version will be given a 331 | distinguishing version number. 332 | 333 | 10.2. Effect of New Versions 334 | 335 | You may distribute the Covered Software under the terms of the version 336 | of the License under which You originally received the Covered Software, 337 | or under the terms of any subsequent version published by the license 338 | steward. 339 | 340 | 10.3. Modified Versions 341 | 342 | If you create software not governed by this License, and you want to 343 | create a new license for such software, you may create and use a 344 | modified version of this License if you rename the license and remove 345 | any references to the name of the license steward (except to note that 346 | such modified license differs from this License). 347 | 348 | 10.4. Distributing Source Code Form that is Incompatible With Secondary 349 | Licenses 350 | 351 | If You choose to distribute Source Code Form that is Incompatible With 352 | Secondary Licenses under the terms of this version of the License, the 353 | notice described in Exhibit B of this License must be attached. 354 | 355 | Exhibit A - Source Code Form License Notice 356 | ------------------------------------------- 357 | 358 | This Source Code Form is subject to the terms of the Mozilla Public 359 | License, v. 2.0. If a copy of the MPL was not distributed with this 360 | file, You can obtain one at http://mozilla.org/MPL/2.0/. 361 | 362 | If it is not possible or desirable to put the notice in a particular 363 | file, then You may include the notice in a location (such as a LICENSE 364 | file in a relevant directory) where a recipient would be likely to look 365 | for such a notice. 366 | 367 | You may add additional accurate notices of copyright ownership. 368 | 369 | Exhibit B - "Incompatible With Secondary Licenses" Notice 370 | --------------------------------------------------------- 371 | 372 | This Source Code Form is "Incompatible With Secondary Licenses", as 373 | defined by the Mozilla Public License, v. 2.0. 374 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # React Native (React Query) Toolkit Start App 2 | 3 | > A React Native boilerplate app to bootstrap your next app with React-Query! 4 | 5 | ## 🔥🔥🔥 Upgraded to the latest React-Native (> 0.69.x) with brand New Architecture (Fabric) 🔥🔥🔥 6 | 7 |
8 |
9 | 10 |
11 | 12 | [![License](https://img.shields.io/github/license/IronTony/react-native-react-query-starter-app)](LICENSE) 13 | [![All Contributors](https://img.shields.io/badge/all_contributors-2-screen.svg?style=flat)](#contributors-:sparkles:) 14 | 15 | 16 | 17 | [![Issues](https://img.shields.io/github/issues/IronTony/react-native-react-query-starter-app.svg)](https://github.com/IronTony/react-native-react-query-starter-app/issues) 18 | 19 | [![Build](https://travis-ci.com/IronTony/react-native-react-query-starter-app.svg?branch=master)](https://travis-ci.com/IronTony/react-native-react-query-starter-app) 20 | 21 | [![Build](https://img.shields.io/badge/iOS%20Tested-success-brightgreen.svg)](https://github.com/IronTony/react-native-react-query-starter-app) 22 | [![Build](https://img.shields.io/badge/Android%20Tested-success-brightgreen.svg)](https://github.com/IronTony/react-native-react-query-starter-app) 23 | 24 | Buy Me A Coffee 25 | 26 | # Table of Contents 27 | 28 | - [🔥🔥🔥 Upgraded to the latest React-Native (> 0.69.x) with brand New Architecture (Fabric) 🔥🔥🔥](#-upgraded-to-the-latest-react-native--069x-with-brand-new-architecture-fabric-) 29 | - [Installation :inbox_tray:](#installation-inbox_tray) 30 | - [Rename project and bundles :memo: :package:](#rename-project-and-bundles-memo-package) 31 | - [iOS & Android](#ios--android) 32 | - [Environment Setup :globe_with_meridians:](#environment-setup-globe_with_meridians) 33 | - [Scripts :wrench:](#scripts-wrench) 34 | - [Run the app](#run-the-app) 35 | - [Generate app icons](#generate-app-icons) 36 | - [Generate Splashscreen](#generate-splashscreen) 37 | - [To enabled React-Native (Fabric) new architecture](#to-enabled-react-native-fabric-new-architecture) 38 | - [Setup iOS](#setup-ios) 39 | - [Typescript (optional)](#typescript-optional) 40 | - [Roadmap :running:](#roadmap-running) 41 | - [Screenshots](#screenshots) 42 | - [Contributors :sparkles:](#contributors-sparkles) 43 | - [License :scroll:](#license-scroll) 44 | 45 | --- 46 | 47 | ## Installation :inbox_tray: 48 | 49 | ```bash 50 | # Setup your project 51 | > npx degit IronTony/react-native-react-query-starter-app your-new-app 52 | 53 | > cd your-new-app 54 | 55 | # Install dependencies 56 | > yarn 57 | 58 | # if needed, setup iOS development environment 59 | yarn setup:ios 60 | ``` 61 | 62 | See [`environment`](#environment-setup-:globe_with_meridians:) section for how to configure env variables. 63 | 64 | See [`scripts`](#scripts-:wrench:) section for how to run the app. 65 | 66 | --- 67 | 68 | ## Rename project and bundles :memo: :package: 69 | 70 | To rename the project and bundles, just follow these steps: 71 | 72 | ### iOS & Android 73 | 74 | Run `npx react-native-rename [name] -b [bundle-identifier]` from the project root 75 | 76 | Example: 77 | `npx react-native-rename "Test New App" -b com.testnewapp` 78 | 79 | --- 80 | 81 | ## Environment Setup :globe_with_meridians: 82 | 83 | `React Native Starter App` environments variables management is based on a custom script and the `app.json` config file. 84 | 85 | Define your environment variables inside `app.json` inside the `environments` object under the desired 86 | environment key (such as `development`, `staging` or `production`) and then run the app for the required env 87 | using one of the available run scripts (e.g. `ios:dev`). 88 | 89 | If you want to use IDEs such Xcode or Android Studio, you have to set up the ENV variables with these commands: 90 | 91 | - `yarn env:dev`, to set the development ENV variables 92 | - `yarn env:stage`, to set the staging ENV variables 93 | - `yarn env:prod`, to set the production ENV variables 94 | 95 | --- 96 | 97 | ## Scripts :wrench: 98 | 99 | ### Run the app 100 | 101 | To run the app use one of the following scripts: 102 | 103 | - `yarn android:dev`, to start the app on Android with the `development` environment variables. 104 | - `yarn android:stage`, to start the app on Android with the `staging` environment variables. 105 | - `yarn android:prod`, to start the app on Android with the `production` environment variables. 106 | 107 | - `yarn ios:dev`, to start the app on iOS with the `development` environment variables. 108 | - `yarn ios:stage`, to start the app on iOS with the `staging` environment variables. 109 | - `yarn ios:prod`, to start the app on iOS with the `production` environment variables. 110 | 111 | ### Generate app icons 112 | 113 | To setup the app icons: 114 | 115 | - create an image at least `1024x1024px` 116 | - place it under `/assets` folder as `icon.png` 117 | - run 118 | 119 | ```sh 120 | yarn assets:icons 121 | ``` 122 | 123 | ### Generate Splashscreen 124 | 125 | To setup the app splashscreen: 126 | 127 | - create an image at least `1242x2208px` 128 | - place it under `/assets` folder as `splashscreen.png` 129 | - run 130 | 131 | ```sh 132 | yarn assets:splashscreen 133 | ``` 134 | 135 | ### To enabled React-Native (Fabric) new architecture 136 | 137 | Check the official documentation [here](https://reactnative.dev/docs/new-architecture-intro) 138 | 139 | ### Setup iOS 140 | 141 | To setup the environment to run on iOS, run 142 | 143 | ```sh 144 | yarn setup:ios 145 | ``` 146 | 147 | this will run `cocoapods` to install all the required dependencies. 148 | 149 | ### Typescript (optional) 150 | 151 | The use of Typescript in the project is not mandatory. 152 | You can just write all your code using plain Javascript. 153 | Our hint is to create all files as below: 154 | 155 | - files with logic and Views with `tsx` extension 156 | - files with Stylesheet and others with `ts` extension 157 | 158 | To enable full Typescript checks, just open the `tsconfig.json` file and chage as below:
159 | 160 | ``` 161 | "noImplicitAny": true, // set to true to be explicit and declare all types now
162 | "strict": true, // enable it to use fully Typescript set of invasive rules
163 | ``` 164 | 165 | _REMEMBER: the entry point file in the root of the project MUST be index.js_ 166 | 167 | --- 168 | 169 | ## Roadmap :running: 170 | 171 | ✅ Initial Setup
172 | ✅ Splashscreen (https://github.com/crazycodeboy/react-native-splash-screen)
173 | ✅ Toolbox (https://github.com/panz3r/react-native-toolbox)
174 | ✅ Standard tree folders structure
175 | ✅ `React-Native 0.69 (new architecture)`
176 | ✅ `React-query`
177 | ✅ `React-query Custom hooks (eg. GET, POST, PUT, PATCH, DELETE)`
178 | ✅ `React Native Flipper Integration`
179 | ✅ `i18next`
180 | ✅ `React-navigation v6` ❤️
181 | ✅ `Nativebase v3` as design system
182 | ✅ `Env` variables selection experimental way ⚗️⚗️⚗️
183 | ✅ Typescript (optional use. Read the DOC above)
184 | 185 | --- 186 | 187 | ## Screenshots 188 | 189 |
190 | 191 |
192 | 193 |
194 | 195 |
196 | 197 |
198 | 199 |
200 | 201 | --- 202 | 203 | ## Contributors :sparkles: 204 | 205 | Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)): 206 | 207 | 208 | 209 | 210 | 211 | 212 | 213 | 214 | 215 |

IronTony
🤔 💻 📖 🐛 🚧 📦 💬 👀 ⚠️ 💡
Mattia Panzeri
🤔
216 | 217 | 218 | 219 | 220 | 221 | 222 | This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome! 223 | 224 | --- 225 | 226 | ## License :scroll: 227 | 228 | Licensed under [Mozilla Public License Version 2.0](LICENSE) 229 | -------------------------------------------------------------------------------- /__tests__/App-test.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @format 3 | */ 4 | 5 | import 'react-native'; 6 | import React from 'react'; 7 | import App from '../App'; 8 | 9 | // Note: test renderer must be required after react-native. 10 | import renderer from 'react-test-renderer'; 11 | 12 | it('renders correctly', () => { 13 | renderer.create(); 14 | }); 15 | -------------------------------------------------------------------------------- /android/app/BUCK: -------------------------------------------------------------------------------- 1 | # To learn about Buck see [Docs](https://buckbuild.com/). 2 | # To run your application with Buck: 3 | # - install Buck 4 | # - `npm start` - to start the packager 5 | # - `cd android` 6 | # - `keytool -genkey -v -keystore keystores/debug.keystore -storepass android -alias androiddebugkey -keypass android -dname "CN=Android Debug,O=Android,C=US"` 7 | # - `./gradlew :app:copyDownloadableDepsToLibs` - make all Gradle compile dependencies available to Buck 8 | # - `buck install -r android/app` - compile, install and run application 9 | # 10 | 11 | load(":build_defs.bzl", "create_aar_targets", "create_jar_targets") 12 | 13 | lib_deps = [] 14 | 15 | create_aar_targets(glob(["libs/*.aar"])) 16 | 17 | create_jar_targets(glob(["libs/*.jar"])) 18 | 19 | android_library( 20 | name = "all-libs", 21 | exported_deps = lib_deps, 22 | ) 23 | 24 | android_library( 25 | name = "app-code", 26 | srcs = glob([ 27 | "src/main/java/**/*.java", 28 | ]), 29 | deps = [ 30 | ":all-libs", 31 | ":build_config", 32 | ":res", 33 | ], 34 | ) 35 | 36 | android_build_config( 37 | name = "build_config", 38 | package = "com.reactnativestarterapp", 39 | ) 40 | 41 | android_resource( 42 | name = "res", 43 | package = "com.reactnativestarterapp", 44 | res = "src/main/res", 45 | ) 46 | 47 | android_binary( 48 | name = "app", 49 | keystore = "//android/keystores:debug", 50 | manifest = "src/main/AndroidManifest.xml", 51 | package_type = "debug", 52 | deps = [ 53 | ":app-code", 54 | ], 55 | ) 56 | -------------------------------------------------------------------------------- /android/app/build.gradle: -------------------------------------------------------------------------------- 1 | apply plugin: "com.android.application" 2 | 3 | import com.android.build.OutputFile 4 | //import org.apache.tools.ant.taskdefs.condition.Os 5 | 6 | /** 7 | * The react.gradle file registers a task for each build variant (e.g. bundleDebugJsAndAssets 8 | * and bundleReleaseJsAndAssets). 9 | * These basically call `react-native bundle` with the correct arguments during the Android build 10 | * cycle. By default, bundleDebugJsAndAssets is skipped, as in debug/dev mode we prefer to load the 11 | * bundle directly from the development server. Below you can see all the possible configurations 12 | * and their defaults. If you decide to add a configuration block, make sure to add it before the 13 | * `apply from: "../../node_modules/react-native/react.gradle"` line. 14 | * 15 | * project.ext.react = [ 16 | * // the name of the generated asset file containing your JS bundle 17 | * bundleAssetName: "index.android.bundle", 18 | * 19 | * // the entry file for bundle generation. If none specified and 20 | * // "index.android.js" exists, it will be used. Otherwise "index.js" is 21 | * // default. Can be overridden with ENTRY_FILE environment variable. 22 | * entryFile: "index.android.js", 23 | * 24 | * // https://reactnative.dev/docs/performance#enable-the-ram-format 25 | * bundleCommand: "ram-bundle", 26 | * 27 | * // whether to bundle JS and assets in debug mode 28 | * bundleInDebug: false, 29 | * 30 | * // whether to bundle JS and assets in release mode 31 | * bundleInRelease: true, 32 | * 33 | * // whether to bundle JS and assets in another build variant (if configured). 34 | * // See http://tools.android.com/tech-docs/new-build-system/user-guide#TOC-Build-Variants 35 | * // The configuration property can be in the following formats 36 | * // 'bundleIn${productFlavor}${buildType}' 37 | * // 'bundleIn${buildType}' 38 | * // bundleInFreeDebug: true, 39 | * // bundleInPaidRelease: true, 40 | * // bundleInBeta: true, 41 | * 42 | * // whether to disable dev mode in custom build variants (by default only disabled in release) 43 | * // for example: to disable dev mode in the staging build type (if configured) 44 | * devDisabledInStaging: true, 45 | * // The configuration property can be in the following formats 46 | * // 'devDisabledIn${productFlavor}${buildType}' 47 | * // 'devDisabledIn${buildType}' 48 | * 49 | * // the root of your project, i.e. where "package.json" lives 50 | * root: "../../", 51 | * 52 | * // where to put the JS bundle asset in debug mode 53 | * jsBundleDirDebug: "$buildDir/intermediates/assets/debug", 54 | * 55 | * // where to put the JS bundle asset in release mode 56 | * jsBundleDirRelease: "$buildDir/intermediates/assets/release", 57 | * 58 | * // where to put drawable resources / React Native assets, e.g. the ones you use via 59 | * // require('./image.png')), in debug mode 60 | * resourcesDirDebug: "$buildDir/intermediates/res/merged/debug", 61 | * 62 | * // where to put drawable resources / React Native assets, e.g. the ones you use via 63 | * // require('./image.png')), in release mode 64 | * resourcesDirRelease: "$buildDir/intermediates/res/merged/release", 65 | * 66 | * // by default the gradle tasks are skipped if none of the JS files or assets change; this means 67 | * // that we don't look at files in android/ or ios/ to determine whether the tasks are up to 68 | * // date; if you have any other folders that you want to ignore for performance reasons (gradle 69 | * // indexes the entire tree), add them here. Alternatively, if you have JS files in android/ 70 | * // for example, you might want to remove it from here. 71 | * inputExcludes: ["android/**", "ios/**"], 72 | * 73 | * // override which node gets called and with what additional arguments 74 | * nodeExecutableAndArgs: ["node"], 75 | * 76 | * // supply additional arguments to the packager 77 | * extraPackagerArgs: [] 78 | * ] 79 | */ 80 | 81 | project.ext.react = [ 82 | enableHermes: true, // clean and rebuild if changing 83 | ] 84 | 85 | apply from: "../../node_modules/react-native/react.gradle" 86 | apply from: "../../node_modules/react-native-vector-icons/fonts.gradle" 87 | 88 | /** 89 | * Set this to true to create two separate APKs instead of one: 90 | * - An APK that only works on ARM devices 91 | * - An APK that only works on x86 devices 92 | * The advantage is the size of the APK is reduced by about 4MB. 93 | * Upload all the APKs to the Play Store and people will download 94 | * the correct one based on the CPU architecture of their device. 95 | */ 96 | def enableSeparateBuildPerCPUArchitecture = false 97 | 98 | /** 99 | * Run Proguard to shrink the Java bytecode in release builds. 100 | */ 101 | def enableProguardInReleaseBuilds = false 102 | 103 | /** 104 | * The preferred build flavor of JavaScriptCore. 105 | * 106 | * For example, to use the international variant, you can use: 107 | * `def jscFlavor = 'org.webkit:android-jsc-intl:+'` 108 | * 109 | * The international variant includes ICU i18n library and necessary data 110 | * allowing to use e.g. `Date.toLocaleString` and `String.localeCompare` that 111 | * give correct results when using with locales other than en-US. Note that 112 | * this variant is about 6MiB larger per architecture than default. 113 | */ 114 | def jscFlavor = 'org.webkit:android-jsc:+' 115 | 116 | /** 117 | * Whether to enable the Hermes VM. 118 | * 119 | * This should be set on project.ext.react and that value will be read here. If it is not set 120 | * on project.ext.react, JavaScript will not be compiled to Hermes Bytecode 121 | * and the benefits of using Hermes will therefore be sharply reduced. 122 | */ 123 | def enableHermes = project.ext.react.get("enableHermes", false); 124 | 125 | /** 126 | * Architectures to build native code for. 127 | */ 128 | def reactNativeArchitectures() { 129 | def value = project.getProperties().get("reactNativeArchitectures") 130 | return value ? value.split(",") : ["armeabi-v7a", "x86", "x86_64", "arm64-v8a"] 131 | } 132 | 133 | android { 134 | ndkVersion rootProject.ext.ndkVersion 135 | 136 | compileSdkVersion rootProject.ext.compileSdkVersion 137 | 138 | defaultConfig { 139 | applicationId "com.reactnativestarterapp" 140 | minSdkVersion rootProject.ext.minSdkVersion 141 | targetSdkVersion rootProject.ext.targetSdkVersion 142 | versionCode 1 143 | versionName "1.0" 144 | buildConfigField "boolean", "IS_NEW_ARCHITECTURE_ENABLED", isNewArchitectureEnabled().toString() 145 | 146 | if (isNewArchitectureEnabled()) { 147 | // We configure the NDK build only if you decide to opt-in for the New Architecture. 148 | externalNativeBuild { 149 | ndkBuild { 150 | arguments "APP_PLATFORM=android-21", 151 | "APP_STL=c++_shared", 152 | "NDK_TOOLCHAIN_VERSION=clang", 153 | "GENERATED_SRC_DIR=$buildDir/generated/source", 154 | "PROJECT_BUILD_DIR=$buildDir", 155 | "REACT_ANDROID_DIR=$rootDir/../node_modules/react-native/ReactAndroid", 156 | "REACT_ANDROID_BUILD_DIR=$rootDir/../node_modules/react-native/ReactAndroid/build", 157 | "NODE_MODULES_DIR=$rootDir/../node_modules" 158 | cFlags "-Wall", "-Werror", "-fexceptions", "-frtti", "-DWITH_INSPECTOR=1" 159 | cppFlags "-std=c++17" 160 | // Make sure this target name is the same you specify inside the 161 | // src/main/jni/Android.mk file for the `LOCAL_MODULE` variable. 162 | targets "reactnativestarterapp_appmodules" 163 | } 164 | } 165 | if (!enableSeparateBuildPerCPUArchitecture) { 166 | ndk { 167 | abiFilters (*reactNativeArchitectures()) 168 | } 169 | } 170 | } 171 | } 172 | 173 | if (isNewArchitectureEnabled()) { 174 | // We configure the NDK build only if you decide to opt-in for the New Architecture. 175 | externalNativeBuild { 176 | ndkBuild { 177 | path "$projectDir/src/main/jni/Android.mk" 178 | } 179 | } 180 | def reactAndroidProjectDir = project(':ReactAndroid').projectDir 181 | def packageReactNdkDebugLibs = tasks.register("packageReactNdkDebugLibs", Copy) { 182 | dependsOn(":ReactAndroid:packageReactNdkDebugLibsForBuck") 183 | from("$reactAndroidProjectDir/src/main/jni/prebuilt/lib") 184 | into("$buildDir/react-ndk/exported") 185 | } 186 | def packageReactNdkReleaseLibs = tasks.register("packageReactNdkReleaseLibs", Copy) { 187 | dependsOn(":ReactAndroid:packageReactNdkReleaseLibsForBuck") 188 | from("$reactAndroidProjectDir/src/main/jni/prebuilt/lib") 189 | into("$buildDir/react-ndk/exported") 190 | } 191 | afterEvaluate { 192 | // If you wish to add a custom TurboModule or component locally, 193 | // you should uncomment this line. 194 | // preBuild.dependsOn("generateCodegenArtifactsFromSchema") 195 | preDebugBuild.dependsOn(packageReactNdkDebugLibs) 196 | preReleaseBuild.dependsOn(packageReactNdkReleaseLibs) 197 | 198 | // Due to a bug inside AGP, we have to explicitly set a dependency 199 | // between configureNdkBuild* tasks and the preBuild tasks. 200 | // This can be removed once this is solved: https://issuetracker.google.com/issues/207403732 201 | configureNdkBuildRelease.dependsOn(preReleaseBuild) 202 | configureNdkBuildDebug.dependsOn(preDebugBuild) 203 | reactNativeArchitectures().each { architecture -> 204 | tasks.findByName("configureNdkBuildDebug[${architecture}]")?.configure { 205 | dependsOn("preDebugBuild") 206 | } 207 | tasks.findByName("configureNdkBuildRelease[${architecture}]")?.configure { 208 | dependsOn("preReleaseBuild") 209 | } 210 | } 211 | } 212 | } 213 | 214 | splits { 215 | abi { 216 | reset() 217 | enable enableSeparateBuildPerCPUArchitecture 218 | universalApk true // If true, also generate a universal APK 219 | include (*reactNativeArchitectures()) 220 | } 221 | } 222 | signingConfigs { 223 | debug { 224 | storeFile file('debug.keystore') 225 | storePassword 'android' 226 | keyAlias 'androiddebugkey' 227 | keyPassword 'android' 228 | } 229 | } 230 | buildTypes { 231 | debug { 232 | signingConfig signingConfigs.debug 233 | } 234 | release { 235 | // Caution! In production, you need to generate your own keystore file. 236 | // see https://reactnative.dev/docs/signed-apk-android. 237 | signingConfig signingConfigs.debug 238 | minifyEnabled enableProguardInReleaseBuilds 239 | proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro" 240 | } 241 | } 242 | 243 | // applicationVariants are e.g. debug, release 244 | applicationVariants.all { variant -> 245 | variant.outputs.each { output -> 246 | // For each separate APK per architecture, set a unique version code as described here: 247 | // https://developer.android.com/studio/build/configure-apk-splits.html 248 | // Example: versionCode 1 will generate 1001 for armeabi-v7a, 1002 for x86, etc. 249 | def versionCodes = ["armeabi-v7a": 1, "x86": 2, "arm64-v8a": 3, "x86_64": 4] 250 | def abi = output.getFilter(OutputFile.ABI) 251 | if (abi != null) { // null for the universal-debug, universal-release variants 252 | output.versionCodeOverride = 253 | defaultConfig.versionCode * 1000 + versionCodes.get(abi) 254 | } 255 | 256 | } 257 | } 258 | } 259 | 260 | dependencies { 261 | implementation fileTree(dir: "libs", include: ["*.jar"]) 262 | 263 | //noinspection GradleDynamicVersion 264 | implementation "com.facebook.react:react-native:+" // From node_modules 265 | 266 | implementation "androidx.swiperefreshlayout:swiperefreshlayout:1.0.0" 267 | 268 | implementation 'com.facebook.fresco:fresco:2.6.0' 269 | 270 | // For animated GIF support 271 | implementation 'com.facebook.fresco:animated-gif:2.6.0' 272 | 273 | // For WebP support, including animated WebP 274 | implementation 'com.facebook.fresco:animated-webp:2.6.0' 275 | implementation 'com.facebook.fresco:webpsupport:2.6.0' 276 | 277 | // For WebP support, without animations 278 | implementation 'com.facebook.fresco:webpsupport:2.6.0' 279 | 280 | implementation project(':react-native-splash-screen') 281 | 282 | debugImplementation("com.facebook.flipper:flipper:${FLIPPER_VERSION}") { 283 | exclude group:'com.facebook.fbjni' 284 | } 285 | 286 | debugImplementation("com.facebook.flipper:flipper-network-plugin:${FLIPPER_VERSION}") { 287 | exclude group:'com.facebook.flipper' 288 | exclude group:'com.squareup.okhttp3', module:'okhttp' 289 | } 290 | 291 | debugImplementation("com.facebook.flipper:flipper-fresco-plugin:${FLIPPER_VERSION}") { 292 | exclude group:'com.facebook.flipper' 293 | } 294 | 295 | if (enableHermes) { 296 | //noinspection GradleDynamicVersion 297 | implementation("com.facebook.react:hermes-engine:+") { // From node_modules 298 | exclude group:'com.facebook.fbjni' 299 | } 300 | } else { 301 | implementation jscFlavor 302 | } 303 | } 304 | 305 | if (isNewArchitectureEnabled()) { 306 | // If new architecture is enabled, we let you build RN from source 307 | // Otherwise we fallback to a prebuilt .aar bundled in the NPM package. 308 | // This will be applied to all the imported transtitive dependency. 309 | configurations.all { 310 | resolutionStrategy.dependencySubstitution { 311 | substitute(module("com.facebook.react:react-native")) 312 | .using(project(":ReactAndroid")) 313 | .because("On New Architecture we're building React Native from source") 314 | substitute(module("com.facebook.react:hermes-engine")) 315 | .using(project(":ReactAndroid:hermes-engine")) 316 | .because("On New Architecture we're building Hermes from source") 317 | } 318 | } 319 | } 320 | 321 | // Run this once to be able to run the application with BUCK 322 | // puts all compile dependencies into folder libs for BUCK to use 323 | task copyDownloadableDepsToLibs(type: Copy) { 324 | from configurations.implementation 325 | into 'libs' 326 | } 327 | 328 | apply from: file("../../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesAppBuildGradle(project) 329 | 330 | def isNewArchitectureEnabled() { 331 | // To opt-in for the New Architecture, you can either: 332 | // - Set `newArchEnabled` to true inside the `gradle.properties` file 333 | // - Invoke gradle with `-newArchEnabled=true` 334 | // - Set an environment variable `ORG_GRADLE_PROJECT_newArchEnabled=true` 335 | return project.hasProperty("newArchEnabled") && project.newArchEnabled == "true" 336 | } 337 | -------------------------------------------------------------------------------- /android/app/build_defs.bzl: -------------------------------------------------------------------------------- 1 | """Helper definitions to glob .aar and .jar targets""" 2 | 3 | def create_aar_targets(aarfiles): 4 | for aarfile in aarfiles: 5 | name = "aars__" + aarfile[aarfile.rindex("/") + 1:aarfile.rindex(".aar")] 6 | lib_deps.append(":" + name) 7 | android_prebuilt_aar( 8 | name = name, 9 | aar = aarfile, 10 | ) 11 | 12 | def create_jar_targets(jarfiles): 13 | for jarfile in jarfiles: 14 | name = "jars__" + jarfile[jarfile.rindex("/") + 1:jarfile.rindex(".jar")] 15 | lib_deps.append(":" + name) 16 | prebuilt_jar( 17 | name = name, 18 | binary_jar = jarfile, 19 | ) 20 | -------------------------------------------------------------------------------- /android/app/debug.keystore: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/android/app/debug.keystore -------------------------------------------------------------------------------- /android/app/proguard-rules.pro: -------------------------------------------------------------------------------- 1 | # Add project specific ProGuard rules here. 2 | # By default, the flags in this file are appended to flags specified 3 | # in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt 4 | # You can edit the include path and order by changing the proguardFiles 5 | # directive in build.gradle. 6 | # 7 | # For more details, see 8 | # http://developer.android.com/guide/developing/tools/proguard.html 9 | 10 | # Add any project specific keep options here: 11 | 12 | -keep class com.swmansion.reanimated.** { *; } 13 | -keep class com.facebook.react.turbomodule.** { *; } -------------------------------------------------------------------------------- /android/app/src/debug/AndroidManifest.xml: -------------------------------------------------------------------------------- 1 | 2 | 4 | 5 | 6 | 7 | 11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /android/app/src/debug/java/com/reactnativestarterapp/ReactNativeFlipper.java: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) Meta Platforms, Inc. and affiliates. 3 | * 4 | *

This source code is licensed under the MIT license found in the LICENSE file in the root 5 | * directory of this source tree. 6 | */ 7 | package com.reactnativestarterapp; 8 | 9 | import android.content.Context; 10 | import com.facebook.flipper.android.AndroidFlipperClient; 11 | import com.facebook.flipper.android.utils.FlipperUtils; 12 | import com.facebook.flipper.core.FlipperClient; 13 | import com.facebook.flipper.plugins.crashreporter.CrashReporterPlugin; 14 | import com.facebook.flipper.plugins.databases.DatabasesFlipperPlugin; 15 | import com.facebook.flipper.plugins.fresco.FrescoFlipperPlugin; 16 | import com.facebook.flipper.plugins.inspector.DescriptorMapping; 17 | import com.facebook.flipper.plugins.inspector.InspectorFlipperPlugin; 18 | import com.facebook.flipper.plugins.network.FlipperOkhttpInterceptor; 19 | import com.facebook.flipper.plugins.network.NetworkFlipperPlugin; 20 | import com.facebook.flipper.plugins.react.ReactFlipperPlugin; 21 | import com.facebook.flipper.plugins.sharedpreferences.SharedPreferencesFlipperPlugin; 22 | import com.facebook.react.ReactInstanceEventListener; 23 | import com.facebook.react.ReactInstanceManager; 24 | import com.facebook.react.bridge.ReactContext; 25 | import com.facebook.react.modules.network.NetworkingModule; 26 | import okhttp3.OkHttpClient; 27 | 28 | public class ReactNativeFlipper { 29 | public static void initializeFlipper(Context context, ReactInstanceManager reactInstanceManager) { 30 | if (FlipperUtils.shouldEnableFlipper(context)) { 31 | final FlipperClient client = AndroidFlipperClient.getInstance(context); 32 | 33 | client.addPlugin(new InspectorFlipperPlugin(context, DescriptorMapping.withDefaults())); 34 | client.addPlugin(new ReactFlipperPlugin()); 35 | client.addPlugin(new DatabasesFlipperPlugin(context)); 36 | client.addPlugin(new SharedPreferencesFlipperPlugin(context)); 37 | client.addPlugin(CrashReporterPlugin.getInstance()); 38 | 39 | NetworkFlipperPlugin networkFlipperPlugin = new NetworkFlipperPlugin(); 40 | NetworkingModule.setCustomClientBuilder( 41 | new NetworkingModule.CustomClientBuilder() { 42 | @Override 43 | public void apply(OkHttpClient.Builder builder) { 44 | builder.addNetworkInterceptor(new FlipperOkhttpInterceptor(networkFlipperPlugin)); 45 | } 46 | }); 47 | client.addPlugin(networkFlipperPlugin); 48 | client.start(); 49 | 50 | // Fresco Plugin needs to ensure that ImagePipelineFactory is initialized 51 | // Hence we run if after all native modules have been initialized 52 | ReactContext reactContext = reactInstanceManager.getCurrentReactContext(); 53 | if (reactContext == null) { 54 | reactInstanceManager.addReactInstanceEventListener( 55 | new ReactInstanceEventListener() { 56 | @Override 57 | public void onReactContextInitialized(ReactContext reactContext) { 58 | reactInstanceManager.removeReactInstanceEventListener(this); 59 | reactContext.runOnNativeModulesQueueThread( 60 | new Runnable() { 61 | @Override 62 | public void run() { 63 | client.addPlugin(new FrescoFlipperPlugin()); 64 | } 65 | }); 66 | } 67 | }); 68 | } else { 69 | client.addPlugin(new FrescoFlipperPlugin()); 70 | } 71 | } 72 | } 73 | } -------------------------------------------------------------------------------- /android/app/src/main/AndroidManifest.xml: -------------------------------------------------------------------------------- 1 | 3 | 4 | 5 | 6 | 14 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Lato-Black.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/android/app/src/main/assets/fonts/Lato-Black.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Lato-BlackItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/android/app/src/main/assets/fonts/Lato-BlackItalic.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Lato-Bold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/android/app/src/main/assets/fonts/Lato-Bold.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Lato-BoldItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/android/app/src/main/assets/fonts/Lato-BoldItalic.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Lato-Italic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/android/app/src/main/assets/fonts/Lato-Italic.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Lato-Light.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/android/app/src/main/assets/fonts/Lato-Light.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Lato-LightItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/android/app/src/main/assets/fonts/Lato-LightItalic.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Lato-Regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/android/app/src/main/assets/fonts/Lato-Regular.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Lato-Thin.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/android/app/src/main/assets/fonts/Lato-Thin.ttf -------------------------------------------------------------------------------- /android/app/src/main/assets/fonts/Lato-ThinItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/android/app/src/main/assets/fonts/Lato-ThinItalic.ttf -------------------------------------------------------------------------------- /android/app/src/main/java/com/reactnativestarterapp/MainActivity.java: -------------------------------------------------------------------------------- 1 | package com.reactnativestarterapp; 2 | 3 | import android.os.Bundle; 4 | import com.facebook.react.ReactActivity; 5 | import com.facebook.react.ReactActivityDelegate; 6 | import com.facebook.react.ReactRootView; 7 | import org.devio.rn.splashscreen.SplashScreen; 8 | 9 | public class MainActivity extends ReactActivity { 10 | 11 | /** 12 | * Returns the name of the main component registered from JavaScript. This is used to schedule 13 | * rendering of the component. 14 | */ 15 | @Override 16 | protected String getMainComponentName() { 17 | return "ReactNativeStarterApp"; 18 | } 19 | 20 | /** 21 | * Returns the instance of the {@link ReactActivityDelegate}. There the RootView is created and 22 | * you can specify the renderer you wish to use - the new renderer (Fabric) or the old renderer 23 | * (Paper). 24 | */ 25 | @Override 26 | protected ReactActivityDelegate createReactActivityDelegate() { 27 | return new MainActivityDelegate(this, getMainComponentName()); 28 | } 29 | 30 | public static class MainActivityDelegate extends ReactActivityDelegate { 31 | public MainActivityDelegate(ReactActivity activity, String mainComponentName) { 32 | super(activity, mainComponentName); 33 | } 34 | @Override 35 | protected ReactRootView createRootView() { 36 | ReactRootView reactRootView = new ReactRootView(getContext()); 37 | // If you opted-in for the New Architecture, we enable the Fabric Renderer. 38 | reactRootView.setIsFabric(BuildConfig.IS_NEW_ARCHITECTURE_ENABLED); 39 | return reactRootView; 40 | } 41 | 42 | @Override 43 | protected boolean isConcurrentRootEnabled() { 44 | // If you opted-in for the New Architecture, we enable Concurrent Root (i.e. React 18). 45 | // More on this on https://reactjs.org/blog/2022/03/29/react-v18.html 46 | return BuildConfig.IS_NEW_ARCHITECTURE_ENABLED; 47 | } 48 | } 49 | 50 | @Override 51 | protected void onCreate(Bundle savedInstanceState) { 52 | SplashScreen.show(this); 53 | super.onCreate(savedInstanceState); 54 | } 55 | } 56 | -------------------------------------------------------------------------------- /android/app/src/main/java/com/reactnativestarterapp/MainApplication.java: -------------------------------------------------------------------------------- 1 | package com.reactnativestarterapp; 2 | 3 | import android.app.Application; 4 | import android.content.Context; 5 | import com.facebook.react.PackageList; 6 | import com.facebook.react.ReactApplication; 7 | import com.facebook.react.ReactInstanceManager; 8 | import org.devio.rn.splashscreen.SplashScreenReactPackage; 9 | import com.facebook.react.ReactNativeHost; 10 | import com.facebook.react.ReactPackage; 11 | import com.facebook.react.config.ReactFeatureFlags; 12 | import com.facebook.soloader.SoLoader; 13 | import com.reactnativestarterapp.newarchitecture.MainApplicationReactNativeHost; 14 | import java.lang.reflect.InvocationTargetException; 15 | import java.util.List; 16 | 17 | import com.facebook.react.bridge.JSIModulePackage; 18 | import com.swmansion.reanimated.ReanimatedJSIModulePackage; 19 | 20 | public class MainApplication extends Application implements ReactApplication { 21 | 22 | private final ReactNativeHost mReactNativeHost = 23 | new ReactNativeHost(this) { 24 | @Override 25 | public boolean getUseDeveloperSupport() { 26 | return BuildConfig.DEBUG; 27 | } 28 | 29 | @Override 30 | protected List getPackages() { 31 | @SuppressWarnings("UnnecessaryLocalVariable") 32 | List packages = new PackageList(this).getPackages(); 33 | // Packages that cannot be autolinked yet can be added manually here, for example: 34 | // packages.add(new MyReactNativePackage()); 35 | return packages; 36 | } 37 | 38 | @Override 39 | protected String getJSMainModuleName() { 40 | return "index"; 41 | } 42 | 43 | @Override 44 | protected JSIModulePackage getJSIModulePackage() { 45 | return new ReanimatedJSIModulePackage(); 46 | } 47 | }; 48 | 49 | private final ReactNativeHost mNewArchitectureNativeHost = 50 | new MainApplicationReactNativeHost(this); 51 | 52 | @Override 53 | public ReactNativeHost getReactNativeHost() { 54 | if (BuildConfig.IS_NEW_ARCHITECTURE_ENABLED) { 55 | return mNewArchitectureNativeHost; 56 | } else { 57 | return mReactNativeHost; 58 | } 59 | } 60 | 61 | @Override 62 | public void onCreate() { 63 | super.onCreate(); 64 | // If you opted-in for the New Architecture, we enable the TurboModule system 65 | ReactFeatureFlags.useTurboModules = BuildConfig.IS_NEW_ARCHITECTURE_ENABLED; 66 | SoLoader.init(this, /* native exopackage */ false); 67 | initializeFlipper(this, getReactNativeHost().getReactInstanceManager()); 68 | } 69 | 70 | /** 71 | * Loads Flipper in React Native templates. Call this in the onCreate method with something like 72 | * initializeFlipper(this, getReactNativeHost().getReactInstanceManager()); 73 | * 74 | * @param context 75 | * @param reactInstanceManager 76 | */ 77 | private static void initializeFlipper( 78 | Context context, ReactInstanceManager reactInstanceManager) { 79 | if (BuildConfig.DEBUG) { 80 | try { 81 | /* 82 | We use reflection here to pick up the class that initializes Flipper, 83 | since Flipper library is not available in release mode 84 | */ 85 | Class aClass = Class.forName("com.reactnativestarterapp.ReactNativeFlipper"); 86 | aClass 87 | .getMethod("initializeFlipper", Context.class, ReactInstanceManager.class) 88 | .invoke(null, context, reactInstanceManager); 89 | } catch (ClassNotFoundException e) { 90 | e.printStackTrace(); 91 | } catch (NoSuchMethodException e) { 92 | e.printStackTrace(); 93 | } catch (IllegalAccessException e) { 94 | e.printStackTrace(); 95 | } catch (InvocationTargetException e) { 96 | e.printStackTrace(); 97 | } 98 | } 99 | } 100 | } 101 | -------------------------------------------------------------------------------- /android/app/src/main/java/com/reactnativestarterapp/SplashActivity.java: -------------------------------------------------------------------------------- 1 | package com.reactnativestarterapp; // make sure this is your package name 2 | 3 | import android.content.Intent; 4 | import android.os.Bundle; 5 | import androidx.appcompat.app.AppCompatActivity; 6 | 7 | public class SplashActivity extends AppCompatActivity { 8 | @Override 9 | protected void onCreate(Bundle savedInstanceState) { 10 | super.onCreate(savedInstanceState); 11 | 12 | Intent intent = new Intent(this, MainActivity.class); 13 | startActivity(intent); 14 | finish(); 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /android/app/src/main/java/com/reactnativestarterapp/newarchitecture/MainApplicationReactNativeHost.java: -------------------------------------------------------------------------------- 1 | package com.reactnativestarterapp.newarchitecture; // make sure this is your package name 2 | 3 | import android.app.Application; 4 | import androidx.annotation.NonNull; 5 | import com.facebook.react.PackageList; 6 | import com.facebook.react.ReactInstanceManager; 7 | import com.facebook.react.ReactNativeHost; 8 | import com.facebook.react.ReactPackage; 9 | import com.facebook.react.ReactPackageTurboModuleManagerDelegate; 10 | import com.facebook.react.bridge.JSIModulePackage; 11 | import com.facebook.react.bridge.JSIModuleProvider; 12 | import com.facebook.react.bridge.JSIModuleSpec; 13 | import com.facebook.react.bridge.JSIModuleType; 14 | import com.facebook.react.bridge.JavaScriptContextHolder; 15 | import com.facebook.react.bridge.ReactApplicationContext; 16 | import com.facebook.react.bridge.UIManager; 17 | import com.facebook.react.fabric.ComponentFactory; 18 | import com.facebook.react.fabric.CoreComponentsRegistry; 19 | 20 | import com.facebook.react.fabric.FabricJSIModuleProvider; 21 | import com.facebook.react.fabric.ReactNativeConfig; 22 | import com.facebook.react.uimanager.ViewManagerRegistry; 23 | import com.reactnativestarterapp.BuildConfig; 24 | import com.reactnativestarterapp.newarchitecture.components.MainComponentsRegistry; 25 | import com.reactnativestarterapp.newarchitecture.modules.MainApplicationTurboModuleManagerDelegate; 26 | import java.util.ArrayList; 27 | import java.util.List; 28 | 29 | /** 30 | * A {@link ReactNativeHost} that helps you load everything needed for the New Architecture, both 31 | * TurboModule delegates and the Fabric Renderer. 32 | * 33 | *

Please note that this class is used ONLY if you opt-in for the New Architecture (see the 34 | * `newArchEnabled` property). Is ignored otherwise. 35 | */ 36 | public class MainApplicationReactNativeHost extends ReactNativeHost { 37 | public MainApplicationReactNativeHost(Application application) { 38 | super(application); 39 | } 40 | 41 | @Override 42 | public boolean getUseDeveloperSupport() { 43 | return BuildConfig.DEBUG; 44 | } 45 | 46 | @Override 47 | protected List getPackages() { 48 | List packages = new PackageList(this).getPackages(); 49 | // Packages that cannot be autolinked yet can be added manually here, for example: 50 | // packages.add(new MyReactNativePackage()); 51 | // TurboModules must also be loaded here providing a valid TurboReactPackage implementation: 52 | // packages.add(new TurboReactPackage() { ... }); 53 | // If you have custom Fabric Components, their ViewManagers should also be loaded here 54 | // inside a ReactPackage. 55 | return packages; 56 | } 57 | 58 | @Override 59 | protected String getJSMainModuleName() { 60 | return "index"; 61 | } 62 | 63 | @NonNull 64 | @Override 65 | protected ReactPackageTurboModuleManagerDelegate.Builder 66 | getReactPackageTurboModuleManagerDelegateBuilder() { 67 | // Here we provide the ReactPackageTurboModuleManagerDelegate Builder. This is necessary 68 | // for the new architecture and to use TurboModules correctly. 69 | return new MainApplicationTurboModuleManagerDelegate.Builder(); 70 | } 71 | 72 | @Override 73 | protected JSIModulePackage getJSIModulePackage() { 74 | return new JSIModulePackage() { 75 | @Override 76 | public List getJSIModules( 77 | final ReactApplicationContext reactApplicationContext, 78 | final JavaScriptContextHolder jsContext) { 79 | final List specs = new ArrayList<>(); 80 | 81 | // Here we provide a new JSIModuleSpec that will be responsible of providing the 82 | // custom Fabric Components. 83 | specs.add( 84 | new JSIModuleSpec() { 85 | @Override 86 | public JSIModuleType getJSIModuleType() { 87 | return JSIModuleType.UIManager; 88 | } 89 | 90 | @Override 91 | public JSIModuleProvider getJSIModuleProvider() { 92 | final ComponentFactory componentFactory = new ComponentFactory(); 93 | CoreComponentsRegistry.register(componentFactory); 94 | 95 | // Here we register a Components Registry. 96 | // The one that is generated with the template contains no components 97 | // and just provides you the one from React Native core. 98 | MainComponentsRegistry.register(componentFactory); 99 | 100 | final ReactInstanceManager reactInstanceManager = getReactInstanceManager(); 101 | 102 | ViewManagerRegistry viewManagerRegistry = 103 | new ViewManagerRegistry( 104 | reactInstanceManager.getOrCreateViewManagers(reactApplicationContext)); 105 | 106 | return new FabricJSIModuleProvider( 107 | reactApplicationContext, 108 | componentFactory, 109 | ReactNativeConfig.DEFAULT_CONFIG, 110 | viewManagerRegistry); 111 | } 112 | }); 113 | return specs; 114 | } 115 | }; 116 | } 117 | } 118 | -------------------------------------------------------------------------------- /android/app/src/main/java/com/reactnativestarterapp/newarchitecture/components/MainComponentsRegistry.java: -------------------------------------------------------------------------------- 1 | package com.reactnativestarterapp.newarchitecture.components; // make sure this is your package name 2 | 3 | import com.facebook.jni.HybridData; 4 | import com.facebook.proguard.annotations.DoNotStrip; 5 | import com.facebook.react.fabric.ComponentFactory; 6 | import com.facebook.soloader.SoLoader; 7 | 8 | /** 9 | * Class responsible to load the custom Fabric Components. This class has native methods and needs a 10 | * corresponding C++ implementation/header file to work correctly (already placed inside the jni/ 11 | * folder for you). 12 | * 13 | *

Please note that this class is used ONLY if you opt-in for the New Architecture (see the 14 | * `newArchEnabled` property). Is ignored otherwise. 15 | */ 16 | @DoNotStrip 17 | public class MainComponentsRegistry { 18 | static { 19 | SoLoader.loadLibrary("fabricjni"); 20 | } 21 | 22 | @DoNotStrip private final HybridData mHybridData; 23 | 24 | @DoNotStrip 25 | private native HybridData initHybrid(ComponentFactory componentFactory); 26 | 27 | @DoNotStrip 28 | private MainComponentsRegistry(ComponentFactory componentFactory) { 29 | mHybridData = initHybrid(componentFactory); 30 | } 31 | 32 | @DoNotStrip 33 | public static MainComponentsRegistry register(ComponentFactory componentFactory) { 34 | return new MainComponentsRegistry(componentFactory); 35 | } 36 | } 37 | -------------------------------------------------------------------------------- /android/app/src/main/java/com/reactnativestarterapp/newarchitecture/modules/MainApplicationTurboModuleManagerDelegate.java: -------------------------------------------------------------------------------- 1 | package com.reactnativestarterapp.newarchitecture.modules; // make sure this is your package name 2 | 3 | import com.facebook.jni.HybridData; 4 | import com.facebook.react.ReactPackage; 5 | import com.facebook.react.ReactPackageTurboModuleManagerDelegate; 6 | import com.facebook.react.bridge.ReactApplicationContext; 7 | import com.facebook.soloader.SoLoader; 8 | import java.util.List; 9 | 10 | /** 11 | * Class responsible to load the TurboModules. This class has native methods and needs a 12 | * corresponding C++ implementation/header file to work correctly (already placed inside the jni/ 13 | * folder for you). 14 | * 15 | *

Please note that this class is used ONLY if you opt-in for the New Architecture (see the 16 | * `newArchEnabled` property). Is ignored otherwise. 17 | */ 18 | public class MainApplicationTurboModuleManagerDelegate 19 | extends ReactPackageTurboModuleManagerDelegate { 20 | 21 | private static volatile boolean sIsSoLibraryLoaded; 22 | 23 | protected MainApplicationTurboModuleManagerDelegate( 24 | ReactApplicationContext reactApplicationContext, List packages) { 25 | super(reactApplicationContext, packages); 26 | } 27 | 28 | protected native HybridData initHybrid(); 29 | 30 | native boolean canCreateTurboModule(String moduleName); 31 | 32 | public static class Builder extends ReactPackageTurboModuleManagerDelegate.Builder { 33 | protected MainApplicationTurboModuleManagerDelegate build( 34 | ReactApplicationContext context, List packages) { 35 | return new MainApplicationTurboModuleManagerDelegate(context, packages); 36 | } 37 | } 38 | 39 | @Override 40 | protected synchronized void maybeLoadOtherSoLibraries() { 41 | if (!sIsSoLibraryLoaded) { 42 | // If you change the name of your application .so file in the Android.mk file, 43 | // make sure you update the name here as well. 44 | SoLoader.loadLibrary("reactnativestarterapp_appmodules"); 45 | sIsSoLibraryLoaded = true; 46 | } 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /android/app/src/main/jni/Android.mk: -------------------------------------------------------------------------------- 1 | THIS_DIR := $(call my-dir) 2 | 3 | include $(REACT_ANDROID_DIR)/Android-prebuilt.mk 4 | 5 | # If you wish to add a custom TurboModule or Fabric component in your app you 6 | # will have to include the following autogenerated makefile. 7 | # include $(GENERATED_SRC_DIR)/codegen/jni/Android.mk 8 | include $(CLEAR_VARS) 9 | 10 | LOCAL_PATH := $(THIS_DIR) 11 | 12 | # You can customize the name of your application .so file here. 13 | LOCAL_MODULE := reactnativestarterapp_appmodules 14 | 15 | LOCAL_C_INCLUDES := $(LOCAL_PATH) 16 | LOCAL_SRC_FILES := $(wildcard $(LOCAL_PATH)/*.cpp) 17 | LOCAL_EXPORT_C_INCLUDES := $(LOCAL_PATH) 18 | 19 | # If you wish to add a custom TurboModule or Fabric component in your app you 20 | # will have to uncomment those lines to include the generated source 21 | # files from the codegen (placed in $(GENERATED_SRC_DIR)/codegen/jni) 22 | # 23 | # LOCAL_C_INCLUDES += $(GENERATED_SRC_DIR)/codegen/jni 24 | # LOCAL_SRC_FILES += $(wildcard $(GENERATED_SRC_DIR)/codegen/jni/*.cpp) 25 | # LOCAL_EXPORT_C_INCLUDES += $(GENERATED_SRC_DIR)/codegen/jni 26 | 27 | # Here you should add any native library you wish to depend on. 28 | LOCAL_SHARED_LIBRARIES := \ 29 | libfabricjni \ 30 | libfbjni \ 31 | libfolly_runtime \ 32 | libglog \ 33 | libjsi \ 34 | libreact_codegen_rncore \ 35 | libreact_debug \ 36 | libreact_nativemodule_core \ 37 | libreact_render_componentregistry \ 38 | libreact_render_core \ 39 | libreact_render_debug \ 40 | libreact_render_graphics \ 41 | librrc_view \ 42 | libruntimeexecutor \ 43 | libturbomodulejsijni \ 44 | libyoga 45 | 46 | LOCAL_CFLAGS := -DLOG_TAG=\"ReactNative\" -fexceptions -frtti -std=c++17 -Wall 47 | 48 | include $(BUILD_SHARED_LIBRARY) 49 | -------------------------------------------------------------------------------- /android/app/src/main/jni/MainApplicationModuleProvider.cpp: -------------------------------------------------------------------------------- 1 | #include "MainApplicationModuleProvider.h" 2 | 3 | #include 4 | 5 | namespace facebook { 6 | namespace react { 7 | 8 | std::shared_ptr MainApplicationModuleProvider( 9 | const std::string moduleName, 10 | const JavaTurboModule::InitParams ¶ms) { 11 | // Here you can provide your own module provider for TurboModules coming from 12 | // either your application or from external libraries. The approach to follow 13 | // is similar to the following (for a library called `samplelibrary`: 14 | // 15 | // auto module = samplelibrary_ModuleProvider(moduleName, params); 16 | // if (module != nullptr) { 17 | // return module; 18 | // } 19 | // return rncore_ModuleProvider(moduleName, params); 20 | return rncore_ModuleProvider(moduleName, params); 21 | } 22 | 23 | } // namespace react 24 | } // namespace facebook 25 | -------------------------------------------------------------------------------- /android/app/src/main/jni/MainApplicationModuleProvider.h: -------------------------------------------------------------------------------- 1 | #pragma once 2 | 3 | #include 4 | #include 5 | 6 | #include 7 | 8 | namespace facebook { 9 | namespace react { 10 | 11 | std::shared_ptr MainApplicationModuleProvider( 12 | const std::string moduleName, 13 | const JavaTurboModule::InitParams ¶ms); 14 | 15 | } // namespace react 16 | } // namespace facebook 17 | -------------------------------------------------------------------------------- /android/app/src/main/jni/MainApplicationTurboModuleManagerDelegate.cpp: -------------------------------------------------------------------------------- 1 | #include "MainApplicationTurboModuleManagerDelegate.h" 2 | #include "MainApplicationModuleProvider.h" 3 | 4 | namespace facebook { 5 | namespace react { 6 | 7 | jni::local_ref 8 | MainApplicationTurboModuleManagerDelegate::initHybrid( 9 | jni::alias_ref) { 10 | return makeCxxInstance(); 11 | } 12 | 13 | void MainApplicationTurboModuleManagerDelegate::registerNatives() { 14 | registerHybrid({ 15 | makeNativeMethod( 16 | "initHybrid", MainApplicationTurboModuleManagerDelegate::initHybrid), 17 | makeNativeMethod( 18 | "canCreateTurboModule", 19 | MainApplicationTurboModuleManagerDelegate::canCreateTurboModule), 20 | }); 21 | } 22 | 23 | std::shared_ptr 24 | MainApplicationTurboModuleManagerDelegate::getTurboModule( 25 | const std::string name, 26 | const std::shared_ptr jsInvoker) { 27 | // Not implemented yet: provide pure-C++ NativeModules here. 28 | return nullptr; 29 | } 30 | 31 | std::shared_ptr 32 | MainApplicationTurboModuleManagerDelegate::getTurboModule( 33 | const std::string name, 34 | const JavaTurboModule::InitParams ¶ms) { 35 | return MainApplicationModuleProvider(name, params); 36 | } 37 | 38 | bool MainApplicationTurboModuleManagerDelegate::canCreateTurboModule( 39 | std::string name) { 40 | return getTurboModule(name, nullptr) != nullptr || 41 | getTurboModule(name, {.moduleName = name}) != nullptr; 42 | } 43 | 44 | } // namespace react 45 | } // namespace facebook 46 | -------------------------------------------------------------------------------- /android/app/src/main/jni/MainApplicationTurboModuleManagerDelegate.h: -------------------------------------------------------------------------------- 1 | #include 2 | #include 3 | 4 | #include 5 | #include 6 | 7 | namespace facebook { 8 | namespace react { 9 | 10 | class MainApplicationTurboModuleManagerDelegate 11 | : public jni::HybridClass< 12 | MainApplicationTurboModuleManagerDelegate, 13 | TurboModuleManagerDelegate> { 14 | public: 15 | // Adapt it to the package you used for your Java class. 16 | static constexpr auto kJavaDescriptor = 17 | "Lcom/reactnativestarterapp/newarchitecture/modules/MainApplicationTurboModuleManagerDelegate;"; 18 | 19 | static jni::local_ref initHybrid(jni::alias_ref); 20 | 21 | static void registerNatives(); 22 | 23 | std::shared_ptr getTurboModule( 24 | const std::string name, 25 | const std::shared_ptr jsInvoker) override; 26 | std::shared_ptr getTurboModule( 27 | const std::string name, 28 | const JavaTurboModule::InitParams ¶ms) override; 29 | 30 | /** 31 | * Test-only method. Allows user to verify whether a TurboModule can be 32 | * created by instances of this class. 33 | */ 34 | bool canCreateTurboModule(std::string name); 35 | }; 36 | 37 | } // namespace react 38 | } // namespace facebook 39 | -------------------------------------------------------------------------------- /android/app/src/main/jni/MainComponentsRegistry.cpp: -------------------------------------------------------------------------------- 1 | #include "MainComponentsRegistry.h" 2 | 3 | #include 4 | #include 5 | #include 6 | #include 7 | 8 | namespace facebook { 9 | namespace react { 10 | 11 | MainComponentsRegistry::MainComponentsRegistry(ComponentFactory *delegate) {} 12 | 13 | std::shared_ptr 14 | MainComponentsRegistry::sharedProviderRegistry() { 15 | auto providerRegistry = CoreComponentsRegistry::sharedProviderRegistry(); 16 | 17 | // Custom Fabric Components go here. You can register custom 18 | // components coming from your App or from 3rd party libraries here. 19 | // 20 | // providerRegistry->add(concreteComponentDescriptorProvider< 21 | // AocViewerComponentDescriptor>()); 22 | return providerRegistry; 23 | } 24 | 25 | jni::local_ref 26 | MainComponentsRegistry::initHybrid( 27 | jni::alias_ref, 28 | ComponentFactory *delegate) { 29 | auto instance = makeCxxInstance(delegate); 30 | 31 | auto buildRegistryFunction = 32 | [](EventDispatcher::Weak const &eventDispatcher, 33 | ContextContainer::Shared const &contextContainer) 34 | -> ComponentDescriptorRegistry::Shared { 35 | auto registry = MainComponentsRegistry::sharedProviderRegistry() 36 | ->createComponentDescriptorRegistry( 37 | {eventDispatcher, contextContainer}); 38 | 39 | auto mutableRegistry = 40 | std::const_pointer_cast(registry); 41 | 42 | mutableRegistry->setFallbackComponentDescriptor( 43 | std::make_shared( 44 | ComponentDescriptorParameters{ 45 | eventDispatcher, contextContainer, nullptr})); 46 | 47 | return registry; 48 | }; 49 | 50 | delegate->buildRegistryFunction = buildRegistryFunction; 51 | return instance; 52 | } 53 | 54 | void MainComponentsRegistry::registerNatives() { 55 | registerHybrid({ 56 | makeNativeMethod("initHybrid", MainComponentsRegistry::initHybrid), 57 | }); 58 | } 59 | 60 | } // namespace react 61 | } // namespace facebook 62 | -------------------------------------------------------------------------------- /android/app/src/main/jni/MainComponentsRegistry.h: -------------------------------------------------------------------------------- 1 | #pragma once 2 | 3 | #include 4 | #include 5 | #include 6 | #include 7 | 8 | namespace facebook { 9 | namespace react { 10 | 11 | class MainComponentsRegistry 12 | : public facebook::jni::HybridClass { 13 | public: 14 | // Adapt it to the package you used for your Java class. 15 | constexpr static auto kJavaDescriptor = 16 | "Lcom/reactnativestarterapp/newarchitecture/components/MainComponentsRegistry;"; 17 | 18 | static void registerNatives(); 19 | 20 | MainComponentsRegistry(ComponentFactory *delegate); 21 | 22 | private: 23 | static std::shared_ptr 24 | sharedProviderRegistry(); 25 | 26 | static jni::local_ref initHybrid( 27 | jni::alias_ref, 28 | ComponentFactory *delegate); 29 | }; 30 | 31 | } // namespace react 32 | } // namespace facebook 33 | -------------------------------------------------------------------------------- /android/app/src/main/jni/OnLoad.cpp: -------------------------------------------------------------------------------- 1 | #include 2 | #include "MainApplicationTurboModuleManagerDelegate.h" 3 | #include "MainComponentsRegistry.h" 4 | 5 | JNIEXPORT jint JNICALL JNI_OnLoad(JavaVM *vm, void *) { 6 | return facebook::jni::initialize(vm, [] { 7 | facebook::react::MainApplicationTurboModuleManagerDelegate:: 8 | registerNatives(); 9 | facebook::react::MainComponentsRegistry::registerNatives(); 10 | }); 11 | } -------------------------------------------------------------------------------- /android/app/src/main/res/drawable/rn_edit_text_material.xml: -------------------------------------------------------------------------------- 1 | 2 | 13 | 18 | 19 | 26 | 27 | 28 | 29 | -------------------------------------------------------------------------------- /android/app/src/main/res/layout/launch_screen.xml: -------------------------------------------------------------------------------- 1 | 2 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /android/app/src/main/res/values/colors.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | #000000 4 | #f2f2f222 5 | 6 | -------------------------------------------------------------------------------- /android/app/src/main/res/values/strings.xml: -------------------------------------------------------------------------------- 1 | 2 | ReactNativeStarterApp 3 | 4 | -------------------------------------------------------------------------------- /android/app/src/main/res/values/styles.xml: -------------------------------------------------------------------------------- 1 | 2 | 3 | 6 | 7 | 8 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /android/build.gradle: -------------------------------------------------------------------------------- 1 | import org.apache.tools.ant.taskdefs.condition.Os 2 | 3 | // Top-level build file where you can add configuration options common to all sub-projects/modules. 4 | 5 | buildscript { 6 | ext { 7 | buildToolsVersion = "31.0.0" 8 | minSdkVersion = 21 9 | compileSdkVersion = 31 10 | targetSdkVersion = 31 11 | //kotlinVersion = "1.5.20" 12 | 13 | if (System.properties['os.arch'] == "aarch64") { 14 | // For M1 Users we need to use the NDK 24 which added support for aarch64 15 | ndkVersion = "24.0.8215888" 16 | } else { 17 | // Otherwise we default to the side-by-side NDK version from AGP. 18 | ndkVersion = "21.4.7075529" 19 | } 20 | } 21 | repositories { 22 | google() 23 | mavenCentral() 24 | } 25 | dependencies { 26 | classpath("com.android.tools.build:gradle:7.1.1") 27 | classpath("com.facebook.react:react-native-gradle-plugin") 28 | classpath("de.undercouch:gradle-download-task:5.0.1") 29 | // NOTE: Do not place your application dependencies here; they belong 30 | // in the individual module build.gradle files 31 | } 32 | } 33 | 34 | allprojects { 35 | repositories { 36 | //mavenCentral() 37 | //mavenLocal() 38 | maven { 39 | // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm 40 | url("$rootDir/../node_modules/react-native/android") 41 | } 42 | maven { 43 | // Android JSC is installed from npm 44 | url("$rootDir/../node_modules/jsc-android/dist") 45 | } 46 | mavenCentral { 47 | // We don't want to fetch react-native from Maven Central as there are 48 | // older versions over there. 49 | content { 50 | excludeGroup "com.facebook.react" 51 | } 52 | } 53 | google() 54 | maven { url 'https://www.jitpack.io' } 55 | } 56 | } 57 | -------------------------------------------------------------------------------- /android/gradle.properties: -------------------------------------------------------------------------------- 1 | # Project-wide Gradle settings. 2 | 3 | # IDE (e.g. Android Studio) users: 4 | # Gradle settings configured through the IDE *will override* 5 | # any settings specified in this file. 6 | 7 | # For more details on how to configure your build environment visit 8 | # http://www.gradle.org/docs/current/userguide/build_environment.html 9 | 10 | # Specifies the JVM arguments used for the daemon process. 11 | # The setting is particularly useful for tweaking memory settings. 12 | # Default value: -Xmx512m -XX:MaxMetaspaceSize=256m 13 | org.gradle.jvmargs=-Xmx2048m -XX:MaxMetaspaceSize=512m 14 | 15 | # When configured, Gradle will run in incubating parallel mode. 16 | # This option should only be used with decoupled projects. More details, visit 17 | # http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects 18 | # org.gradle.parallel=true 19 | 20 | # AndroidX package structure to make it clearer which packages are bundled with the 21 | # Android operating system, and which are packaged with your app's APK 22 | # https://developer.android.com/topic/libraries/support-library/androidx-rn 23 | android.useAndroidX=true 24 | # Automatically convert third-party libraries to use AndroidX 25 | android.enableJetifier=true 26 | 27 | # Version of flipper SDK to use with React Native 28 | FLIPPER_VERSION=0.125.0 29 | 30 | # Use this property to specify which architecture you want to build. 31 | # You can also override it from the CLI using 32 | # ./gradlew -PreactNativeArchitectures=x86_64 33 | reactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64 34 | 35 | # Use this property to enable support to the new architecture. 36 | # This will allow you to use TurboModules and the Fabric render in 37 | # your application. You should enable this flag either if you want 38 | # to write custom TurboModules/Fabric components OR use libraries that 39 | # are providing them. 40 | newArchEnabled=false 41 | 42 | org.gradle.jvmargs=-Xmx4608m -------------------------------------------------------------------------------- /android/gradle/wrapper/gradle-wrapper.jar: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/android/gradle/wrapper/gradle-wrapper.jar -------------------------------------------------------------------------------- /android/gradle/wrapper/gradle-wrapper.properties: -------------------------------------------------------------------------------- 1 | distributionBase=GRADLE_USER_HOME 2 | distributionPath=wrapper/dists 3 | distributionUrl=https\://services.gradle.org/distributions/gradle-7.3.3-all.zip 4 | zipStoreBase=GRADLE_USER_HOME 5 | zipStorePath=wrapper/dists 6 | -------------------------------------------------------------------------------- /android/gradlew: -------------------------------------------------------------------------------- 1 | #!/bin/sh 2 | 3 | # 4 | # Copyright © 2015-2021 the original authors. 5 | # 6 | # Licensed under the Apache License, Version 2.0 (the "License"); 7 | # you may not use this file except in compliance with the License. 8 | # You may obtain a copy of the License at 9 | # 10 | # https://www.apache.org/licenses/LICENSE-2.0 11 | # 12 | # Unless required by applicable law or agreed to in writing, software 13 | # distributed under the License is distributed on an "AS IS" BASIS, 14 | # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 15 | # See the License for the specific language governing permissions and 16 | # limitations under the License. 17 | # 18 | 19 | ############################################################################## 20 | # 21 | # Gradle start up script for POSIX generated by Gradle. 22 | # 23 | # Important for running: 24 | # 25 | # (1) You need a POSIX-compliant shell to run this script. If your /bin/sh is 26 | # noncompliant, but you have some other compliant shell such as ksh or 27 | # bash, then to run this script, type that shell name before the whole 28 | # command line, like: 29 | # 30 | # ksh Gradle 31 | # 32 | # Busybox and similar reduced shells will NOT work, because this script 33 | # requires all of these POSIX shell features: 34 | # * functions; 35 | # * expansions «$var», «${var}», «${var:-default}», «${var+SET}», 36 | # «${var#prefix}», «${var%suffix}», and «$( cmd )»; 37 | # * compound commands having a testable exit status, especially «case»; 38 | # * various built-in commands including «command», «set», and «ulimit». 39 | # 40 | # Important for patching: 41 | # 42 | # (2) This script targets any POSIX shell, so it avoids extensions provided 43 | # by Bash, Ksh, etc; in particular arrays are avoided. 44 | # 45 | # The "traditional" practice of packing multiple parameters into a 46 | # space-separated string is a well documented source of bugs and security 47 | # problems, so this is (mostly) avoided, by progressively accumulating 48 | # options in "$@", and eventually passing that to Java. 49 | # 50 | # Where the inherited environment variables (DEFAULT_JVM_OPTS, JAVA_OPTS, 51 | # and GRADLE_OPTS) rely on word-splitting, this is performed explicitly; 52 | # see the in-line comments for details. 53 | # 54 | # There are tweaks for specific operating systems such as AIX, CygWin, 55 | # Darwin, MinGW, and NonStop. 56 | # 57 | # (3) This script is generated from the Groovy template 58 | # https://github.com/gradle/gradle/blob/master/subprojects/plugins/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt 59 | # within the Gradle project. 60 | # 61 | # You can find Gradle at https://github.com/gradle/gradle/. 62 | # 63 | ############################################################################## 64 | 65 | # Attempt to set APP_HOME 66 | 67 | # Resolve links: $0 may be a link 68 | app_path=$0 69 | 70 | # Need this for daisy-chained symlinks. 71 | while 72 | APP_HOME=${app_path%"${app_path##*/}"} # leaves a trailing /; empty if no leading path 73 | [ -h "$app_path" ] 74 | do 75 | ls=$( ls -ld "$app_path" ) 76 | link=${ls#*' -> '} 77 | case $link in #( 78 | /*) app_path=$link ;; #( 79 | *) app_path=$APP_HOME$link ;; 80 | esac 81 | done 82 | 83 | APP_HOME=$( cd "${APP_HOME:-./}" && pwd -P ) || exit 84 | 85 | APP_NAME="Gradle" 86 | APP_BASE_NAME=${0##*/} 87 | 88 | # Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script. 89 | DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"' 90 | 91 | # Use the maximum available, or set MAX_FD != -1 to use that value. 92 | MAX_FD=maximum 93 | 94 | warn () { 95 | echo "$*" 96 | } >&2 97 | 98 | die () { 99 | echo 100 | echo "$*" 101 | echo 102 | exit 1 103 | } >&2 104 | 105 | # OS specific support (must be 'true' or 'false'). 106 | cygwin=false 107 | msys=false 108 | darwin=false 109 | nonstop=false 110 | case "$( uname )" in #( 111 | CYGWIN* ) cygwin=true ;; #( 112 | Darwin* ) darwin=true ;; #( 113 | MSYS* | MINGW* ) msys=true ;; #( 114 | NONSTOP* ) nonstop=true ;; 115 | esac 116 | 117 | CLASSPATH=$APP_HOME/gradle/wrapper/gradle-wrapper.jar 118 | 119 | 120 | # Determine the Java command to use to start the JVM. 121 | if [ -n "$JAVA_HOME" ] ; then 122 | if [ -x "$JAVA_HOME/jre/sh/java" ] ; then 123 | # IBM's JDK on AIX uses strange locations for the executables 124 | JAVACMD=$JAVA_HOME/jre/sh/java 125 | else 126 | JAVACMD=$JAVA_HOME/bin/java 127 | fi 128 | if [ ! -x "$JAVACMD" ] ; then 129 | die "ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME 130 | 131 | Please set the JAVA_HOME variable in your environment to match the 132 | location of your Java installation." 133 | fi 134 | else 135 | JAVACMD=java 136 | which java >/dev/null 2>&1 || die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. 137 | 138 | Please set the JAVA_HOME variable in your environment to match the 139 | location of your Java installation." 140 | fi 141 | 142 | # Increase the maximum file descriptors if we can. 143 | if ! "$cygwin" && ! "$darwin" && ! "$nonstop" ; then 144 | case $MAX_FD in #( 145 | max*) 146 | MAX_FD=$( ulimit -H -n ) || 147 | warn "Could not query maximum file descriptor limit" 148 | esac 149 | case $MAX_FD in #( 150 | '' | soft) :;; #( 151 | *) 152 | ulimit -n "$MAX_FD" || 153 | warn "Could not set maximum file descriptor limit to $MAX_FD" 154 | esac 155 | fi 156 | 157 | # Collect all arguments for the java command, stacking in reverse order: 158 | # * args from the command line 159 | # * the main class name 160 | # * -classpath 161 | # * -D...appname settings 162 | # * --module-path (only if needed) 163 | # * DEFAULT_JVM_OPTS, JAVA_OPTS, and GRADLE_OPTS environment variables. 164 | 165 | # For Cygwin or MSYS, switch paths to Windows format before running java 166 | if "$cygwin" || "$msys" ; then 167 | APP_HOME=$( cygpath --path --mixed "$APP_HOME" ) 168 | CLASSPATH=$( cygpath --path --mixed "$CLASSPATH" ) 169 | 170 | JAVACMD=$( cygpath --unix "$JAVACMD" ) 171 | 172 | # Now convert the arguments - kludge to limit ourselves to /bin/sh 173 | for arg do 174 | if 175 | case $arg in #( 176 | -*) false ;; # don't mess with options #( 177 | /?*) t=${arg#/} t=/${t%%/*} # looks like a POSIX filepath 178 | [ -e "$t" ] ;; #( 179 | *) false ;; 180 | esac 181 | then 182 | arg=$( cygpath --path --ignore --mixed "$arg" ) 183 | fi 184 | # Roll the args list around exactly as many times as the number of 185 | # args, so each arg winds up back in the position where it started, but 186 | # possibly modified. 187 | # 188 | # NB: a `for` loop captures its iteration list before it begins, so 189 | # changing the positional parameters here affects neither the number of 190 | # iterations, nor the values presented in `arg`. 191 | shift # remove old arg 192 | set -- "$@" "$arg" # push replacement arg 193 | done 194 | fi 195 | 196 | # Collect all arguments for the java command; 197 | # * $DEFAULT_JVM_OPTS, $JAVA_OPTS, and $GRADLE_OPTS can contain fragments of 198 | # shell script including quotes and variable substitutions, so put them in 199 | # double quotes to make sure that they get re-expanded; and 200 | # * put everything else in single quotes, so that it's not re-expanded. 201 | 202 | set -- \ 203 | "-Dorg.gradle.appname=$APP_BASE_NAME" \ 204 | -classpath "$CLASSPATH" \ 205 | org.gradle.wrapper.GradleWrapperMain \ 206 | "$@" 207 | 208 | # Use "xargs" to parse quoted args. 209 | # 210 | # With -n1 it outputs one arg per line, with the quotes and backslashes removed. 211 | # 212 | # In Bash we could simply go: 213 | # 214 | # readarray ARGS < <( xargs -n1 <<<"$var" ) && 215 | # set -- "${ARGS[@]}" "$@" 216 | # 217 | # but POSIX shell has neither arrays nor command substitution, so instead we 218 | # post-process each arg (as a line of input to sed) to backslash-escape any 219 | # character that might be a shell metacharacter, then use eval to reverse 220 | # that process (while maintaining the separation between arguments), and wrap 221 | # the whole thing up as a single "set" statement. 222 | # 223 | # This will of course break if any of these variables contains a newline or 224 | # an unmatched quote. 225 | # 226 | 227 | eval "set -- $( 228 | printf '%s\n' "$DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS" | 229 | xargs -n1 | 230 | sed ' s~[^-[:alnum:]+,./:=@_]~\\&~g; ' | 231 | tr '\n' ' ' 232 | )" '"$@"' 233 | 234 | exec "$JAVACMD" "$@" -------------------------------------------------------------------------------- /android/gradlew.bat: -------------------------------------------------------------------------------- 1 | @rem 2 | @rem Copyright 2015 the original author or authors. 3 | @rem 4 | @rem Licensed under the Apache License, Version 2.0 (the "License"); 5 | @rem you may not use this file except in compliance with the License. 6 | @rem You may obtain a copy of the License at 7 | @rem 8 | @rem https://www.apache.org/licenses/LICENSE-2.0 9 | @rem 10 | @rem Unless required by applicable law or agreed to in writing, software 11 | @rem distributed under the License is distributed on an "AS IS" BASIS, 12 | @rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 13 | @rem See the License for the specific language governing permissions and 14 | @rem limitations under the License. 15 | @rem 16 | 17 | @if "%DEBUG%" == "" @echo off 18 | @rem ########################################################################## 19 | @rem 20 | @rem Gradle startup script for Windows 21 | @rem 22 | @rem ########################################################################## 23 | 24 | @rem Set local scope for the variables with windows NT shell 25 | if "%OS%"=="Windows_NT" setlocal 26 | 27 | set DIRNAME=%~dp0 28 | if "%DIRNAME%" == "" set DIRNAME=. 29 | set APP_BASE_NAME=%~n0 30 | set APP_HOME=%DIRNAME% 31 | 32 | @rem Resolve any "." and ".." in APP_HOME to make it shorter. 33 | for %%i in ("%APP_HOME%") do set APP_HOME=%%~fi 34 | 35 | @rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script. 36 | set DEFAULT_JVM_OPTS="-Xmx64m" "-Xms64m" 37 | 38 | @rem Find java.exe 39 | if defined JAVA_HOME goto findJavaFromJavaHome 40 | 41 | set JAVA_EXE=java.exe 42 | %JAVA_EXE% -version >NUL 2>&1 43 | if "%ERRORLEVEL%" == "0" goto execute 44 | 45 | echo. 46 | echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. 47 | echo. 48 | echo Please set the JAVA_HOME variable in your environment to match the 49 | echo location of your Java installation. 50 | 51 | goto fail 52 | 53 | :findJavaFromJavaHome 54 | set JAVA_HOME=%JAVA_HOME:"=% 55 | set JAVA_EXE=%JAVA_HOME%/bin/java.exe 56 | 57 | if exist "%JAVA_EXE%" goto execute 58 | 59 | echo. 60 | echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME% 61 | echo. 62 | echo Please set the JAVA_HOME variable in your environment to match the 63 | echo location of your Java installation. 64 | 65 | goto fail 66 | 67 | :execute 68 | @rem Setup the command line 69 | 70 | set CLASSPATH=%APP_HOME%\gradle\wrapper\gradle-wrapper.jar 71 | 72 | @rem Execute Gradle 73 | "%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -classpath "%CLASSPATH%" org.gradle.wrapper.GradleWrapperMain %* 74 | 75 | :end 76 | @rem End local scope for the variables with windows NT shell 77 | if "%ERRORLEVEL%"=="0" goto mainEnd 78 | 79 | :fail 80 | rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of 81 | rem the _cmd.exe /c_ return code! 82 | if not "" == "%GRADLE_EXIT_CONSOLE%" exit 1 83 | exit /b 1 84 | 85 | :mainEnd 86 | if "%OS%"=="Windows_NT" endlocal 87 | 88 | :omega 89 | -------------------------------------------------------------------------------- /android/settings.gradle: -------------------------------------------------------------------------------- 1 | rootProject.name = 'ReactNativeStarterApp' 2 | 3 | include ':react-native-splash-screen' 4 | project(':react-native-splash-screen').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-splash-screen/android') 5 | 6 | apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings) 7 | include ':app' 8 | includeBuild('../node_modules/react-native-gradle-plugin') 9 | 10 | if (settings.hasProperty("newArchEnabled") && settings.newArchEnabled == "true") { 11 | include(":ReactAndroid") 12 | project(":ReactAndroid").projectDir = file('../node_modules/react-native/ReactAndroid') 13 | include(":ReactAndroid:hermes-engine") 14 | project(":ReactAndroid:hermes-engine").projectDir = file('../node_modules/react-native/ReactAndroid/hermes-engine') 15 | } -------------------------------------------------------------------------------- /app.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "ReactNativeStarterApp", 3 | "displayName": "ReactNativeStarterApp", 4 | "environments": { 5 | "development": { 6 | "API_URL": "https://reqres.in/api", 7 | "ENV": "development" 8 | }, 9 | "staging": { 10 | "API_URL": "https://reqres.in/api", 11 | "ENV": "staging" 12 | }, 13 | "production": { 14 | "API_URL": "https://reqres.in/api", 15 | "ENV": "production" 16 | } 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /assets/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/assets/icon.png -------------------------------------------------------------------------------- /assets/splashscreen.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/assets/splashscreen.png -------------------------------------------------------------------------------- /babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: ['module:metro-react-native-babel-preset'], 3 | plugins: [ 4 | [ 5 | 'module-resolver', 6 | { 7 | extensions: ['.ios.js', '.android.js', '.ios.jsx', '.android.jsx', '.js', '.jsx', '.json', '.ts', '.tsx'], 8 | root: ['.'], 9 | alias: { 10 | '@api': './src/api', 11 | '@assets': './src/assets', 12 | '@components': './src/components', 13 | '@hooks': './src/hooks', 14 | '@i18n': './src/i18n', 15 | '@routes': './src/routes', 16 | '@scenes': './src/scenes', 17 | '@theme': './src/theme', 18 | '@utils': './src/utils', 19 | '@env': './src/env.js', 20 | }, 21 | }, 22 | ], 23 | 'react-native-reanimated/plugin', 24 | ], 25 | }; 26 | -------------------------------------------------------------------------------- /index.js: -------------------------------------------------------------------------------- 1 | /** 2 | * @format 3 | */ 4 | import { AppRegistry, LogBox } from 'react-native'; 5 | import { name as appName } from './app.json'; 6 | import App from './src/App'; 7 | 8 | // Remove YellowBox on Debug application screen 9 | LogBox.ignoreAllLogs(true); 10 | AppRegistry.registerComponent(appName, () => App); 11 | -------------------------------------------------------------------------------- /ios/.xcode.env: -------------------------------------------------------------------------------- 1 | 2 | # This `.xcode.env` file is versioned and is used to source the environment 3 | # used when running script phases inside Xcode. 4 | # To customize your local environment, you can create an `.xcode.env.local` 5 | # file that is not versioned. 6 | # NODE_BINARY variable contains the PATH to the node executable. 7 | # 8 | # Customize the NODE_BINARY variable here. 9 | # For example, to use nvm with brew, add the following line 10 | # . "$(brew --prefix nvm)/nvm.sh" --no-use 11 | export NODE_BINARY=$(command -v node) -------------------------------------------------------------------------------- /ios/LaunchScreen.storyboard: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | -------------------------------------------------------------------------------- /ios/Podfile: -------------------------------------------------------------------------------- 1 | require_relative '../node_modules/react-native/scripts/react_native_pods' 2 | require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules' 3 | 4 | platform :ios, '12.4' 5 | install! 'cocoapods', :deterministic_uuids => false 6 | 7 | production = ENV["PRODUCTION"] == "1" 8 | 9 | target 'ReactNativeStarterApp' do 10 | config = use_native_modules! 11 | 12 | # Flags change depending on the env values. 13 | flags = get_default_flags() 14 | 15 | use_react_native!( 16 | :path => config[:reactNativePath], 17 | # to enable hermes on iOS, change `false` to `true` and then install pods 18 | :production => production, 19 | :hermes_enabled => flags[:hermes_enabled], 20 | :fabric_enabled => flags[:fabric_enabled], 21 | :flipper_configuration => FlipperConfiguration.enabled, 22 | # An absolute path to your application root. 23 | :app_path => "#{Pod::Config.instance.installation_root}/.." 24 | ) 25 | 26 | pod 'react-native-splash-screen', :path => '../node_modules/react-native-splash-screen' 27 | pod 'RNVectorIcons', :path => '../node_modules/react-native-vector-icons' 28 | 29 | target 'ReactNativeStarterAppTests' do 30 | inherit! :complete 31 | # Pods for testing 32 | end 33 | 34 | post_install do |installer| 35 | react_native_post_install(installer) 36 | __apply_Xcode_12_5_M1_post_install_workaround(installer) 37 | end 38 | end -------------------------------------------------------------------------------- /ios/ReactNativeStarterApp.xcodeproj/xcshareddata/xcschemes/ReactNativeStarterApp.xcscheme: -------------------------------------------------------------------------------- 1 | 2 | 5 | 8 | 9 | 15 | 21 | 22 | 23 | 24 | 25 | 30 | 31 | 33 | 39 | 40 | 41 | 42 | 43 | 53 | 55 | 61 | 62 | 63 | 64 | 70 | 72 | 78 | 79 | 80 | 81 | 83 | 84 | 87 | 88 | 89 | -------------------------------------------------------------------------------- /ios/ReactNativeStarterApp.xcworkspace/contents.xcworkspacedata: -------------------------------------------------------------------------------- 1 | 2 | 4 | 6 | 7 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /ios/ReactNativeStarterApp.xcworkspace/xcshareddata/IDEWorkspaceChecks.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | IDEDidComputeMac32BitWarning 6 | 7 | 8 | 9 | -------------------------------------------------------------------------------- /ios/ReactNativeStarterApp/AppDelegate.h: -------------------------------------------------------------------------------- 1 | #import 2 | #import 3 | 4 | @interface AppDelegate : UIResponder 5 | 6 | @property (nonatomic, strong) UIWindow *window; 7 | 8 | @end 9 | -------------------------------------------------------------------------------- /ios/ReactNativeStarterApp/AppDelegate.mm: -------------------------------------------------------------------------------- 1 | #import "AppDelegate.h" 2 | 3 | #import 4 | #import 5 | #import 6 | #import 7 | 8 | #import "RNSplashScreen.h" 9 | 10 | #if RCT_NEW_ARCH_ENABLED 11 | #import 12 | #import 13 | #import 14 | #import 15 | #import 16 | #import 17 | #import 18 | 19 | static NSString *const kRNConcurrentRoot = @"concurrentRoot"; 20 | 21 | @interface AppDelegate () { 22 | RCTTurboModuleManager *_turboModuleManager; 23 | RCTSurfacePresenterBridgeAdapter *_bridgeAdapter; 24 | std::shared_ptr _reactNativeConfig; 25 | facebook::react::ContextContainer::Shared _contextContainer; 26 | } 27 | @end 28 | #endif 29 | 30 | @implementation AppDelegate 31 | - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions 32 | { 33 | RCTAppSetupPrepareApp(application); 34 | RCTBridge *bridge = [[RCTBridge alloc] initWithDelegate:self launchOptions:launchOptions]; 35 | 36 | #if RCT_NEW_ARCH_ENABLED 37 | _contextContainer = std::make_shared(); 38 | _reactNativeConfig = std::make_shared(); 39 | _contextContainer->insert("ReactNativeConfig", _reactNativeConfig); 40 | _bridgeAdapter = [[RCTSurfacePresenterBridgeAdapter alloc] initWithBridge:bridge contextContainer:_contextContainer]; 41 | bridge.surfacePresenter = _bridgeAdapter.surfacePresenter; 42 | #endif 43 | 44 | NSDictionary *initProps = [self prepareInitialProps]; 45 | UIView *rootView = RCTAppSetupDefaultRootView(bridge, @"ReactNativeStarterApp", initProps); 46 | 47 | if (@available(iOS 13.0, *)) { 48 | rootView.backgroundColor = [UIColor systemBackgroundColor]; 49 | } else { 50 | rootView.backgroundColor = [UIColor whiteColor]; 51 | } 52 | 53 | self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds]; 54 | UIViewController *rootViewController = [UIViewController new]; 55 | rootViewController.view = rootView; 56 | self.window.rootViewController = rootViewController; 57 | [self.window makeKeyAndVisible]; 58 | [RNSplashScreen show]; 59 | 60 | return YES; 61 | } 62 | 63 | /// This method controls whether the `concurrentRoot`feature of React18 is turned on or off. 64 | /// 65 | /// @see: https://reactjs.org/blog/2022/03/29/react-v18.html 66 | /// @note: This requires to be rendering on Fabric (i.e. on the New Architecture). 67 | /// @return: `true` if the `concurrentRoot` feture is enabled. Otherwise, it returns `false`. 68 | - (BOOL)concurrentRootEnabled 69 | { 70 | // Switch this bool to turn on and off the concurrent root 71 | return true; 72 | } 73 | - (NSDictionary *)prepareInitialProps 74 | { 75 | NSMutableDictionary *initProps = [NSMutableDictionary new]; 76 | #ifdef RCT_NEW_ARCH_ENABLED 77 | initProps[kRNConcurrentRoot] = @([self concurrentRootEnabled]); 78 | #endif 79 | return initProps; 80 | } 81 | 82 | 83 | - (NSURL *)sourceURLForBridge:(RCTBridge *)bridge 84 | { 85 | #if DEBUG 86 | return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index"]; 87 | #else 88 | return [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"]; 89 | #endif 90 | } 91 | 92 | #if RCT_NEW_ARCH_ENABLED 93 | #pragma mark - RCTCxxBridgeDelegate 94 | - (std::unique_ptr)jsExecutorFactoryForBridge:(RCTBridge *)bridge 95 | { 96 | _turboModuleManager = [[RCTTurboModuleManager alloc] initWithBridge:bridge 97 | delegate:self 98 | jsInvoker:bridge.jsCallInvoker]; 99 | return RCTAppSetupDefaultJsExecutorFactory(bridge, _turboModuleManager); 100 | } 101 | #pragma mark RCTTurboModuleManagerDelegate 102 | - (Class)getModuleClassFromName:(const char *)name 103 | { 104 | return RCTCoreModulesClassProvider(name); 105 | } 106 | - (std::shared_ptr)getTurboModule:(const std::string &)name 107 | jsInvoker:(std::shared_ptr)jsInvoker 108 | { 109 | return nullptr; 110 | } 111 | - (std::shared_ptr)getTurboModule:(const std::string &)name 112 | initParams: 113 | (const facebook::react::ObjCTurboModule::InitParams &)params 114 | { 115 | return nullptr; 116 | } 117 | - (id)getModuleInstanceFromClass:(Class)moduleClass 118 | { 119 | return RCTAppSetupDefaultModuleFromClass(moduleClass); 120 | } 121 | #endif 122 | @end 123 | -------------------------------------------------------------------------------- /ios/ReactNativeStarterApp/Base.lproj/LaunchScreen.xib: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | -------------------------------------------------------------------------------- /ios/ReactNativeStarterApp/Images.xcassets/Contents.json: -------------------------------------------------------------------------------- 1 | { 2 | "images" : [ 3 | { 4 | "idiom" : "iphone", 5 | "scale" : "2x", 6 | "size" : "20x20" 7 | }, 8 | { 9 | "idiom" : "iphone", 10 | "scale" : "3x", 11 | "size" : "20x20" 12 | }, 13 | { 14 | "idiom" : "iphone", 15 | "scale" : "2x", 16 | "size" : "29x29" 17 | }, 18 | { 19 | "idiom" : "iphone", 20 | "scale" : "3x", 21 | "size" : "29x29" 22 | }, 23 | { 24 | "idiom" : "iphone", 25 | "scale" : "2x", 26 | "size" : "40x40" 27 | }, 28 | { 29 | "idiom" : "iphone", 30 | "scale" : "3x", 31 | "size" : "40x40" 32 | }, 33 | { 34 | "idiom" : "iphone", 35 | "scale" : "2x", 36 | "size" : "60x60" 37 | }, 38 | { 39 | "idiom" : "iphone", 40 | "scale" : "3x", 41 | "size" : "60x60" 42 | }, 43 | { 44 | "idiom" : "ios-marketing", 45 | "scale" : "1x", 46 | "size" : "1024x1024" 47 | } 48 | ], 49 | "info" : { 50 | "author" : "xcode", 51 | "version" : 1 52 | } 53 | } -------------------------------------------------------------------------------- /ios/ReactNativeStarterApp/Info.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | CFBundleDevelopmentRegion 6 | en 7 | CFBundleDisplayName 8 | ReactNativeStarterApp 9 | CFBundleExecutable 10 | $(EXECUTABLE_NAME) 11 | CFBundleIdentifier 12 | $(PRODUCT_BUNDLE_IDENTIFIER) 13 | CFBundleInfoDictionaryVersion 14 | 6.0 15 | CFBundleName 16 | $(PRODUCT_NAME) 17 | CFBundlePackageType 18 | APPL 19 | CFBundleShortVersionString 20 | 1.0 21 | CFBundleSignature 22 | ???? 23 | CFBundleVersion 24 | 1 25 | LSRequiresIPhoneOS 26 | 27 | NSAppTransportSecurity 28 | 29 | NSExceptionDomains 30 | 31 | localhost 32 | 33 | NSExceptionAllowsInsecureHTTPLoads 34 | 35 | 36 | 37 | 38 | NSLocationWhenInUseUsageDescription 39 | 40 | UIAppFonts 41 | 42 | Lato-Black.ttf 43 | Lato-BlackItalic.ttf 44 | Lato-Bold.ttf 45 | Lato-BoldItalic.ttf 46 | Lato-Italic.ttf 47 | Lato-Light.ttf 48 | Lato-LightItalic.ttf 49 | Lato-Regular.ttf 50 | Lato-Thin.ttf 51 | Lato-ThinItalic.ttf 52 | Roboto_medium.ttf 53 | Roboto.ttf 54 | rubicon-icon-font.ttf 55 | AntDesign.ttf 56 | Entypo.ttf 57 | EvilIcons.ttf 58 | Feather.ttf 59 | FontAwesome.ttf 60 | FontAwesome5_Brands.ttf 61 | FontAwesome5_Regular.ttf 62 | FontAwesome5_Solid.ttf 63 | Fontisto.ttf 64 | Foundation.ttf 65 | Ionicons.ttf 66 | MaterialCommunityIcons.ttf 67 | MaterialIcons.ttf 68 | Octicons.ttf 69 | SimpleLineIcons.ttf 70 | Zocial.ttf 71 | 72 | UILaunchStoryboardName 73 | LaunchScreen 74 | UIRequiredDeviceCapabilities 75 | 76 | armv7 77 | 78 | UISupportedInterfaceOrientations 79 | 80 | UIInterfaceOrientationPortrait 81 | UIInterfaceOrientationPortraitUpsideDown 82 | 83 | UIViewControllerBasedStatusBarAppearance 84 | 85 | 86 | 87 | -------------------------------------------------------------------------------- /ios/ReactNativeStarterApp/LaunchScreen.storyboard: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 25 | 31 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | -------------------------------------------------------------------------------- /ios/ReactNativeStarterApp/main.m: -------------------------------------------------------------------------------- 1 | #import 2 | 3 | #import "AppDelegate.h" 4 | 5 | int main(int argc, char *argv[]) 6 | { 7 | @autoreleasepool { 8 | return UIApplicationMain(argc, argv, nil, NSStringFromClass([AppDelegate class])); 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /ios/ReactNativeStarterAppTests/Info.plist: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | CFBundleDevelopmentRegion 6 | en 7 | CFBundleExecutable 8 | $(EXECUTABLE_NAME) 9 | CFBundleIdentifier 10 | $(PRODUCT_BUNDLE_IDENTIFIER) 11 | CFBundleInfoDictionaryVersion 12 | 6.0 13 | CFBundleName 14 | $(PRODUCT_NAME) 15 | CFBundlePackageType 16 | BNDL 17 | CFBundleShortVersionString 18 | 1.0 19 | CFBundleSignature 20 | ???? 21 | CFBundleVersion 22 | 1 23 | 24 | 25 | -------------------------------------------------------------------------------- /ios/ReactNativeStarterAppTests/ReactNativeStarterAppTests.m: -------------------------------------------------------------------------------- 1 | /** 2 | * Copyright (c) Facebook, Inc. and its affiliates. 3 | * 4 | * This source code is licensed under the MIT license found in the 5 | * LICENSE file in the root directory of this source tree. 6 | */ 7 | 8 | #import 9 | #import 10 | 11 | #import 12 | #import 13 | 14 | #define TIMEOUT_SECONDS 600 15 | #define TEXT_TO_LOOK_FOR @"Welcome to React" 16 | 17 | @interface ReactNativeStarterAppTests : XCTestCase 18 | 19 | @end 20 | 21 | @implementation ReactNativeStarterAppTests 22 | 23 | - (BOOL)findSubviewInView:(UIView *)view matching:(BOOL(^)(UIView *view))test 24 | { 25 | if (test(view)) { 26 | return YES; 27 | } 28 | for (UIView *subview in [view subviews]) { 29 | if ([self findSubviewInView:subview matching:test]) { 30 | return YES; 31 | } 32 | } 33 | return NO; 34 | } 35 | 36 | - (void)testRendersWelcomeScreen 37 | { 38 | UIViewController *vc = [[[RCTSharedApplication() delegate] window] rootViewController]; 39 | NSDate *date = [NSDate dateWithTimeIntervalSinceNow:TIMEOUT_SECONDS]; 40 | BOOL foundElement = NO; 41 | 42 | __block NSString *redboxError = nil; 43 | #ifdef DEBUG 44 | RCTSetLogFunction(^(RCTLogLevel level, RCTLogSource source, NSString *fileName, NSNumber *lineNumber, NSString *message) { 45 | if (level >= RCTLogLevelError) { 46 | redboxError = message; 47 | } 48 | }); 49 | #endif 50 | 51 | while ([date timeIntervalSinceNow] > 0 && !foundElement && !redboxError) { 52 | [[NSRunLoop mainRunLoop] runMode:NSDefaultRunLoopMode beforeDate:[NSDate dateWithTimeIntervalSinceNow:0.1]]; 53 | [[NSRunLoop mainRunLoop] runMode:NSRunLoopCommonModes beforeDate:[NSDate dateWithTimeIntervalSinceNow:0.1]]; 54 | 55 | foundElement = [self findSubviewInView:vc.view matching:^BOOL(UIView *view) { 56 | if ([view.accessibilityLabel isEqualToString:TEXT_TO_LOOK_FOR]) { 57 | return YES; 58 | } 59 | return NO; 60 | }]; 61 | } 62 | 63 | #ifdef DEBUG 64 | RCTSetLogFunction(RCTDefaultLogFunction); 65 | #endif 66 | 67 | XCTAssertNil(redboxError, @"RedBox error: %@", redboxError); 68 | XCTAssertTrue(foundElement, @"Couldn't find element with text '%@' in %d seconds", TEXT_TO_LOOK_FOR, TIMEOUT_SECONDS); 69 | } 70 | 71 | 72 | @end 73 | -------------------------------------------------------------------------------- /jest.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | preset: 'react-native', 3 | moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'], 4 | }; 5 | -------------------------------------------------------------------------------- /metro.config.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Metro configuration for React Native 3 | * https://github.com/facebook/react-native 4 | * 5 | * @format 6 | */ 7 | 8 | module.exports = { 9 | transformer: { 10 | getTransformOptions: async () => ({ 11 | transform: { 12 | experimentalImportSupport: false, 13 | inlineRequires: true, 14 | }, 15 | }), 16 | }, 17 | }; 18 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react-native-starter-app", 3 | "version": "2.0.0", 4 | "private": true, 5 | "scripts": { 6 | "prepare": "run-p assets:* debugger:install", 7 | "start": "react-native start", 8 | "test": "jest", 9 | "lint": "eslint --fix \"./src/**/*.{js,jsx,ts,tsx}\"", 10 | "lint:staged": "pretty-quick --staged && lint-staged", 11 | "clean:android": "cd android && ./gradlew cleanBuildCache && ./gradlew clean && cd ..", 12 | "clean:ios": "rm -rf ios/build", 13 | "clean": "run-p clean:*", 14 | "assets": "npx react-native link", 15 | "assets:icons": "rn-toolbox icons", 16 | "assets:splashscreen": "rn-toolbox splash", 17 | "debugger:install": "yarn rndebugger-open", 18 | "env:dev": "node scripts/set-environment.js development", 19 | "env:stage": "node scripts/set-environment.js staging", 20 | "env:prod": "node scripts/set-environment.js production", 21 | "setup:ios": "cd ios && pod install --repo-update && cd ..", 22 | "_android": "cd android && ./gradlew clean && cd .. && react-native run-android", 23 | "android:dev": "run-s env:dev _android", 24 | "android:stage": "run-s env:stage _android", 25 | "android:prod": "run-s env:prod _android", 26 | "_ios": "react-native run-ios", 27 | "ios:dev": "run-s env:dev _ios", 28 | "ios:stage": "run-s env:stage _ios", 29 | "ios:prod": "run-s env:prod _ios", 30 | "android:bundle:create": "rm -rf android/app/build && react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res", 31 | "android:assemble:debug": "cd android && ./gradlew assembleDebug", 32 | "ios:bundle:create": "react-native bundle --entry-file index.js --platform ios --dev false --bundle-output ios/main.jsbundle --assets-dest ios", 33 | "ios:assemble:debug": "xcodebuild -quiet -workspace ios/ReactNativeStarterApp.xcworkspace -scheme ReactNativeStarterApp -configuration Release -sdk iphonesimulator -destination platform='iOS Simulator',OS=13.3,name='iPhone 11 Pro Max' CODE_SIGNING_REQUIRED=NO ONLY_ACTIVE_ARCH=NO", 34 | "build:dev:android": "run-s env:dev android:bundle:create android:assemble:debug", 35 | "build:dev:ios": "run-s env:dev setup:ios ios:assemble:debug", 36 | "pre-commit": "yarn lint-staged && yarn dependencies:checkCircular && yarn dependencies:graph", 37 | "prettier-check:staged": "prettier --check \"./src/**/*.{js,jsx,ts,tsx}\"", 38 | "prettier-format:staged": "prettier --write \"./src/**/*.{js,jsx,ts,tsx}\"", 39 | "dependencies:checkCircular": "madge src/ --circular", 40 | "dependencies:graph": "madge src/ --circular --image deps-graph.svg", 41 | "postinstall": "husky install" 42 | }, 43 | "dependencies": { 44 | "@react-native-async-storage/async-storage": "1.17.9", 45 | "@react-native-masked-view/masked-view": "0.2.7", 46 | "@react-navigation/native": "6.0.11", 47 | "@react-navigation/stack": "6.2.2", 48 | "@tanstack/react-query": "^4.2.1", 49 | "axios": "^0.27.2", 50 | "i18next": "21.9.1", 51 | "native-base": "3.4.13", 52 | "react": "18.2.0", 53 | "react-i18next": "11.18.4", 54 | "react-native": "0.69.4", 55 | "react-native-flipper": "0.159.0", 56 | "react-native-gesture-handler": "2.5.0", 57 | "react-native-indicators": "^0.17.0", 58 | "react-native-localize": "2.2.3", 59 | "react-native-reanimated": "^3.0.0-rc.0", 60 | "react-native-safe-area-context": "4.3.1", 61 | "react-native-screens": "^3.13.1", 62 | "react-native-splash-screen": "^3.3.0", 63 | "react-native-svg": "13.0.0", 64 | "react-native-vector-icons": "^9.1.0", 65 | "react-native-version-number": "^0.3.6" 66 | }, 67 | "devDependencies": { 68 | "@babel/core": "7.18.5", 69 | "@babel/preset-env": "7.18.2", 70 | "@babel/runtime": "7.18.3", 71 | "@forward-software/react-native-toolbox": "^3.0.0", 72 | "@react-native-community/eslint-config": "3.0.3", 73 | "@react-native-community/eslint-plugin": "1.2.0", 74 | "@trivago/prettier-plugin-sort-imports": "3.3.0", 75 | "@types/jest": "28.1.4", 76 | "@types/node": "18.0.3", 77 | "@types/react": "18.0.15", 78 | "@types/react-native": "0.69.5", 79 | "@types/react-native-indicators": "^0.16.2", 80 | "@types/react-native-vector-icons": "^6.4.10", 81 | "@types/react-test-renderer": "18.0.0", 82 | "@typescript-eslint/eslint-plugin": "5.30.5", 83 | "@typescript-eslint/parser": "5.30.5", 84 | "babel-jest": "28.1.1", 85 | "babel-plugin-module-resolver": "^4.1.0", 86 | "eslint": "8.19.0", 87 | "eslint-config-prettier": "^8.5.0", 88 | "eslint-plugin-jest": "^26.8.4", 89 | "eslint-plugin-prettier": "4.2.1", 90 | "eslint-plugin-react-hooks": "^4.6.0", 91 | "husky": "8.0.1", 92 | "jest": "28.1.1", 93 | "lint-staged": "13.0.3", 94 | "madge": "^5.0.1", 95 | "metro-react-native-babel-preset": "0.71.1", 96 | "npm-run-all": "^4.1.5", 97 | "prettier": "2.7.1", 98 | "pretty-quick": "^3.1.3", 99 | "react-native-debugger-open": "^0.3.25", 100 | "react-native-uuid": "^2.0.1", 101 | "react-test-renderer": "18.2.0", 102 | "shx": "^0.3.4", 103 | "ts-jest": "28.0.7", 104 | "typescript": "4.7.4" 105 | }, 106 | "jest": { 107 | "preset": "react-native" 108 | }, 109 | "lint-staged": { 110 | "src/**/*.{js,jsx,ts,tsx}": [ 111 | "eslint", 112 | "npm run prettier-format:staged", 113 | "npm run prettier-check:staged" 114 | ] 115 | }, 116 | "madge": { 117 | "tsConfig": "./tsconfig.json", 118 | "fileExtensions": "ts", 119 | "excludeRegExp": [ 120 | ".*\\.test\\.ts$", 121 | ".*\\.test\\.tsx$" 122 | ], 123 | "detectiveOptions": { 124 | "ts": { 125 | "skipTypeImports": true 126 | } 127 | } 128 | } 129 | } 130 | -------------------------------------------------------------------------------- /react-native-starter-kit.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/react-native-starter-kit.png -------------------------------------------------------------------------------- /react-native.config.js: -------------------------------------------------------------------------------- 1 | // Ported from package.json - see https://github.com/react-native-community/cli/blob/master/docs/configuration.md 2 | // 3 | // "rnpm": { 4 | // "assets": [ 5 | // "./src/assets/fonts" 6 | // ] 7 | // }, 8 | 9 | module.exports = { 10 | project: { 11 | ios: {}, 12 | android: {}, 13 | }, 14 | assets: ['./src/assets/fonts'], 15 | }; 16 | -------------------------------------------------------------------------------- /screenshots/screenshot1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/screenshots/screenshot1.png -------------------------------------------------------------------------------- /screenshots/screenshot2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/screenshots/screenshot2.png -------------------------------------------------------------------------------- /screenshots/screenshot3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/screenshots/screenshot3.png -------------------------------------------------------------------------------- /scripts/set-environment.js: -------------------------------------------------------------------------------- 1 | #!/bin/node 2 | const fs = require('fs'); 3 | 4 | const rnConfig = require('../app.json'); 5 | 6 | const selectedEnv = process.argv[2]; 7 | 8 | if (!Object.keys(rnConfig.environments).includes(selectedEnv)) { 9 | console.error( 10 | '💀💀💀 \x1b[47m\x1b[31mRequested environment', 11 | selectedEnv, 12 | 'does not exists inside app.json\x1b[0m 💀💀💀', 13 | ); 14 | process.exit(1); 15 | } 16 | 17 | const envVars = rnConfig.environments[process.argv[2]]; 18 | 19 | const content = `/* eslint-disable */ 20 | /**************** DO NOT TOUCH *****************/ 21 | /* This file gets generated by 'env:*' scripts */ 22 | /***********************************************/ 23 | 24 | export default ${JSON.stringify(envVars, undefined, 2)}; 25 | `; 26 | 27 | fs.writeFileSync('src/env.js', content); 28 | -------------------------------------------------------------------------------- /src/App.tsx: -------------------------------------------------------------------------------- 1 | import Splashscreen from '@components/Splashscreen'; 2 | import '@i18n'; 3 | import { NavigationContainer } from '@react-navigation/native'; 4 | import { RootStackScreen } from '@routes'; 5 | import { isMountedRef, navigationRef } from '@routes/navigationUtils'; 6 | import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; 7 | import customTheme from '@theme'; 8 | import { NativeBaseProvider, StatusBar } from 'native-base'; 9 | import React, { FC, Suspense, useEffect } from 'react'; 10 | import 'react-native-gesture-handler'; 11 | import { SafeAreaProvider } from 'react-native-safe-area-context'; 12 | import { enableScreens } from 'react-native-screens'; 13 | import SplashScreen from 'react-native-splash-screen'; 14 | 15 | enableScreens(); 16 | 17 | // Create a react-query client 18 | const queryClient = new QueryClient({ 19 | defaultOptions: { 20 | queries: { 21 | refetchOnWindowFocus: false, 22 | refetchOnMount: false, 23 | refetchOnReconnect: false, 24 | retry: false, 25 | staleTime: 5 * 60 * 1000, 26 | }, 27 | }, 28 | }); 29 | 30 | const App: FC = () => { 31 | useEffect(() => { 32 | isMountedRef.current = true; 33 | 34 | return () => (isMountedRef.current = false); 35 | }, []); 36 | 37 | useEffect(() => { 38 | SplashScreen.hide(); 39 | }, []); 40 | 41 | return ( 42 | }> 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | ); 56 | }; 57 | 58 | export default App; 59 | -------------------------------------------------------------------------------- /src/api/hooks/useUser.ts: -------------------------------------------------------------------------------- 1 | import { 2 | CreateUserRequestPayload, 3 | DeleteUserRequestPayload, 4 | ModifyUserRequestPayload, 5 | UserDetailsRequestPayload, 6 | } from '@api/users/types'; 7 | import { createUser, deleteUser, getUserDetails, modifyUser } from '@api/users/users'; 8 | import { useMutation, useQuery } from '@tanstack/react-query'; 9 | import { onOpenToast } from '@utils/toast'; 10 | 11 | function useUser({ userId }: UserDetailsRequestPayload) { 12 | return useQuery([`user-${userId}`, { userId }], () => getUserDetails({ userId }), { 13 | enabled: !!userId, 14 | }); 15 | } 16 | 17 | function useCreateUser() { 18 | return useMutation(['new-user'], ({ name, job }: CreateUserRequestPayload) => createUser({ name, job }), { 19 | onSuccess: (/*data*/) => { 20 | onOpenToast({ 21 | status: 'success', 22 | message: 'User created successfully', 23 | }); 24 | }, 25 | onError: (/*data*/) => { 26 | onOpenToast({ 27 | status: 'error', 28 | message: 'User not created', 29 | }); 30 | }, 31 | }); 32 | } 33 | 34 | function useModifyUser() { 35 | return useMutation( 36 | ['modify-user'], 37 | ({ userId, name, job }: ModifyUserRequestPayload) => modifyUser({ userId, name, job }), 38 | { 39 | onSuccess: (/*data*/) => { 40 | onOpenToast({ 41 | status: 'success', 42 | message: 'User modified successfully', 43 | }); 44 | }, 45 | onError: (/*data*/) => { 46 | onOpenToast({ 47 | status: 'error', 48 | message: 'User not modified', 49 | }); 50 | }, 51 | }, 52 | ); 53 | } 54 | 55 | function useDeleteUser() { 56 | return useMutation(['delete-user'], ({ userId }: DeleteUserRequestPayload) => deleteUser({ userId }), { 57 | onSuccess: (/*data*/) => { 58 | onOpenToast({ 59 | status: 'success', 60 | message: 'User deleted successfully', 61 | }); 62 | }, 63 | onError: (/*data*/) => { 64 | onOpenToast({ 65 | status: 'error', 66 | message: 'User not deleted', 67 | }); 68 | }, 69 | }); 70 | } 71 | 72 | export { useUser, useCreateUser, useModifyUser, useDeleteUser }; 73 | -------------------------------------------------------------------------------- /src/api/hooks/useUsers.ts: -------------------------------------------------------------------------------- 1 | import { UsersSuccessPayload } from '@api/users/types'; 2 | import { getUsers } from '@api/users/users'; 3 | import { useInfiniteQuery } from '@tanstack/react-query'; 4 | 5 | export default function useUsers({ per_page = 5 }) { 6 | return useInfiniteQuery( 7 | ['users'], 8 | ({ pageParam = 1 }) => getUsers({ pageParam, per_page }), 9 | { 10 | keepPreviousData: true, 11 | getNextPageParam: lastPage => { 12 | if (lastPage.page < lastPage.total_pages) { 13 | return lastPage.page + 1; 14 | } 15 | 16 | return undefined; 17 | }, 18 | }, 19 | ); 20 | } 21 | -------------------------------------------------------------------------------- /src/api/index.ts: -------------------------------------------------------------------------------- 1 | import env from '@env'; 2 | import axios from 'axios'; 3 | 4 | const ApiClient = axios.create({ 5 | baseURL: env.API_URL, 6 | headers: { 7 | 'Content-type': 'application/json', 8 | }, 9 | }); 10 | 11 | export default ApiClient; 12 | -------------------------------------------------------------------------------- /src/api/users/types.ts: -------------------------------------------------------------------------------- 1 | export type UsersRequestPayload = { 2 | pageParam?: number; 3 | per_page?: number; 4 | }; 5 | 6 | export type UsersSuccessPayload = { 7 | page: number; 8 | per_page: number; 9 | total: number; 10 | total_pages: number; 11 | data?: User[] | null; 12 | support: Support; 13 | }; 14 | 15 | export type UserDetailsRequestPayload = { 16 | userId: number; 17 | }; 18 | 19 | export type UserDetailsSuccessPayload = { 20 | data: User; 21 | support: Support; 22 | }; 23 | 24 | export type User = { 25 | id: number; 26 | email: string; 27 | first_name: string; 28 | last_name: string; 29 | avatar: string; 30 | }; 31 | 32 | export type Support = { 33 | url: string; 34 | text: string; 35 | }; 36 | 37 | export type CreateUserRequestPayload = { 38 | name: string; 39 | job: string; 40 | }; 41 | 42 | export type CreateUserSuccessPayload = { 43 | name: string; 44 | job: string; 45 | id: string; 46 | createdAt: string; 47 | }; 48 | 49 | export type ModifyUserRequestPayload = { 50 | userId: string; 51 | name: string; 52 | job: string; 53 | }; 54 | 55 | export type ModifyUserSuccessPayload = { 56 | name: string; 57 | job: string; 58 | updatedAt: string; 59 | }; 60 | 61 | export type DeleteUserRequestPayload = { 62 | userId: string; 63 | }; 64 | -------------------------------------------------------------------------------- /src/api/users/users.ts: -------------------------------------------------------------------------------- 1 | import ApiClient from '@api'; 2 | import env from '@env'; 3 | import { 4 | CreateUserRequestPayload, 5 | CreateUserSuccessPayload, 6 | DeleteUserRequestPayload, 7 | ModifyUserRequestPayload, 8 | ModifyUserSuccessPayload, 9 | UserDetailsRequestPayload, 10 | UserDetailsSuccessPayload, 11 | UsersRequestPayload, 12 | UsersSuccessPayload, 13 | } from './types'; 14 | 15 | export async function getUsers({ pageParam, per_page }: UsersRequestPayload) { 16 | try { 17 | const response = await ApiClient.get(`${env.API_URL}/users`, { 18 | params: { 19 | ...(pageParam && { 20 | page: pageParam, 21 | }), 22 | ...(per_page && { 23 | per_page, 24 | }), 25 | }, 26 | }); 27 | 28 | return response.data; 29 | } catch (error) { 30 | console.error('getUsers - Error: ', error); 31 | throw error; 32 | } 33 | } 34 | 35 | export async function getUserDetails({ userId }: UserDetailsRequestPayload) { 36 | try { 37 | const response = await ApiClient.get(`${env.API_URL}/users/${userId}`); 38 | 39 | return response.data; 40 | } catch (error) { 41 | console.error('getUserDetails - Error: ', error); 42 | throw error; 43 | } 44 | } 45 | 46 | export async function createUser({ name, job }: CreateUserRequestPayload) { 47 | try { 48 | const response = await ApiClient.post(`${env.API_URL}/users`, { 49 | params: { 50 | name, 51 | job, 52 | }, 53 | }); 54 | 55 | return response.data; 56 | } catch (error) { 57 | console.error('createUser - Error: ', error); 58 | throw error; 59 | } 60 | } 61 | 62 | export async function modifyUser({ userId, name, job }: ModifyUserRequestPayload) { 63 | try { 64 | // You can use also patch 65 | const response = await ApiClient.put(`${env.API_URL}/users/${userId}`, { 66 | params: { 67 | name, 68 | job, 69 | }, 70 | }); 71 | 72 | return response.data; 73 | } catch (error) { 74 | console.error('modifyUser - Error: ', error); 75 | throw error; 76 | } 77 | } 78 | 79 | export async function deleteUser({ userId }: DeleteUserRequestPayload) { 80 | try { 81 | const response = await ApiClient.delete(`${env.API_URL}/users/${userId}`); 82 | 83 | return response.data; 84 | } catch (error) { 85 | console.error('deleteUser - Error: ', error); 86 | throw error; 87 | } 88 | } 89 | -------------------------------------------------------------------------------- /src/assets/fonts/Lato-Black.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/src/assets/fonts/Lato-Black.ttf -------------------------------------------------------------------------------- /src/assets/fonts/Lato-BlackItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/src/assets/fonts/Lato-BlackItalic.ttf -------------------------------------------------------------------------------- /src/assets/fonts/Lato-Bold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/src/assets/fonts/Lato-Bold.ttf -------------------------------------------------------------------------------- /src/assets/fonts/Lato-BoldItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/src/assets/fonts/Lato-BoldItalic.ttf -------------------------------------------------------------------------------- /src/assets/fonts/Lato-Italic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/src/assets/fonts/Lato-Italic.ttf -------------------------------------------------------------------------------- /src/assets/fonts/Lato-Light.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/src/assets/fonts/Lato-Light.ttf -------------------------------------------------------------------------------- /src/assets/fonts/Lato-LightItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/src/assets/fonts/Lato-LightItalic.ttf -------------------------------------------------------------------------------- /src/assets/fonts/Lato-Regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/src/assets/fonts/Lato-Regular.ttf -------------------------------------------------------------------------------- /src/assets/fonts/Lato-Thin.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/src/assets/fonts/Lato-Thin.ttf -------------------------------------------------------------------------------- /src/assets/fonts/Lato-ThinItalic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/src/assets/fonts/Lato-ThinItalic.ttf -------------------------------------------------------------------------------- /src/assets/images/reactnative.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/IronTony/react-native-react-query-starter-app/a039e6a16d150bc7ac68a001e61286241185c1f2/src/assets/images/reactnative.png -------------------------------------------------------------------------------- /src/components/AppVersion/index.tsx: -------------------------------------------------------------------------------- 1 | import env from '@env'; 2 | import { Flex, Text } from 'native-base'; 3 | import React, { FC } from 'react'; 4 | import VersionNumber from 'react-native-version-number'; 5 | 6 | const EnvInfoView: FC = () => { 7 | return ( 8 | 9 | {/* This is just to show you how to get values from the generated ENV file */} 10 | {`ENV: ${env.ENV}`} 11 | 12 | {`v.${VersionNumber.appVersion}-${VersionNumber.buildVersion}`} 16 | 17 | ); 18 | }; 19 | 20 | export default EnvInfoView; 21 | -------------------------------------------------------------------------------- /src/components/CLoader/index.tsx: -------------------------------------------------------------------------------- 1 | import theme from '@theme'; 2 | import { Flex } from 'native-base'; 3 | import * as React from 'react'; 4 | import { FC } from 'react'; 5 | import { StyleProp, ViewStyle } from 'react-native'; 6 | import { MaterialIndicator } from 'react-native-indicators'; 7 | import styles from './styles'; 8 | 9 | interface ICLoader { 10 | color?: string; 11 | size?: number; 12 | style?: StyleProp; 13 | fullPage?: boolean; 14 | } 15 | 16 | const CLoader: FC = ({ color = theme.colors.SUN_FLOWER, size = 40, style = {}, fullPage = false }) => { 17 | return ( 18 | 19 | 20 | 21 | ); 22 | }; 23 | 24 | export default CLoader; 25 | -------------------------------------------------------------------------------- /src/components/CLoader/styles.ts: -------------------------------------------------------------------------------- 1 | import customTheme from '@theme'; 2 | import { Platform, StyleSheet } from 'react-native'; 3 | 4 | const styles = StyleSheet.create({ 5 | fullPageLoader: { 6 | backgroundColor: customTheme.colors.BLACK_OPACITY_7, 7 | ...Platform.select({ 8 | ios: { 9 | height: '100%', 10 | position: 'absolute', 11 | width: '100%', 12 | bottom: 0, 13 | zIndex: 99, 14 | }, 15 | android: { 16 | // Hackfix for elevation 17 | bottom: 0, 18 | elevation: 4, 19 | height: '101%', 20 | left: -5, 21 | opacity: 1, 22 | position: 'absolute', 23 | top: -5, 24 | width: '103%', 25 | // /Hackfix for elevation 26 | }, 27 | }), 28 | }, 29 | }); 30 | 31 | export default styles; 32 | -------------------------------------------------------------------------------- /src/components/CSafeAreaView/index.tsx: -------------------------------------------------------------------------------- 1 | import { Box } from 'native-base'; 2 | import React, { FC, ReactNode } from 'react'; 3 | 4 | interface CSafeAreaViewProps { 5 | children: ReactNode; 6 | } 7 | 8 | const CSafeAreaView: FC = ({ children }) => { 9 | return ( 10 | 11 | {children} 12 | 13 | ); 14 | }; 15 | 16 | export default CSafeAreaView; 17 | -------------------------------------------------------------------------------- /src/components/CToaster/index.tsx: -------------------------------------------------------------------------------- 1 | import { Alert, CloseIcon, HStack, IconButton, Text, VStack } from 'native-base'; 2 | import React, { FC } from 'react'; 3 | 4 | interface CToasterProps { 5 | status: 'info' | 'warning' | 'success' | 'error' | undefined; 6 | title: string | undefined; 7 | onClose?: () => void; 8 | } 9 | 10 | const CToaster: FC = ({ status, title, onClose }) => { 11 | return ( 12 | 13 | 14 | 15 | 16 | 17 | 18 | {title} 19 | 20 | 21 | {onClose && ( 22 | } 29 | /> 30 | )} 31 | 32 | 33 | 34 | ); 35 | }; 36 | 37 | export default CToaster; 38 | -------------------------------------------------------------------------------- /src/components/GenericHeader/index.tsx: -------------------------------------------------------------------------------- 1 | import { Flex, HStack, Icon, Pressable, Text } from 'native-base'; 2 | import React, { FC, memo, ReactNode } from 'react'; 3 | import { StyleProp, ViewStyle } from 'react-native'; 4 | import Ionicons from 'react-native-vector-icons/Ionicons'; 5 | 6 | interface IGenericHeader { 7 | BodyHeader?: ReactNode; 8 | LeftAction?: ReactNode; 9 | title?: string; 10 | RightAction?: ReactNode; 11 | onBackClicked?: () => void; 12 | style?: StyleProp; 13 | subtitle?: string; 14 | withShadow?: boolean; 15 | } 16 | 17 | const GenericHeader: FC = ({ 18 | BodyHeader, 19 | LeftAction, 20 | title, 21 | RightAction, 22 | onBackClicked, 23 | style = {}, 24 | subtitle = undefined, 25 | withShadow = false, 26 | }) => { 27 | return ( 28 | 34 | 35 | {/* 36 | The GenericHeader component accepts an onBackClicked prop. 37 | The route where you want to go is specified in the import of this Header in your scene component 38 | */} 39 | {!!onBackClicked && ( 40 | 41 | 42 | {/* {t('Header:back')} */} 43 | 44 | )} 45 | {/* 46 | You can also pass a custom component defined in you scene component for the left section of the Header 47 | */} 48 | {LeftAction} 49 | 50 | 51 | 52 | {/* 53 | You can pass the page name or a component that will be rendered in the middle of your Header 54 | */} 55 | 56 | {!!title && ( 57 | 67 | {title} 68 | 69 | )} 70 | {!subtitle ? <> : {subtitle}} 71 | {BodyHeader} 72 | 73 | 74 | 75 | {/* 76 | You can also pass a custom component defined in you scene component for the right section of the Header 77 | */} 78 | 79 | {RightAction} 80 | 81 | 82 | ); 83 | }; 84 | 85 | export default memo(GenericHeader); 86 | -------------------------------------------------------------------------------- /src/components/GenericHeader/styles.ts: -------------------------------------------------------------------------------- 1 | import customTheme from '@theme'; 2 | import { theme } from 'native-base'; 3 | import { StyleSheet } from 'react-native'; 4 | 5 | const styles = StyleSheet.create({ 6 | headerContainer: { 7 | backgroundColor: customTheme.colors.headerBackground, 8 | paddingHorizontal: theme.space[16], 9 | zIndex: 9999, 10 | }, 11 | HeaderShadow: { 12 | elevation: 3, 13 | shadowColor: customTheme.colors.GREY_SHADOW_7, 14 | shadowOffset: { width: 0, height: 5 }, 15 | shadowOpacity: 0.7, 16 | shadowRadius: 3, 17 | zIndex: 1, 18 | }, 19 | backButtonContainer: {}, 20 | // backButtonStyle: { 21 | // color: customTheme.colors.backButtonText, 22 | // fontFamily: fonts.boldOS, 23 | // fontSize: 18, 24 | // }, 25 | backButtonIcon: { 26 | color: customTheme.colors.primary, 27 | marginRight: 8, 28 | fontSize: 24, 29 | }, 30 | bodyContainer: { 31 | alignItems: 'center', 32 | flex: 1, 33 | }, 34 | mainPageTitle: { 35 | color: customTheme.colors.primary, 36 | // fontFamily: fonts.bold, 37 | fontSize: 24, 38 | lineHeight: 24, 39 | textAlign: 'center', 40 | width: 220, 41 | }, 42 | BodyContent: { 43 | alignItems: 'center', 44 | flex: 1, 45 | justifyContent: 'center', 46 | width: '100%', 47 | }, 48 | }); 49 | 50 | export default styles; 51 | -------------------------------------------------------------------------------- /src/components/GenericModal/index.tsx: -------------------------------------------------------------------------------- 1 | import CSafeAreaView from '@components/CSafeAreaView'; 2 | import GenericHeader from '@components/GenericHeader'; 3 | import { StackActions, useNavigation } from '@react-navigation/native'; 4 | import { Icon, Pressable, ScrollView, Text } from 'native-base'; 5 | import React, { useCallback, FC, ReactNode } from 'react'; 6 | import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons'; 7 | 8 | interface IModalPage { 9 | children: ReactNode; 10 | pageTitle: string; 11 | } 12 | 13 | const ModalPage: FC = ({ children, pageTitle }) => { 14 | const navigation = useNavigation(); 15 | const popAction = useCallback(() => StackActions.pop(), []); 16 | 17 | const closeModal = useCallback(() => { 18 | navigation.dispatch(popAction); 19 | }, [navigation, popAction]); 20 | 21 | return ( 22 | 23 | 26 | {pageTitle} 27 | 28 | } 29 | RightAction={ 30 | 31 | 32 | 33 | } 34 | /> 35 | 42 | {children} 43 | 44 | 45 | ); 46 | }; 47 | 48 | export default ModalPage; 49 | -------------------------------------------------------------------------------- /src/components/Splashscreen/index.tsx: -------------------------------------------------------------------------------- 1 | import React, { FC, memo, useEffect } from 'react'; 2 | import { View } from 'react-native'; 3 | import SplashScreen from 'react-native-splash-screen'; 4 | 5 | /** 6 | * An empty component used to manage SplashScreen from Suspense fallback 7 | */ 8 | const Splashscreen: FC = () => { 9 | useEffect(() => { 10 | return () => { 11 | // Hide Splashscreen when Fallback get willUnmount 12 | SplashScreen.hide(); 13 | }; 14 | }); 15 | 16 | // To avoid strange crash if i18next load takes too much! 🙀🙀🙀 17 | return ; 18 | }; 19 | 20 | export default memo(Splashscreen); 21 | -------------------------------------------------------------------------------- /src/hooks/useNavigationBack.ts: -------------------------------------------------------------------------------- 1 | import { StackActions, useNavigation } from '@react-navigation/core'; 2 | import { useCallback } from 'react'; 3 | 4 | export const useNavigationBackAction = (count = 1): (() => void) => { 5 | const navigation = useNavigation(); 6 | 7 | const goBack = useCallback(() => { 8 | const popAciton = StackActions.pop(count); 9 | navigation.dispatch(popAciton); 10 | }, [count, navigation]); 11 | 12 | return goBack; 13 | }; 14 | -------------------------------------------------------------------------------- /src/i18n/index.ts: -------------------------------------------------------------------------------- 1 | import i18n from 'i18next'; 2 | import { initReactI18next } from 'react-i18next'; 3 | import { Text } from 'react-native'; 4 | import { defaultLanguage, languagesResources } from './languageConfig'; 5 | import RNLanguageDetector from './languageDetector'; 6 | 7 | i18n 8 | .use(RNLanguageDetector) 9 | .use(initReactI18next) // passes i18n down to react-i18next 10 | .init({ 11 | debug: process.env.NODE_ENV === 'development', 12 | resources: languagesResources, 13 | compatibilityJSON: 'v3', 14 | // language to use if translations in user language are not available. 15 | fallbackLng: defaultLanguage, 16 | 17 | ns: ['common'], 18 | defaultNS: 'common', 19 | 20 | interpolation: { 21 | escapeValue: false, // not needed for react as it escapes by default 22 | }, 23 | 24 | react: { 25 | useSuspense: true, 26 | defaultTransParent: Text, 27 | transSupportBasicHtmlNodes: false, 28 | }, 29 | }); 30 | 31 | export default i18n; 32 | -------------------------------------------------------------------------------- /src/i18n/languageConfig.ts: -------------------------------------------------------------------------------- 1 | // Import here your languages 2 | import en from './locales/en.json'; 3 | import it from './locales/it.json'; 4 | 5 | // Set here you favourite default language 6 | export const defaultLanguage = 'en'; 7 | 8 | // Export here your language files import 9 | export const languagesResources = { 10 | en, 11 | it, 12 | }; 13 | -------------------------------------------------------------------------------- /src/i18n/languageDetector.ts: -------------------------------------------------------------------------------- 1 | import AsyncStorage from '@react-native-async-storage/async-storage'; 2 | import noop from 'lodash/noop'; 3 | import { findBestAvailableLanguage } from 'react-native-localize'; 4 | import { defaultLanguage, languagesResources } from './languageConfig'; 5 | 6 | const LOCALE_PERSISTENCE_KEY = 'app_locale'; 7 | 8 | const RNLanguageDetector = { 9 | type: 'languageDetector', 10 | async: true, 11 | detect: async (cb: (detectedLocale: string) => void): Promise => { 12 | try { 13 | // Retrieve cached locale 14 | const persistedLocale = await AsyncStorage.getItem(LOCALE_PERSISTENCE_KEY); 15 | 16 | // If not found, detect from device 17 | if (!persistedLocale) { 18 | // Find best available language from the resource ones 19 | const languageTags = Object.keys(languagesResources); 20 | const detectedLocale = await findBestAvailableLanguage(languageTags); 21 | 22 | // Return detected locale or default language 23 | return cb(detectedLocale?.languageTag ?? defaultLanguage); 24 | } 25 | 26 | cb(persistedLocale); 27 | } catch { 28 | console.warn('Failed to detect locale!'); 29 | console.warn('Will use defaultLanguage:', defaultLanguage); 30 | 31 | cb(defaultLanguage); 32 | } 33 | }, 34 | init: noop, 35 | cacheUserLanguage: (locale: string): void => { 36 | AsyncStorage.setItem(LOCALE_PERSISTENCE_KEY, locale); 37 | }, 38 | }; 39 | 40 | export default RNLanguageDetector; 41 | -------------------------------------------------------------------------------- /src/i18n/locales/en.json: -------------------------------------------------------------------------------- 1 | { 2 | "common": { 3 | "italian": "Italian", 4 | "english": "English" 5 | }, 6 | "Header": { 7 | "back": "Back" 8 | }, 9 | "Homepage": { 10 | "welcome": "Thank you for using the React Native Starter App\n😍 😘 🙏🏻", 11 | "releasedWithLove": "Created and released with ❤️ for you", 12 | "gotoUsersList": "Go to Users List", 13 | "openModal": "Open Modal", 14 | "createNewUser": " Create new user", 15 | "ModifyUser": "Modify user", 16 | "DeleteUser": "Delete user" 17 | }, 18 | "UsersList": { 19 | "UsersList": "Users List" 20 | }, 21 | "ModalPage": { 22 | "PageName": "Modal Page", 23 | "thisIsAModal": "This is a modal!" 24 | }, 25 | "UserDetails": { 26 | "UserDetails": "User Details" 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /src/i18n/locales/it.json: -------------------------------------------------------------------------------- 1 | { 2 | "common": { 3 | "italian": "Italiano", 4 | "english": "Inglese" 5 | }, 6 | "Header": { 7 | "back": "Indietro" 8 | }, 9 | "Homepage": { 10 | "welcome": "Grazie per usare React Native Starter App\n😍 😘 🙏🏻", 11 | "releasedWithLove": "Creato e rilasciato con ❤️ per voi", 12 | "gotoUsersList": "Vai alla pagina degli utenti", 13 | "openModal": "Apri la modale", 14 | "createNewUser": " Crea nuovo utente", 15 | "ModifyUser": "Modifica utente", 16 | "DeleteUser": "Cancella utente" 17 | }, 18 | "UsersList": { 19 | "UsersList": "Lista Utenti" 20 | }, 21 | "ModalPage": { 22 | "PageName": "Modale", 23 | "thisIsAModal": "Questa è una modale!" 24 | }, 25 | "UserDetails": { 26 | "UserDetails": "Dettaglio utente" 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /src/routes/index.tsx: -------------------------------------------------------------------------------- 1 | import { createStackNavigator, TransitionPresets } from '@react-navigation/stack'; 2 | import ModalPage from '@scenes/ModalPage'; 3 | import customTheme from '@theme'; 4 | import React, { FC } from 'react'; 5 | import { routeOverlayOption } from './routeOptions'; 6 | import { MainStackScreen } from './stacks/MainStack'; 7 | 8 | const RootStack = createStackNavigator(); 9 | 10 | export const RootStackScreen: FC = () => { 11 | return ( 12 | 13 | 20 | <>, 27 | headerLeftContainerStyle: { 28 | paddingLeft: customTheme.space[5], 29 | }, 30 | headerRightContainerStyle: { 31 | paddingRight: customTheme.space[5], 32 | }, 33 | ...TransitionPresets.ModalPresentationIOS, 34 | }} 35 | /> 36 | 37 | ); 38 | }; 39 | -------------------------------------------------------------------------------- /src/routes/navigationUtils.ts: -------------------------------------------------------------------------------- 1 | import { createNavigationContainerRef, StackActions } from '@react-navigation/native'; 2 | import { createRef } from 'react'; 3 | 4 | export const navigationRef = createNavigationContainerRef(); 5 | export const isMountedRef = createRef(); 6 | 7 | interface NavigateProps { 8 | (name: string, params: Record): void; 9 | } 10 | 11 | // Use this function to navigate to specific page when you are outisde of a component 12 | export const navigate: NavigateProps = (name, params) => { 13 | if (isMountedRef.current && navigationRef.current) { 14 | // Perform navigation if the app has mounted 15 | navigationRef.current.navigate(name, params); 16 | } else { 17 | // You can decide what to do if the app hasn't mounted 18 | // You can ignore this, or add these actions to a queue you can call later 19 | } 20 | }; 21 | 22 | export const navigatePop = (): void => { 23 | if (isMountedRef.current && navigationRef.current) { 24 | // Perform navigation if the app has mounted 25 | navigationRef.current?.dispatch(StackActions.pop()); 26 | } else { 27 | // You can decide what to do if the app hasn't mounted 28 | // You can ignore this, or add these actions to a queue you can call later 29 | } 30 | }; 31 | 32 | export const popToTop = (): void => { 33 | if (isMountedRef.current && navigationRef.current) { 34 | // Perform navigation if the app has mounted 35 | navigationRef.current?.dispatch(StackActions.popToTop()); 36 | } else { 37 | // You can decide what to do if the app hasn't mounted 38 | // You can ignore this, or add these actions to a queue you can call later 39 | } 40 | }; 41 | -------------------------------------------------------------------------------- /src/routes/routeOptions.ts: -------------------------------------------------------------------------------- 1 | export const routeOverlayOption = { 2 | cardStyle: { backgroundColor: 'transparent' }, 3 | cardOverlayEnabled: true, 4 | cardStyleInterpolator: ({ current: { progress } }) => ({ 5 | cardStyle: { 6 | opacity: progress.interpolate({ 7 | inputRange: [0, 0.5, 0.9, 1], 8 | outputRange: [0, 0.25, 0.7, 1], 9 | }), 10 | }, 11 | overlayStyle: { 12 | opacity: progress.interpolate({ 13 | inputRange: [0, 1], 14 | outputRange: [0, 0.5], 15 | extrapolate: 'clamp', 16 | }), 17 | }, 18 | }), 19 | }; 20 | -------------------------------------------------------------------------------- /src/routes/stacks/MainStack.tsx: -------------------------------------------------------------------------------- 1 | import { createStackNavigator, TransitionPresets } from '@react-navigation/stack'; 2 | import Homepage from '@scenes/Homepage'; 3 | import UserDetails from '@scenes/UserDetails'; 4 | import UsersList from '@scenes/UsersList'; 5 | import customTheme from '@theme'; 6 | import { FC } from 'react'; 7 | import * as React from 'react'; 8 | 9 | const MainStack = createStackNavigator(); 10 | 11 | export const MainStackScreen: FC = () => { 12 | return ( 13 | 14 | 23 | 38 | 53 | 54 | ); 55 | }; 56 | -------------------------------------------------------------------------------- /src/routes/types.ts: -------------------------------------------------------------------------------- 1 | import { NavigationProp, StackActionType } from '@react-navigation/native'; 2 | 3 | export type NavigateProps = { 4 | (name: string, params?: unknown): void; 5 | }; 6 | 7 | export type GenericNavigationProps = { 8 | navigate: NavigateProps; 9 | setOptions: (options: Partial) => void; 10 | goBack: () => StackActionType; 11 | }; 12 | -------------------------------------------------------------------------------- /src/scenes/Homepage/index.tsx: -------------------------------------------------------------------------------- 1 | import { useCreateUser, useDeleteUser, useModifyUser } from '@api/hooks/useUser'; 2 | import EnvInfoView from '@components/AppVersion'; 3 | import CSafeAreaView from '@components/CSafeAreaView'; 4 | import { useNavigation } from '@react-navigation/native'; 5 | import { GenericNavigationProps } from '@routes/types'; 6 | import { Button, Flex, Icon, ScrollView, Text } from 'native-base'; 7 | import React, { useCallback, FC, memo, useLayoutEffect } from 'react'; 8 | import { useTranslation } from 'react-i18next'; 9 | import EvilIcons from 'react-native-vector-icons/EvilIcons'; 10 | import FontAwesome5 from 'react-native-vector-icons/FontAwesome5'; 11 | 12 | const Home: FC = () => { 13 | const [t, i18n] = useTranslation(); 14 | const navigation = useNavigation(); 15 | const { setOptions } = useNavigation(); 16 | const { mutate: createUser } = useCreateUser(); 17 | const { mutate: modifyUser } = useModifyUser(); 18 | const { mutate: deleteUser } = useDeleteUser(); 19 | const currentLocale = i18n.language; 20 | 21 | const switchLocaleToEn = useCallback(() => { 22 | i18n.changeLanguage('en'); 23 | }, [i18n]); 24 | 25 | const switchLocaleToIt = useCallback(() => { 26 | i18n.changeLanguage('it'); 27 | }, [i18n]); 28 | 29 | useLayoutEffect(() => { 30 | setOptions({ 31 | headerLeft: () => <>, 32 | headerTitle: () => , 33 | }); 34 | }, [setOptions]); 35 | 36 | return ( 37 | 38 | 47 | 55 | {t('Homepage:welcome')} 56 | 57 | 65 | {t('Homepage:releasedWithLove')} 66 | 67 | 68 | 69 | 81 | 82 | 94 | 95 | 96 | 107 | 108 | 116 | 117 | 128 | 129 | 137 | 138 | 149 | 150 | 151 | 152 | 153 | ); 154 | }; 155 | 156 | export default memo(Home); 157 | -------------------------------------------------------------------------------- /src/scenes/ModalPage/index.tsx: -------------------------------------------------------------------------------- 1 | import { useNavigationBackAction } from '@hooks/useNavigationBack'; 2 | import { useNavigation } from '@react-navigation/native'; 3 | import { GenericNavigationProps } from '@routes/types'; 4 | import { Flex, Icon, Pressable, ScrollView, Text } from 'native-base'; 5 | import React, { FC, useLayoutEffect } from 'react'; 6 | import { useTranslation } from 'react-i18next'; 7 | import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons'; 8 | 9 | const ModalPage: FC = () => { 10 | const { t } = useTranslation(); 11 | const { setOptions } = useNavigation(); 12 | const goBack = useNavigationBackAction(); 13 | 14 | useLayoutEffect(() => { 15 | setOptions({ 16 | headerTitle: () => ( 17 | 18 | {t('ModalPage:PageName')} 19 | 20 | ), 21 | headerRight: () => ( 22 | 23 | 24 | 25 | 26 | 27 | ), 28 | }); 29 | }, [goBack, setOptions, t]); 30 | 31 | return ( 32 | 39 | 40 | {t('ModalPage:thisIsAModal')} 41 | 42 | 43 | ); 44 | }; 45 | 46 | export default ModalPage; 47 | -------------------------------------------------------------------------------- /src/scenes/UserDetails/index.tsx: -------------------------------------------------------------------------------- 1 | import { useUser } from '@api/hooks/useUser'; 2 | import CLoader from '@components/CLoader'; 3 | import CSafeAreaView from '@components/CSafeAreaView'; 4 | import { useNavigationBackAction } from '@hooks/useNavigationBack'; 5 | import { Route, useNavigation, useRoute } from '@react-navigation/native'; 6 | import { GenericNavigationProps } from '@routes/types'; 7 | import { Avatar, Flex, Icon, Pressable, ScrollView, Text } from 'native-base'; 8 | import { FC, useLayoutEffect } from 'react'; 9 | import * as React from 'react'; 10 | import { useTranslation } from 'react-i18next'; 11 | import MaterialIcons from 'react-native-vector-icons/MaterialIcons'; 12 | 13 | interface UserDetailsProps { 14 | userId: number; 15 | } 16 | 17 | const UserDetails: FC = () => { 18 | const { t } = useTranslation(); 19 | const route = useRoute>(); 20 | const { setOptions } = useNavigation(); 21 | const goBack = useNavigationBackAction(); 22 | const userId = route?.params?.userId; 23 | const { isLoading, data: singleUserDetails } = useUser({ userId }); 24 | 25 | useLayoutEffect(() => { 26 | setOptions({ 27 | headerLeft: () => ( 28 | 29 | 30 | 31 | ), 32 | headerTitle: () => ( 33 | 34 | {t('UserDetails:UserDetails')} 35 | 36 | ), 37 | }); 38 | }, [goBack, setOptions, t]); 39 | 40 | return ( 41 | 42 | {isLoading && } 43 | 44 | 50 | 51 | 52 | {`${singleUserDetails?.data?.first_name} ${singleUserDetails?.data?.last_name}`} 58 | 59 | 60 | {singleUserDetails?.data?.email} 61 | 62 | 63 | 64 | ); 65 | }; 66 | 67 | export default UserDetails; 68 | -------------------------------------------------------------------------------- /src/scenes/UsersList/index.tsx: -------------------------------------------------------------------------------- 1 | import useUsers from '@api/hooks/useUsers'; 2 | import { User } from '@api/users/types'; 3 | import CLoader from '@components/CLoader'; 4 | import CSafeAreaView from '@components/CSafeAreaView'; 5 | import { useNavigationBackAction } from '@hooks/useNavigationBack'; 6 | import { useNavigation, useFocusEffect } from '@react-navigation/native'; 7 | import { GenericNavigationProps } from '@routes/types'; 8 | import { Avatar, FlatList, Flex, Icon, Pressable, Text } from 'native-base'; 9 | import * as React from 'react'; 10 | import { useCallback, FC, useLayoutEffect } from 'react'; 11 | import { useTranslation } from 'react-i18next'; 12 | import MaterialIcons from 'react-native-vector-icons/MaterialIcons'; 13 | 14 | const UsersList: FC = () => { 15 | const { t } = useTranslation(); 16 | const navigation = useNavigation(); 17 | const { setOptions } = useNavigation(); 18 | const goBack = useNavigationBackAction(); 19 | const { 20 | isLoading: usersLoading, 21 | data: usersData, 22 | refetch: getAllUsers, 23 | hasNextPage, 24 | fetchNextPage, 25 | isFetchingNextPage, 26 | } = useUsers({ per_page: 5 }); 27 | const flattenUsersList = usersData?.pages ? usersData.pages.flatMap(page => [...(page?.data ?? [])]) : []; 28 | 29 | const onGotoUserDetails = useCallback( 30 | (userId: number) => { 31 | navigation.navigate('UserDetails', { 32 | userId, 33 | }); 34 | }, 35 | [navigation], 36 | ); 37 | 38 | const renderItem = useCallback( 39 | ({ item }: { item: User }) => ( 40 | onGotoUserDetails(item?.id)}> 41 | 42 | 43 | {`${item.first_name} ${item.last_name}`} 50 | 51 | 52 | ), 53 | [onGotoUserDetails], 54 | ); 55 | 56 | const loadMore = useCallback(() => { 57 | if (hasNextPage) { 58 | fetchNextPage(); 59 | } 60 | }, [fetchNextPage, hasNextPage]); 61 | 62 | useFocusEffect( 63 | useCallback(() => { 64 | getAllUsers(); 65 | }, [getAllUsers]), 66 | ); 67 | 68 | useLayoutEffect(() => { 69 | setOptions({ 70 | headerLeft: () => ( 71 | 72 | 73 | 74 | 75 | 76 | ), 77 | headerTitle: () => ( 78 | 79 | {t('UsersList:UsersList')} 80 | 81 | ), 82 | }); 83 | }, [goBack, setOptions, t]); 84 | 85 | return ( 86 | 87 | {usersLoading && } 88 | 89 | : null} 102 | /> 103 | 104 | ); 105 | }; 106 | 107 | export default React.memo(UsersList); 108 | -------------------------------------------------------------------------------- /src/theme/colors.ts: -------------------------------------------------------------------------------- 1 | const palette = { 2 | TORQUISE: '#1abc9c', 3 | EMERALD: '#2ecc71', 4 | GREEN_SEA: '#16a085', 5 | NEPHRITIS: '#27ae60', 6 | SUN_FLOWER: '#f1c40f', 7 | ORANGE: '#f39c12', 8 | CARROT: '#e67e22', 9 | PUMPKIN: '#d35400', 10 | PETER_RIVER: '#3498db', 11 | BELIZE_HOLE: '#2980b9', 12 | ALIZARIN: '#e74c3c', 13 | POMEGRANATE: '#c0392b', 14 | AMETHYST: '#9b59b6', 15 | WISTERIA: '#8e44ad', 16 | WET_ASPHALT: '#34495e', 17 | MIDNIGHT_BLUE: '#2c3e50', 18 | ASBESTOS: '#7f8c8d', 19 | CONCRETE: '#95a5a6', 20 | SILVER: '#bdc3c7', 21 | CLOUDS: '#ecf0f1', 22 | WHITE: '#fff', 23 | BLACK: '#000', 24 | TRANSPARENT: '#00000000', 25 | GREY_SHADOW_7: 'rgba(216,216,216,0.7)', 26 | BLACK_OPACITY_7: 'rgba(0,0,0,0.7)', 27 | }; 28 | 29 | export default palette; 30 | -------------------------------------------------------------------------------- /src/theme/fonts.ts: -------------------------------------------------------------------------------- 1 | const typography = { 2 | letterSpacings: { 3 | xs: '-0.05em', 4 | sm: '-0.025em', 5 | md: 0, 6 | lg: '0.025em', 7 | xl: '0.05em', 8 | '2xl': '0.1em', 9 | }, 10 | lineHeights: { 11 | xxs: '1em', 12 | xs: '1.125em', 13 | sm: '1.25em', 14 | md: '1.375em', 15 | lg: '1.5em', 16 | xl: '1.75em', 17 | '2xl': '2em', 18 | '3xl': '2.5em', 19 | '4xl': '3em', 20 | '5xl': '4em', 21 | }, 22 | fontConfig: { 23 | Lato: { 24 | 100: { 25 | normal: 'Lato-Thin', 26 | italic: 'Lato-ThinItalic', 27 | }, 28 | 300: { 29 | normal: 'Lato-Light', 30 | italic: 'Lato-LightItalic', 31 | }, 32 | 400: { 33 | normal: 'Lato-Regular', 34 | italic: 'Lato-Italic', 35 | }, 36 | 700: { 37 | normal: 'Lato-Bold', 38 | italic: 'Lato-BoldItalic', 39 | }, 40 | 900: { 41 | normal: 'Lato-Black', 42 | italic: 'Lato-BlackItalic', 43 | }, 44 | }, 45 | }, 46 | 47 | // Make sure values below matches any of the keys in `fontConfig` 48 | fonts: { 49 | heading: 'Lato', 50 | body: 'Lato', 51 | mono: 'Lato', 52 | }, 53 | 54 | fontSizes: { 55 | xxs: 10, 56 | xs: 12, 57 | sm: 14, 58 | md: 16, 59 | lg: 18, 60 | xl: 20, 61 | '2xl': 24, 62 | '3xl': 30, 63 | '4xl': 36, 64 | '5xl': 48, 65 | '6xl': 60, 66 | '7xl': 72, 67 | '8xl': 96, 68 | '9xl': 128, 69 | }, 70 | }; 71 | 72 | export default typography; 73 | -------------------------------------------------------------------------------- /src/theme/index.ts: -------------------------------------------------------------------------------- 1 | import { extendTheme } from 'native-base'; 2 | import palette from './colors'; 3 | import typography from './fonts'; 4 | 5 | const customTheme = extendTheme({ 6 | colors: { 7 | white: palette.WHITE, 8 | black: palette.BLACK, 9 | lightText: palette.WHITE, 10 | darkText: palette.BLACK, 11 | 12 | primary: palette.EMERALD, 13 | secondary: palette.ORANGE, 14 | tertiary: palette.MIDNIGHT_BLUE, 15 | 16 | pageBackground: palette.MIDNIGHT_BLUE, 17 | headerBackground: palette.WHITE, 18 | 19 | ...palette, 20 | }, 21 | 22 | ...typography, 23 | 24 | config: { 25 | // Changing initialColorMode to 'light' 26 | initialColorMode: 'light', 27 | }, 28 | }); 29 | 30 | export type Theme = typeof customTheme; 31 | export default customTheme; 32 | -------------------------------------------------------------------------------- /src/theme/margin.ts: -------------------------------------------------------------------------------- 1 | import { StyleSheet } from 'react-native'; 2 | 3 | const globalMarginStyles = StyleSheet.create({ 4 | marginBottom10: { 5 | marginBottom: 10, 6 | }, 7 | marginBottom20: { 8 | marginBottom: 20, 9 | }, 10 | marginBottom25: { 11 | marginBottom: 25, 12 | }, 13 | marginBottom30: { 14 | marginBottom: 30, 15 | }, 16 | marginBottom40: { 17 | marginBottom: 40, 18 | }, 19 | marginTop10: { 20 | marginTop: 10, 21 | }, 22 | marginTop15: { 23 | marginTop: 15, 24 | }, 25 | marginTop20: { 26 | marginTop: 20, 27 | }, 28 | marginTop25: { 29 | marginTop: 25, 30 | }, 31 | marginTop40: { 32 | marginTop: 40, 33 | }, 34 | marginTop45: { 35 | marginTop: 45, 36 | }, 37 | marginTop50: { 38 | marginTop: 50, 39 | }, 40 | marginRight20: { 41 | marginRight: 20, 42 | }, 43 | marginHorizontal10: { 44 | marginHorizontal: 10, 45 | }, 46 | marginHorizontal24: { 47 | marginHorizontal: 24, 48 | }, 49 | }); 50 | 51 | export default globalMarginStyles; 52 | -------------------------------------------------------------------------------- /src/theme/padding.ts: -------------------------------------------------------------------------------- 1 | import { StyleSheet } from 'react-native'; 2 | 3 | const globalPaddingStyles = StyleSheet.create({ 4 | padding60: { 5 | padding: 60, 6 | }, 7 | paddingVertical30: { 8 | paddingVertical: 30, 9 | }, 10 | paddingVertical60: { 11 | paddingVertical: 60, 12 | }, 13 | paddingHorizontal10: { 14 | paddingHorizontal: 10, 15 | }, 16 | paddingHorizontal50: { 17 | paddingHorizontal: 50, 18 | }, 19 | }); 20 | 21 | export default globalPaddingStyles; 22 | -------------------------------------------------------------------------------- /src/utils/toast.tsx: -------------------------------------------------------------------------------- 1 | import CToaster from '@components/CToaster'; 2 | import { Toast } from 'native-base'; 3 | import * as React from 'react'; 4 | 5 | // export const onCloseToast = ({ toastId }: { toastId: string }) => { 6 | // Toast.close(toastId); 7 | // }; 8 | 9 | export const onOpenToast = ({ 10 | status, 11 | message, 12 | }: { 13 | status: 'info' | 'warning' | 'success' | 'error' | undefined; 14 | message: string | undefined; 15 | }) => { 16 | Toast.show({ 17 | render: () => , 18 | placement: 'top', 19 | // onCloseComplete: () => noop, 20 | duration: 5000, 21 | }); 22 | }; 23 | -------------------------------------------------------------------------------- /tsconfig.jest.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig", 3 | "compilerOptions": { 4 | "jsx": "react", 5 | "module": "commonjs" 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | /* Basic Options */ 4 | "target": "esnext", /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017','ES2018' or 'ESNEXT'. */ 5 | "module": "commonjs", /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */ 6 | "lib": ["es2017"], /* Specify library files to be included in the compilation. */ 7 | "allowJs": true, /* Allow javascript files to be compiled. */ 8 | // "checkJs": true, /* Report errors in .js files. */ 9 | "declaration": true, /* Generates corresponding '.d.ts' file. */ 10 | // "sourceMap": true, /* Generates corresponding '.map' file. */ 11 | // "outFile": "./", /* Concatenate and emit output to single file. */ 12 | // "outDir": "./", /* Redirect output structure to the directory. */ 13 | // "rootDir": "./", /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */ 14 | // "removeComments": true, /* Do not emit comments to output. */ 15 | "noEmit": true, /* Do not emit outputs. */ 16 | // "incremental": true, /* Enable incremental compilation */ 17 | // "importHelpers": true, /* Import emit helpers from 'tslib'. */ 18 | // "downlevelIteration": true, /* Provide full support for iterables in 'for-of', spread, and destructuring when targeting 'ES5' or 'ES3'. */ 19 | "isolatedModules": true, /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */ 20 | 21 | /* Strict Type-Checking Options */ 22 | "strict": true, /* Enable all strict type-checking options. */ 23 | // "noImplicitAny": true, /* Raise error on expressions and declarations with an implied 'any' type. */ 24 | // "strictNullChecks": true, /* Enable strict null checks. */ 25 | // "strictFunctionTypes": true, /* Enable strict checking of function types. */ 26 | // "strictPropertyInitialization": true, /* Enable strict checking of property initialization in classes. */ 27 | // "noImplicitThis": true, /* Raise error on 'this' expressions with an implied 'any' type. */ 28 | // "alwaysStrict": true, /* Parse in strict mode and emit "use strict" for each source file. */ 29 | 30 | /* Additional Checks */ 31 | "noUnusedLocals": true, /* Report errors on unused locals. */ 32 | "noUnusedParameters": true, /* Report errors on unused parameters. */ 33 | "noImplicitReturns": true, /* Report error when not all code paths in function return a value. */ 34 | "noFallthroughCasesInSwitch": true, /* Report errors for fallthrough cases in switch statement. */ 35 | 36 | /* Module Resolution Options */ 37 | "moduleResolution": "node", /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */ 38 | // "baseUrl": "./", /* Base directory to resolve non-absolute module names. */ 39 | // "paths": {}, /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */ 40 | // "rootDirs": [], /* List of root folders whose combined content represents the structure of the project at runtime. */ 41 | // "typeRoots": [], /* List of folders to include type definitions from. */ 42 | // "types": [], /* Type declaration files to be included in compilation. */ 43 | "allowSyntheticDefaultImports": true, /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */ 44 | "esModuleInterop": true, /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */ 45 | // "preserveSymlinks": true, /* Do not resolve the real path of symlinks. */ 46 | "skipLibCheck": true, /* Skip type checking of declaration files. */ 47 | "resolveJsonModule": true, /* Allows importing modules with a ‘.json’ extension, which is a common practice in node projects. */ 48 | 49 | /* Source Map Options */ 50 | // "sourceRoot": "./", /* Specify the location where debugger should locate TypeScript files instead of source locations. */ 51 | // "mapRoot": "./", /* Specify the location where debugger should locate map files instead of generated locations. */ 52 | // "inlineSourceMap": true, /* Emit a single file with source maps instead of having a separate file. */ 53 | // "inlineSources": true, /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */ 54 | 55 | /* Experimental Options */ 56 | "experimentalDecorators": true, /* Enables experimental support for ES7 decorators. */ 57 | // "emitDecoratorMetadata": true, /* Enables experimental support for emitting type metadata for decorators. */ 58 | 59 | /* Generic Options */ 60 | "jsx": "react-native", /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */ 61 | "forceConsistentCasingInFileNames": true, // Disallow inconsistently-cased references to the same file. 62 | 63 | "baseUrl": "./", 64 | "paths": { 65 | "@*": ["src/*"], 66 | "@api/*": [ 67 | "src/api/*" 68 | ], 69 | "@assets/*": [ 70 | "src/assets/*" 71 | ], 72 | "@components/*": [ 73 | "src/components/*" 74 | ], 75 | "@hooks/*": [ 76 | "src/hooks/*" 77 | ], 78 | "@i18n/*": [ 79 | "src/i18n/*" 80 | ], 81 | "@routes/*": [ 82 | "src/routes/*" 83 | ], 84 | "@scenes/*": [ 85 | "src/scenes/*" 86 | ], 87 | "@theme/*": [ 88 | "src/theme/*" 89 | ], 90 | "@utils/*": [ 91 | "src/utils/*" 92 | ], 93 | "@env": [ 94 | "src/env.js" 95 | ] 96 | } 97 | }, 98 | "exclude": [ 99 | "node_modules", 100 | "babel.config.js", 101 | "metro.config.js", 102 | "jest.config.js" 103 | ] 104 | } 105 | --------------------------------------------------------------------------------