# hsinghal153/rnfuncsetup architecture

> Architecture diagram of the GitHub repository hsinghal153/rnfuncsetup, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-27). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/hsinghal153/rnfuncsetup
- Repository: https://github.com/hsinghal153/rnfuncsetup

## Overview

This is a React Native starter app: its visible user workflow launches the registered component and displays the stock instructional screen. The repository also contains Redux login-request plumbing, but the sampled App does not connect to that store, so it is shown as a separate capability rather than part of the screen flow. Login source is sampled; the root saga and API URL definitions are not, so their internal wiring is omitted.

Main entry points: [`src/Redux/store.tsx`](https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Redux/store.tsx) (Redux store), [`src/Redux/Middleware/SagaApi/login.saga.js`](https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Redux/Middleware/SagaApi/login.saga.js) (Login saga), [`src/Util/HTTPRequest.tsx`](https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Util/HTTPRequest.tsx) (HTTP requests), [`src/Util/APIKit.tsx`](https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Util/APIKit.tsx) (API client)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_app["App screen"]
  node_entry["JS registration<br/>[index.js]"]
  node_screen["Starter screen<br/>[App.tsx]"]
end

subgraph group_state["State and login"]
  node_store["Redux store<br/>[store.tsx]"]
  node_user_slice["User request state<br/>[userSlice.js]"]
  node_token_slice["Token state<br/>[getToken.js]"]
  node_root_saga["Root saga<br/>[rootSaga.tsx]"]
  node_login_saga["Login saga<br/>[login.saga.js]"]
  node_http["HTTP requests<br/>[HTTPRequest.tsx]"]
  node_api["API client<br/>[APIKit.tsx]"]
  node_api_urls["API endpoints<br/>[Api_Url.tsx]"]
  node_app_utils["Error messages<br/>[AppUtils.tsx]"]
end

subgraph group_native["Native launch"]
  node_android["Android activity<br/>[MainActivity.kt]"]
  node_ios["iOS delegate<br/>[AppDelegate.swift]"]
end

node_user(("App user"))
node_service(("Remote API"))

node_user -->|"launches"| node_android
node_user -->|"launches"| node_ios
node_android -->|"registers component"| node_entry
node_ios -->|"loads bundle"| node_entry
node_entry -->|"renders"| node_screen
node_store -->|"runs"| node_root_saga
node_store -->|"reduces state"| node_user_slice
node_store -->|"reduces state"| node_token_slice
node_user_slice -->|"request triggers"| node_login_saga
node_login_saga -->|"calls login"| node_http
node_login_saga -->|"updates user state"| node_token_slice
node_http -->|"posts request"| node_api
node_http -->|"uses endpoint"| node_api_urls
node_api -->|"sends request"| node_service
node_api -->|"shows errors"| node_app_utils

click node_entry "https://github.com/hsinghal153/rnfuncsetup/blob/main/index.js"
click node_screen "https://github.com/hsinghal153/rnfuncsetup/blob/main/App.tsx"
click node_android "https://github.com/hsinghal153/rnfuncsetup/blob/main/android/app/src/main/java/com/awesomepr/MainActivity.kt"
click node_ios "https://github.com/hsinghal153/rnfuncsetup/blob/main/ios/AwesomePr/AppDelegate.swift"
click node_store "https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Redux/store.tsx"
click node_user_slice "https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Redux/Slice/userSlice.js"
click node_token_slice "https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Redux/Slice/getToken.js"
click node_root_saga "https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Redux/rootSaga.tsx"
click node_login_saga "https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Redux/Middleware/SagaApi/login.saga.js"
click node_http "https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Util/HTTPRequest.tsx"
click node_api "https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Util/APIKit.tsx"
click node_api_urls "https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Util/Api_Url.tsx"
click node_app_utils "https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Util/AppUtils.tsx"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_entry,node_screen,node_user toneBlue
class node_store,node_user_slice,node_token_slice,node_root_saga,node_login_saga,node_http,node_api,node_api_urls,node_app_utils toneAmber
class node_android,node_ios,node_service toneMint
```

## Components

### App screen

- [JS registration](https://github.com/hsinghal153/rnfuncsetup/blob/main/index.js): `index.js`
- [Starter screen](https://github.com/hsinghal153/rnfuncsetup/blob/main/App.tsx): `App.tsx`

### State and login

- [Redux store](https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Redux/store.tsx): `src/Redux/store.tsx`
- [User request state](https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Redux/Slice/userSlice.js): `src/Redux/Slice/userSlice.js`
- [Token state](https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Redux/Slice/getToken.js): `src/Redux/Slice/getToken.js`
- [Root saga](https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Redux/rootSaga.tsx): `src/Redux/rootSaga.tsx`
- [Login saga](https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Redux/Middleware/SagaApi/login.saga.js): `src/Redux/Middleware/SagaApi/login.saga.js`
- [HTTP requests](https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Util/HTTPRequest.tsx): `src/Util/HTTPRequest.tsx`
- [API client](https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Util/APIKit.tsx): `src/Util/APIKit.tsx`
- [API endpoints](https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Util/Api_Url.tsx): `src/Util/Api_Url.tsx`
- [Error messages](https://github.com/hsinghal153/rnfuncsetup/blob/main/src/Util/AppUtils.tsx): `src/Util/AppUtils.tsx`

### Native launch

- [Android activity](https://github.com/hsinghal153/rnfuncsetup/blob/main/android/app/src/main/java/com/awesomepr/MainActivity.kt): `android/app/src/main/java/com/awesomepr/MainActivity.kt`
- [iOS delegate](https://github.com/hsinghal153/rnfuncsetup/blob/main/ios/AwesomePr/AppDelegate.swift): `ios/AwesomePr/AppDelegate.swift`

### Other components

- **App user**
- **Remote API**

## Connections

- App user → Android activity: launches
- App user → iOS delegate: launches
- Android activity → JS registration: registers component
- iOS delegate → JS registration: loads bundle
- JS registration → Starter screen: renders
- Redux store → Root saga: runs
- Redux store → User request state: reduces state
- Redux store → Token state: reduces state
- User request state → Login saga: request triggers
- Login saga → HTTP requests: calls login
- Login saga → Token state: updates user state
- HTTP requests → API client: posts request
- HTTP requests → API endpoints: uses endpoint
- API client → Remote API: sends request
- API client → Error messages: shows errors