@onairos/react-native 3.5.4 → 3.6.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (253) hide show
  1. package/README.md +423 -423
  2. package/lib/commonjs/api/index.js +1 -1
  3. package/lib/commonjs/assets/images/Checkbox.svg +3 -3
  4. package/lib/commonjs/assets/images/EnochE.svg +19 -19
  5. package/lib/commonjs/assets/images/OnairosNewLogo.png +0 -0
  6. package/lib/commonjs/assets/images/Personalityprofile.svg +3 -3
  7. package/lib/commonjs/assets/images/Personalitytraits.svg +3 -3
  8. package/lib/commonjs/assets/images/Userpreferences.svg +3 -3
  9. package/lib/commonjs/assets/images/arrow.svg +20 -20
  10. package/lib/commonjs/assets/images/basicproficon.svg +43 -43
  11. package/lib/commonjs/assets/images/basicprofile.svg +3 -3
  12. package/lib/commonjs/assets/images/checkmark.svg +4 -4
  13. package/lib/commonjs/assets/images/contentanalysis.svg +3 -3
  14. package/lib/commonjs/assets/images/contenticon.svg +23 -23
  15. package/lib/commonjs/assets/images/personalityicon.svg +18 -18
  16. package/lib/commonjs/assets/images/x-close.svg +3 -3
  17. package/lib/commonjs/components/BodyText.js +1 -1
  18. package/lib/commonjs/components/BrandMark.js +1 -1
  19. package/lib/commonjs/components/CodeInput.js +1 -1
  20. package/lib/commonjs/components/EmailInput.js +1 -1
  21. package/lib/commonjs/components/GoogleButton.js +1 -1
  22. package/lib/commonjs/components/HeadingGroup.js +1 -1
  23. package/lib/commonjs/components/LLMDataInputModal.js +1 -1
  24. package/lib/commonjs/components/ModalHeader.js +1 -1
  25. package/lib/commonjs/components/ModalSheet.js +1 -1
  26. package/lib/commonjs/components/Onairos.js +1 -1
  27. package/lib/commonjs/components/OnairosButton.js +1 -1
  28. package/lib/commonjs/components/OnairosSignInButton.js +1 -1
  29. package/lib/commonjs/components/Overlay.js +1 -1
  30. package/lib/commonjs/components/PersonaImage.js +1 -1
  31. package/lib/commonjs/components/PersonaLoadingScreen.js +1 -1
  32. package/lib/commonjs/components/PersonalizationConsentScreen.js +1 -1
  33. package/lib/commonjs/components/PinCreationScreen.js +1 -1
  34. package/lib/commonjs/components/PinInput.js +1 -1
  35. package/lib/commonjs/components/PlatformConnectorsStep.js +3 -2
  36. package/lib/commonjs/components/PlatformList.js +1 -1
  37. package/lib/commonjs/components/PlatformToggle.js +1 -1
  38. package/lib/commonjs/components/PrimaryButton.js +1 -1
  39. package/lib/commonjs/components/SignInMatchAnimation.js +1 -1
  40. package/lib/commonjs/components/SignInStep.js +1 -1
  41. package/lib/commonjs/components/UniversalOnboarding.js +2 -1
  42. package/lib/commonjs/components/VerificationStep.js +1 -1
  43. package/lib/commonjs/components/WelcomeScreen.js +2 -1
  44. package/lib/commonjs/components/icons/Basicproficon.js +1 -1
  45. package/lib/commonjs/components/icons/Basicprofile.js +1 -1
  46. package/lib/commonjs/components/icons/Checkbox.js +1 -1
  47. package/lib/commonjs/components/icons/Checkmark.js +1 -1
  48. package/lib/commonjs/components/icons/Contentanalysis.js +1 -1
  49. package/lib/commonjs/components/icons/Contenticon.js +1 -1
  50. package/lib/commonjs/components/icons/EnochE.js +1 -1
  51. package/lib/commonjs/components/icons/Personalityicon.js +1 -1
  52. package/lib/commonjs/components/icons/Personalityprofile.js +1 -1
  53. package/lib/commonjs/components/icons/Personalitytraits.js +1 -1
  54. package/lib/commonjs/components/icons/Userpreferences.js +1 -1
  55. package/lib/commonjs/components/icons/index.js +1 -1
  56. package/lib/commonjs/components/onboarding/OAuthWebView.js +6 -2
  57. package/lib/commonjs/components/onboarding/OnboardingHeader.js +1 -1
  58. package/lib/commonjs/components/onboarding/PinInput.js +1 -1
  59. package/lib/commonjs/components/onboarding/PlatformConnector.js +1 -1
  60. package/lib/commonjs/config/api.js +1 -1
  61. package/lib/commonjs/constants/index.js +1 -1
  62. package/lib/commonjs/context/AuthContext.js +1 -1
  63. package/lib/commonjs/hooks/useConnectedAccounts.js +1 -1
  64. package/lib/commonjs/hooks/useConnections.js +1 -1
  65. package/lib/commonjs/hooks/useCredentials.js +1 -1
  66. package/lib/commonjs/hooks/useUserConnections.js +1 -1
  67. package/lib/commonjs/index.js +5 -6
  68. package/lib/commonjs/services/SDK_API_KEY_VALIDATION.md +421 -421
  69. package/lib/commonjs/services/apiClient.js +1 -1
  70. package/lib/commonjs/services/apiKeyService.js +1 -1
  71. package/lib/commonjs/services/authService.js +1 -1
  72. package/lib/commonjs/services/biometricPinService.js +1 -1
  73. package/lib/commonjs/services/chatGPTConversationExtractor.js +1 -1
  74. package/lib/commonjs/services/chatGPTConversationService.js +1 -1
  75. package/lib/commonjs/services/claudeConversationExtractor.js +1 -1
  76. package/lib/commonjs/services/claudeConversationService.js +1 -1
  77. package/lib/commonjs/services/connectedAccountsService.js +1 -1
  78. package/lib/commonjs/services/googleAuthService.js +1 -1
  79. package/lib/commonjs/services/hingeDataExtractor.js +8 -0
  80. package/lib/commonjs/services/hingeDataService.js +9 -0
  81. package/lib/commonjs/services/imageCompressionService.js +1 -1
  82. package/lib/commonjs/services/instagramDataExtractor.js +8 -0
  83. package/lib/commonjs/services/instagramDataService.js +9 -0
  84. package/lib/commonjs/services/jwtStorageService.js +1 -1
  85. package/lib/commonjs/services/linkedinDOMExtractor.js +1 -1
  86. package/lib/commonjs/services/linkedinProfileService.js +1 -1
  87. package/lib/commonjs/services/linkedinScrapingService.js +1 -1
  88. package/lib/commonjs/services/llmDataStorage.js +1 -1
  89. package/lib/commonjs/services/mobileTrainingService.js +1 -1
  90. package/lib/commonjs/services/oauthService.js +1 -1
  91. package/lib/commonjs/services/pinEncryptionService.js +1 -1
  92. package/lib/commonjs/services/pinStorageUtils.js +1 -1
  93. package/lib/commonjs/services/platformAuthService.js +1 -1
  94. package/lib/commonjs/services/sephoraDataExtractor.js +8 -0
  95. package/lib/commonjs/services/sephoraDataService.js +9 -0
  96. package/lib/commonjs/services/storageService.js +1 -1
  97. package/lib/commonjs/services/telegramDataExtractor.js +8 -0
  98. package/lib/commonjs/services/telegramDataService.js +9 -0
  99. package/lib/commonjs/services/trainingApiHelpers.js +1 -1
  100. package/lib/commonjs/services/userConnectionsService.js +1 -1
  101. package/lib/commonjs/services/youtubeMigrationService.js +1 -1
  102. package/lib/commonjs/theme/index.js +1 -1
  103. package/lib/commonjs/types/index.js +1 -1
  104. package/lib/commonjs/types.js +1 -1
  105. package/lib/commonjs/utils/Portal.js +1 -1
  106. package/lib/commonjs/utils/api.js +1 -1
  107. package/lib/commonjs/utils/assetRegistry.js +2 -2
  108. package/lib/commonjs/utils/auth.js +1 -1
  109. package/lib/commonjs/utils/connectorTests.js +29 -0
  110. package/lib/commonjs/utils/crypto.js +1 -1
  111. package/lib/commonjs/utils/debugHelper.js +1 -1
  112. package/lib/commonjs/utils/encryption.js +1 -1
  113. package/lib/commonjs/utils/eventUtils.js +1 -1
  114. package/lib/commonjs/utils/haptics.js +1 -1
  115. package/lib/commonjs/utils/imagePreloader.js +1 -1
  116. package/lib/commonjs/utils/networkDiagnostics.js +1 -1
  117. package/lib/commonjs/utils/onairosApi.js +1 -1
  118. package/lib/commonjs/utils/programmaticFlow.js +1 -1
  119. package/lib/commonjs/utils/retryHelper.js +1 -1
  120. package/lib/commonjs/utils/secureStorage.js +1 -1
  121. package/lib/commonjs/utils/webviewScripts/chatgpt.js +1 -1
  122. package/lib/commonjs/utils/webviewScripts/claude.js +1 -1
  123. package/lib/commonjs/utils/webviewScripts/hinge.js +1 -0
  124. package/lib/commonjs/utils/webviewScripts/index.js +6 -2
  125. package/lib/commonjs/utils/webviewScripts/instagram.js +1 -0
  126. package/lib/commonjs/utils/webviewScripts/linkedin.js +1 -1
  127. package/lib/commonjs/utils/webviewScripts/sephora.js +1 -0
  128. package/lib/commonjs/utils/webviewScripts/telegram.js +1 -0
  129. package/lib/module/api/index.js +1 -1
  130. package/lib/module/assets/images/Checkbox.svg +3 -3
  131. package/lib/module/assets/images/EnochE.svg +19 -19
  132. package/lib/module/assets/images/OnairosNewLogo.png +0 -0
  133. package/lib/module/assets/images/Personalityprofile.svg +3 -3
  134. package/lib/module/assets/images/Personalitytraits.svg +3 -3
  135. package/lib/module/assets/images/Userpreferences.svg +3 -3
  136. package/lib/module/assets/images/arrow.svg +20 -20
  137. package/lib/module/assets/images/basicproficon.svg +43 -43
  138. package/lib/module/assets/images/basicprofile.svg +3 -3
  139. package/lib/module/assets/images/checkmark.svg +4 -4
  140. package/lib/module/assets/images/contentanalysis.svg +3 -3
  141. package/lib/module/assets/images/contenticon.svg +23 -23
  142. package/lib/module/assets/images/personalityicon.svg +18 -18
  143. package/lib/module/assets/images/x-close.svg +3 -3
  144. package/lib/module/components/BodyText.js +1 -1
  145. package/lib/module/components/BrandMark.js +1 -1
  146. package/lib/module/components/CodeInput.js +1 -1
  147. package/lib/module/components/EmailInput.js +1 -1
  148. package/lib/module/components/GoogleButton.js +1 -1
  149. package/lib/module/components/HeadingGroup.js +1 -1
  150. package/lib/module/components/LLMDataInputModal.js +1 -1
  151. package/lib/module/components/ModalHeader.js +1 -1
  152. package/lib/module/components/ModalSheet.js +1 -1
  153. package/lib/module/components/Onairos.js +1 -1
  154. package/lib/module/components/OnairosButton.js +1 -1
  155. package/lib/module/components/OnairosSignInButton.js +1 -1
  156. package/lib/module/components/Overlay.js +1 -1
  157. package/lib/module/components/PersonaImage.js +1 -1
  158. package/lib/module/components/PersonaLoadingScreen.js +1 -1
  159. package/lib/module/components/PersonalizationConsentScreen.js +1 -1
  160. package/lib/module/components/PinCreationScreen.js +1 -1
  161. package/lib/module/components/PinInput.js +1 -1
  162. package/lib/module/components/PlatformConnectorsStep.js +7 -1
  163. package/lib/module/components/PlatformList.js +1 -1
  164. package/lib/module/components/PlatformToggle.js +1 -1
  165. package/lib/module/components/PrimaryButton.js +1 -1
  166. package/lib/module/components/SignInMatchAnimation.js +1 -1
  167. package/lib/module/components/SignInStep.js +1 -1
  168. package/lib/module/components/UniversalOnboarding.js +1 -1
  169. package/lib/module/components/VerificationStep.js +1 -1
  170. package/lib/module/components/WelcomeScreen.js +1 -1
  171. package/lib/module/components/icons/Basicproficon.js +1 -1
  172. package/lib/module/components/icons/Basicprofile.js +1 -1
  173. package/lib/module/components/icons/Checkbox.js +1 -1
  174. package/lib/module/components/icons/Checkmark.js +1 -1
  175. package/lib/module/components/icons/Contentanalysis.js +1 -1
  176. package/lib/module/components/icons/Contenticon.js +1 -1
  177. package/lib/module/components/icons/EnochE.js +1 -1
  178. package/lib/module/components/icons/Personalityicon.js +1 -1
  179. package/lib/module/components/icons/Personalityprofile.js +1 -1
  180. package/lib/module/components/icons/Personalitytraits.js +1 -1
  181. package/lib/module/components/icons/Userpreferences.js +1 -1
  182. package/lib/module/components/onboarding/OAuthWebView.js +1 -1
  183. package/lib/module/components/onboarding/OnboardingHeader.js +1 -1
  184. package/lib/module/components/onboarding/PinInput.js +1 -1
  185. package/lib/module/components/onboarding/PlatformConnector.js +1 -1
  186. package/lib/module/config/api.js +1 -1
  187. package/lib/module/constants/index.js +1 -1
  188. package/lib/module/context/AuthContext.js +1 -1
  189. package/lib/module/hooks/useConnectedAccounts.js +1 -1
  190. package/lib/module/hooks/useConnections.js +1 -1
  191. package/lib/module/hooks/useCredentials.js +1 -1
  192. package/lib/module/hooks/useUserConnections.js +1 -1
  193. package/lib/module/index.js +1 -1
  194. package/lib/module/services/SDK_API_KEY_VALIDATION.md +421 -421
  195. package/lib/module/services/apiClient.js +1 -1
  196. package/lib/module/services/apiKeyService.js +1 -1
  197. package/lib/module/services/authService.js +1 -1
  198. package/lib/module/services/biometricPinService.js +1 -1
  199. package/lib/module/services/chatGPTConversationExtractor.js +1 -1
  200. package/lib/module/services/chatGPTConversationService.js +1 -1
  201. package/lib/module/services/claudeConversationExtractor.js +1 -1
  202. package/lib/module/services/claudeConversationService.js +1 -1
  203. package/lib/module/services/connectedAccountsService.js +1 -1
  204. package/lib/module/services/googleAuthService.js +1 -1
  205. package/lib/module/services/hingeDataExtractor.js +1 -0
  206. package/lib/module/services/hingeDataService.js +1 -0
  207. package/lib/module/services/imageCompressionService.js +1 -1
  208. package/lib/module/services/instagramDataExtractor.js +1 -0
  209. package/lib/module/services/instagramDataService.js +1 -0
  210. package/lib/module/services/jwtStorageService.js +1 -1
  211. package/lib/module/services/linkedinDOMExtractor.js +1 -1
  212. package/lib/module/services/linkedinProfileService.js +1 -1
  213. package/lib/module/services/linkedinScrapingService.js +1 -1
  214. package/lib/module/services/llmDataStorage.js +1 -1
  215. package/lib/module/services/mobileTrainingService.js +1 -1
  216. package/lib/module/services/oauthService.js +1 -1
  217. package/lib/module/services/pinEncryptionService.js +1 -1
  218. package/lib/module/services/pinStorageUtils.js +1 -1
  219. package/lib/module/services/platformAuthService.js +1 -1
  220. package/lib/module/services/sephoraDataExtractor.js +1 -0
  221. package/lib/module/services/sephoraDataService.js +1 -0
  222. package/lib/module/services/storageService.js +1 -1
  223. package/lib/module/services/telegramDataExtractor.js +1 -0
  224. package/lib/module/services/telegramDataService.js +1 -0
  225. package/lib/module/services/trainingApiHelpers.js +1 -1
  226. package/lib/module/services/userConnectionsService.js +1 -1
  227. package/lib/module/services/youtubeMigrationService.js +1 -1
  228. package/lib/module/theme/index.js +1 -1
  229. package/lib/module/types.js +1 -1
  230. package/lib/module/utils/Portal.js +1 -1
  231. package/lib/module/utils/api.js +1 -1
  232. package/lib/module/utils/assetRegistry.js +2 -2
  233. package/lib/module/utils/auth.js +1 -1
  234. package/lib/module/utils/connectorTests.js +28 -0
  235. package/lib/module/utils/crypto.js +1 -1
  236. package/lib/module/utils/debugHelper.js +1 -1
  237. package/lib/module/utils/encryption.js +1 -1
  238. package/lib/module/utils/eventUtils.js +1 -1
  239. package/lib/module/utils/haptics.js +1 -1
  240. package/lib/module/utils/networkDiagnostics.js +1 -1
  241. package/lib/module/utils/onairosApi.js +1 -1
  242. package/lib/module/utils/programmaticFlow.js +1 -1
  243. package/lib/module/utils/retryHelper.js +1 -1
  244. package/lib/module/utils/secureStorage.js +1 -1
  245. package/lib/module/utils/webviewScripts/chatgpt.js +1 -1
  246. package/lib/module/utils/webviewScripts/claude.js +1 -1
  247. package/lib/module/utils/webviewScripts/hinge.js +1 -0
  248. package/lib/module/utils/webviewScripts/index.js +1 -1
  249. package/lib/module/utils/webviewScripts/instagram.js +1 -0
  250. package/lib/module/utils/webviewScripts/linkedin.js +1 -1
  251. package/lib/module/utils/webviewScripts/sephora.js +1 -0
  252. package/lib/module/utils/webviewScripts/telegram.js +1 -0
  253. package/package.json +1 -1
package/README.md CHANGED
@@ -1,424 +1,424 @@
1
- # Onairos React Native SDK
2
-
3
- A React Native SDK for integrating Onairos authentication and AI model training into your mobile applications. This package provides a complete solution for social media platform connection, secure authentication, and AI model training.
4
-
5
- ## Features
6
-
7
- - Universal onboarding flow with multi-platform support
8
- - Multi-platform OAuth authentication (Pinterest, YouTube, LinkedIn, Gmail, Reddit)
9
- - Real-time AI model training with Socket.io integration
10
- - Secure credential management with biometric authentication
11
- - PIN-based security with validation and encryption
12
- - Deep linking support for OAuth callbacks
13
- - Email verification and account management
14
- - Existing user detection and data confirmation
15
- - Background training optimization
16
- - Comprehensive error handling and retry logic
17
- - Haptic feedback integration
18
- - Customizable UI components
19
- - Full TypeScript support
20
-
21
- ## Installation
22
-
23
- ```bash
24
- npm install @onairos/react-native
25
- # or
26
- yarn add @onairos/react-native
27
- ```
28
-
29
- ## 🎯 Example App
30
-
31
- A complete example app is available in the `example/` directory demonstrating real-world SDK integration:
32
-
33
- ```bash
34
- cd example
35
- npm install
36
- npm run ios # or npm run android
37
- ```
38
-
39
- The example app showcases:
40
- - ✅ SDK initialization and configuration
41
- - ✅ OnairosButton component integration
42
- - ✅ WelcomeScreen component usage
43
- - ✅ Custom styling options
44
- - ✅ JWT token handling and user data extraction
45
- - ✅ Error handling and debugging
46
-
47
- See [`example/README.md`](./example/README.md) for detailed setup instructions.
48
-
49
- ### TypeScript Support
50
-
51
- The package includes full TypeScript declarations. Import types directly:
52
-
53
- ```typescript
54
- import { OnairosButton, OnairosCredentials, PlatformConfig } from '@onairos/react-native';
55
-
56
- // Type your component props
57
- const MyComponent: React.FC<{ credentials: OnairosCredentials }> = ({ credentials }) => {
58
- // Your component code
59
- };
60
-
61
- // Type your handlers
62
- const handleResolved = (apiUrl: string, accessToken: string, loginDetails: any) => {
63
- console.log('Authentication successful:', { apiUrl, accessToken, loginDetails });
64
- };
65
- ```
66
-
67
- ### Required Dependencies
68
-
69
- The package requires the following dependencies:
70
-
71
- ```bash
72
- # Core dependencies
73
- yarn add @gorhom/bottom-sheet react-native-reanimated react-native-gesture-handler react-native-safe-area-context
74
-
75
- # Authentication dependencies
76
- yarn add react-native-webview react-native-keychain
77
-
78
- # UI dependencies
79
- yarn add react-native-vector-icons
80
-
81
- # Network and encryption
82
- yarn add @react-native-community/netinfo react-native-rsa-native react-native-crypto-js
83
- ```
84
-
85
- ### iOS Setup
86
-
87
- 1. Install pods:
88
- ```bash
89
- cd ios && pod install
90
- ```
91
-
92
- 2. Add the following to your `Info.plist`:
93
- ```xml
94
- <key>CFBundleURLTypes</key>
95
- <array>
96
- <dict>
97
- <key>CFBundleURLSchemes</key>
98
- <array>
99
- <!-- <string>onairosreact</string> -->
100
- <string>onairosanime</string>
101
- </array>
102
- </dict>
103
- </array>
104
-
105
- <!-- Add for biometric authentication -->
106
- <key>NSFaceIDUsageDescription</key>
107
- <string>We use Face ID to securely access your Onairos account</string>
108
- ```
109
-
110
- 3. Configure your OAuth providers in the project settings and register the callback URLs.
111
-
112
- ### Android Setup
113
-
114
- 1. Add the following to your `android/app/src/main/AndroidManifest.xml`:
115
- ```xml
116
- <activity>
117
- <!-- ... -->
118
- <intent-filter>
119
- <action android:name="android.intent.action.VIEW" />
120
- <category android:name="android.intent.category.DEFAULT" />
121
- <category android:name="android.intent.category.BROWSABLE" />
122
- <!-- <data android:scheme="onairosreact" /> -->
123
- <data android:scheme="onairosanime" />
124
- </intent-filter>
125
- </activity>
126
- ```
127
-
128
- 2. Add biometric permissions:
129
- ```xml
130
- <uses-permission android:name="android.permission.USE_BIOMETRIC" />
131
- ```
132
-
133
- ## Usage
134
-
135
- 📖 **[Quick Integration Guide](./QUICK_INTEGRATION_GUIDE.md) - Start here for immediate copy-paste setup!**
136
-
137
- 📖 **For comprehensive usage examples in both JavaScript and TypeScript, see [USAGE_EXAMPLES.md](./USAGE_EXAMPLES.md)**
138
-
139
- ### Important: Setup Portal Host
140
-
141
- For modals and overlays to appear properly, you must wrap your app with the `PortalHost` component:
142
-
143
- ```javascript
144
- import { PortalHost } from '@onairos/react-native';
145
-
146
- export default function App() {
147
- return (
148
- <PortalHost>
149
- {/* Your app content goes here */}
150
- <MainNavigator />
151
- </PortalHost>
152
- );
153
- }
154
- ```
155
-
156
- ### Basic Button Integration
157
-
158
- 1. Import the OnairosButton component:
159
- ```javascript
160
- import { OnairosButton } from '@onairos/react-native';
161
- ```
162
-
163
- 2. Use the component in your app:
164
- ```javascript
165
- export default function App() {
166
- const handleResolved = (apiUrl, accessToken, loginDetails) => {
167
- console.log('Authentication successful:', { apiUrl, accessToken, loginDetails });
168
- // Store the tokens and proceed with your app logic
169
- };
170
-
171
- return (
172
- <View style={styles.container}>
173
- <OnairosButton
174
- AppName="YourApp"
175
- requestData={{
176
- "Social Media": {
177
- "Profile Information": "Access to your basic profile data",
178
- "Post History": "Access to your post history for analysis"
179
- },
180
- "Content": {
181
- "Images": "Access to image data for AI training",
182
- "Text": "Access to text data for AI training"
183
- }
184
- }}
185
- returnLink="your-app://auth-callback"
186
- onResolved={handleResolved}
187
- buttonType="pill"
188
- color="#00BFA5"
189
- />
190
- </View>
191
- );
192
- }
193
- ```
194
-
195
- ### Initialize OAuth Service
196
-
197
- Add this to your app's entry point to handle deep linking for OAuth:
198
-
199
- ```javascript
200
- import { initializeOAuthService } from '@onairos/react-native';
201
-
202
- // In your app's entry point
203
- useEffect(() => {
204
- // Set up OAuth deep linking
205
- initializeOAuthService();
206
-
207
- // Clean up when component unmounts
208
- return () => {
209
- cleanupOAuthService();
210
- };
211
- }, []);
212
- ```
213
-
214
- ### Working with Secure Storage
215
-
216
- ```javascript
217
- import { storeCredentials, getCredentials, hasCredentials } from '@onairos/react-native';
218
-
219
- // Check if user has stored credentials
220
- const checkAuth = async () => {
221
- const hasExisting = await hasCredentials();
222
-
223
- if (hasExisting) {
224
- // Get credentials with biometric authentication
225
- const credentials = await getCredentials({
226
- useBiometrics: true,
227
- biometricPrompt: {
228
- title: 'Authenticate to continue',
229
- subtitle: 'Please verify your identity'
230
- }
231
- });
232
-
233
- if (credentials) {
234
- // User is authenticated
235
- console.log('User authenticated:', credentials.username);
236
- }
237
- } else {
238
- // Redirect to onboarding flow
239
- setShowOnboarding(true);
240
- }
241
- };
242
- ```
243
-
244
- ## API Reference
245
-
246
- ### Main Components
247
-
248
- #### `OnairosButton`
249
-
250
- The main entry point for Onairos authentication with full training flow support.
251
-
252
- | Prop | Type | Required | Description |
253
- |------|------|----------|-------------|
254
- | AppName | string | Yes | Your application name |
255
- | requestData | object | Yes | Platform-specific OAuth scopes and data requests |
256
- | returnLink | string | Yes | Deep link URL for OAuth callback |
257
- | embedd | boolean | No | Whether to use embedded flow (default: false) |
258
- | color | string | No | Button color (default: #00BFA5) |
259
- | icon | string | No | Button icon name (default: 'auto_awesome') |
260
- | onResolved | function | Yes | Callback for successful auth with (apiUrl, accessToken, loginDetails) |
261
- | login | boolean | No | Enable login mode (default: false) |
262
- | buttonType | 'circle' \| 'pill' | No | Button style (default: 'circle') |
263
- | debug | boolean | No | Enable debug mode (default: false) |
264
- | test | boolean | No | Enable test mode (default: false) |
265
-
266
- #### `UniversalOnboarding`
267
-
268
- The universal onboarding flow component.
269
-
270
- | Prop | Type | Required | Description |
271
- |------|------|----------|-------------|
272
- | visible | boolean | Yes | Whether the onboarding is visible |
273
- | onClose | function | Yes | Callback when onboarding is closed |
274
- | AppName | string | Yes | Your application name |
275
- | requestData | object | Yes | Platform-specific OAuth scopes |
276
- | returnLink | string | Yes | Deep link URL for OAuth callback |
277
- | onComplete | function | Yes | Callback when onboarding is complete |
278
- | embedd | boolean | No | Whether to use embedded flow |
279
- | debug | boolean | No | Enable debug mode |
280
- | test | boolean | No | Enable test mode |
281
-
282
- #### `TrainingModal`
283
-
284
- Email authentication and training progress modal.
285
-
286
- | Prop | Type | Required | Description |
287
- |------|------|----------|-------------|
288
- | visible | boolean | Yes | Whether the modal is visible |
289
- | onCancel | function | Yes | Callback when modal is cancelled |
290
- | onComplete | function | Yes | Callback when training is complete |
291
- | modelKey | string | No | Model key for training |
292
- | username | string | No | Username for training |
293
- | isPrimaryAuth | boolean | No | Whether this is primary authentication |
294
- | autoFocusEmailInput | boolean | No | Auto-focus email input on show |
295
-
296
- #### `WelcomeScreen`
297
-
298
- New welcome flow component with modern UI.
299
-
300
- | Prop | Type | Required | Description |
301
- |------|------|----------|-------------|
302
- | visible | boolean | Yes | Whether the screen is visible |
303
- | onClose | function | Yes | Callback when screen is closed |
304
- | onComplete | function | Yes | Callback when flow is complete |
305
-
306
- #### `Overlay`
307
-
308
- Data request overlay component.
309
-
310
- | Prop | Type | Required | Description |
311
- |------|------|----------|-------------|
312
- | visible | boolean | Yes | Whether the overlay is visible |
313
- | onClose | function | Yes | Callback when overlay is closed |
314
- | onAccept | function | Yes | Callback when request is accepted |
315
- | AppName | string | Yes | Your application name |
316
- | requestData | object | Yes | Data being requested |
317
- | biometricType | 'FaceID' \| 'TouchID' \| 'BiometricID' | No | Type of biometric auth to use |
318
-
319
- ### Utility Functions
320
-
321
- #### Secure Storage
322
-
323
- - `storeCredentials(credentials, options)`: Store credentials securely
324
- - `getCredentials(options)`: Retrieve credentials with optional biometric auth
325
- - `hasCredentials()`: Check if user has stored credentials
326
- - `deleteCredentials()`: Delete stored credentials
327
- - `updateCredentials(updates, options)`: Update specific fields in credentials
328
- - `generateDeviceUsername()`: Generate a device-specific unique username
329
- - `verifyCredentials(credentials)`: Verify if credentials are valid
330
-
331
- #### OAuth Service
332
-
333
- - `connectPlatform(platform)`: Initiate OAuth flow for a specific platform
334
- - `disconnectPlatform(platform, credentials)`: Disconnect a platform
335
- - `initializeOAuthService()`: Initialize OAuth service handlers
336
- - `cleanupOAuthService()`: Clean up OAuth service handlers
337
- - `storePlatformConnection(platform, connectionData, credentials)`: Store platform connection
338
-
339
- #### API Communication
340
-
341
- - `validateCredentials(username, options)`: Validate user credentials with the API
342
- - `createAccount(credentials, options)`: Create a new user account
343
- - `authenticate(credentials, options)`: Authenticate with the API using credentials
344
- - `refreshToken(refreshToken, options)`: Refresh authentication token
345
- - `getPlatformData(accessToken, platform, options)`: Get user's connected platform data
346
- - `getUserProfile(accessToken, options)`: Get user profile information
347
- - `updatePlatformConnections(accessToken, platforms, options)`: Update user platform connections
348
-
349
- ## Development and Testing
350
-
351
- ### Setup Development Environment
352
-
353
- 1. Clone the repository:
354
- ```bash
355
- git clone https://github.com/onairos/onairos-react-native.git
356
- cd onairos-react-native
357
- ```
358
-
359
- 2. Install dependencies:
360
- ```bash
361
- yarn install
362
- ```
363
-
364
- 3. Run the typecheck:
365
- ```bash
366
- yarn typecheck
367
- ```
368
-
369
- ### Building the Package
370
-
371
- ```bash
372
- npm run build:all
373
- ```
374
-
375
- ### Testing with a Local App
376
-
377
- 1. Link the package locally:
378
- ```bash
379
- # In your package directory
380
- yarn link
381
-
382
- # In your app directory
383
- yarn link @onairos/react-native
384
- ```
385
-
386
- 2. Run your app and test the integration.
387
-
388
- ## Troubleshooting
389
-
390
- ### OAuth Callback Issues
391
-
392
- - Ensure your deep link schemes are properly configured in both iOS and Android
393
- - Check that the callback URLs match what's registered with your OAuth providers
394
- - Ensure all required permissions are enabled in your app configurations
395
-
396
- ### Biometric Authentication Issues
397
-
398
- - Ensure proper permissions are set in Info.plist and AndroidManifest.xml
399
- - Test on physical devices as simulators may not support all biometric features
400
- - For iOS, ensure that Face ID/Touch ID is enabled and set up on the device
401
-
402
- ### Platform Specific Issues
403
-
404
- #### iOS
405
-
406
- - For keychain issues, check that the Keychain Sharing capability is enabled
407
- - Ensure the bundle identifier is consistent with your OAuth configuration
408
-
409
- #### Android
410
-
411
- - For deep linking issues, check the androidManifest.xml configuration
412
- - Ensure that biometric hardware is available on test devices
413
-
414
- ## Contributing
415
-
416
- 1. Fork the repository
417
- 2. Create your feature branch (`git checkout -b feature/amazing-feature`)
418
- 3. Commit your changes (`git commit -m 'Add some amazing feature'`)
419
- 4. Push to the branch (`git push origin feature/amazing-feature`)
420
- 5. Open a Pull Request
421
-
422
- ## License
423
-
1
+ # Onairos React Native SDK
2
+
3
+ A React Native SDK for integrating Onairos authentication and AI model training into your mobile applications. This package provides a complete solution for social media platform connection, secure authentication, and AI model training.
4
+
5
+ ## Features
6
+
7
+ - Universal onboarding flow with multi-platform support
8
+ - Multi-platform OAuth authentication (Pinterest, YouTube, LinkedIn, Gmail, Reddit)
9
+ - Real-time AI model training with Socket.io integration
10
+ - Secure credential management with biometric authentication
11
+ - PIN-based security with validation and encryption
12
+ - Deep linking support for OAuth callbacks
13
+ - Email verification and account management
14
+ - Existing user detection and data confirmation
15
+ - Background training optimization
16
+ - Comprehensive error handling and retry logic
17
+ - Haptic feedback integration
18
+ - Customizable UI components
19
+ - Full TypeScript support
20
+
21
+ ## Installation
22
+
23
+ ```bash
24
+ npm install @onairos/react-native
25
+ # or
26
+ yarn add @onairos/react-native
27
+ ```
28
+
29
+ ## 🎯 Example App
30
+
31
+ A complete example app is available in the `example/` directory demonstrating real-world SDK integration:
32
+
33
+ ```bash
34
+ cd example
35
+ npm install
36
+ npm run ios # or npm run android
37
+ ```
38
+
39
+ The example app showcases:
40
+ - ✅ SDK initialization and configuration
41
+ - ✅ OnairosButton component integration
42
+ - ✅ WelcomeScreen component usage
43
+ - ✅ Custom styling options
44
+ - ✅ JWT token handling and user data extraction
45
+ - ✅ Error handling and debugging
46
+
47
+ See [`example/README.md`](./example/README.md) for detailed setup instructions.
48
+
49
+ ### TypeScript Support
50
+
51
+ The package includes full TypeScript declarations. Import types directly:
52
+
53
+ ```typescript
54
+ import { OnairosButton, OnairosCredentials, PlatformConfig } from '@onairos/react-native';
55
+
56
+ // Type your component props
57
+ const MyComponent: React.FC<{ credentials: OnairosCredentials }> = ({ credentials }) => {
58
+ // Your component code
59
+ };
60
+
61
+ // Type your handlers
62
+ const handleResolved = (apiUrl: string, accessToken: string, loginDetails: any) => {
63
+ console.log('Authentication successful:', { apiUrl, accessToken, loginDetails });
64
+ };
65
+ ```
66
+
67
+ ### Required Dependencies
68
+
69
+ The package requires the following dependencies:
70
+
71
+ ```bash
72
+ # Core dependencies
73
+ yarn add @gorhom/bottom-sheet react-native-reanimated react-native-gesture-handler react-native-safe-area-context
74
+
75
+ # Authentication dependencies
76
+ yarn add react-native-webview react-native-keychain
77
+
78
+ # UI dependencies
79
+ yarn add react-native-vector-icons
80
+
81
+ # Network and encryption
82
+ yarn add @react-native-community/netinfo react-native-rsa-native react-native-crypto-js
83
+ ```
84
+
85
+ ### iOS Setup
86
+
87
+ 1. Install pods:
88
+ ```bash
89
+ cd ios && pod install
90
+ ```
91
+
92
+ 2. Add the following to your `Info.plist`:
93
+ ```xml
94
+ <key>CFBundleURLTypes</key>
95
+ <array>
96
+ <dict>
97
+ <key>CFBundleURLSchemes</key>
98
+ <array>
99
+ <!-- <string>onairosreact</string> -->
100
+ <string>onairosanime</string>
101
+ </array>
102
+ </dict>
103
+ </array>
104
+
105
+ <!-- Add for biometric authentication -->
106
+ <key>NSFaceIDUsageDescription</key>
107
+ <string>We use Face ID to securely access your Onairos account</string>
108
+ ```
109
+
110
+ 3. Configure your OAuth providers in the project settings and register the callback URLs.
111
+
112
+ ### Android Setup
113
+
114
+ 1. Add the following to your `android/app/src/main/AndroidManifest.xml`:
115
+ ```xml
116
+ <activity>
117
+ <!-- ... -->
118
+ <intent-filter>
119
+ <action android:name="android.intent.action.VIEW" />
120
+ <category android:name="android.intent.category.DEFAULT" />
121
+ <category android:name="android.intent.category.BROWSABLE" />
122
+ <!-- <data android:scheme="onairosreact" /> -->
123
+ <data android:scheme="onairosanime" />
124
+ </intent-filter>
125
+ </activity>
126
+ ```
127
+
128
+ 2. Add biometric permissions:
129
+ ```xml
130
+ <uses-permission android:name="android.permission.USE_BIOMETRIC" />
131
+ ```
132
+
133
+ ## Usage
134
+
135
+ 📖 **[Quick Integration Guide](./QUICK_INTEGRATION_GUIDE.md) - Start here for immediate copy-paste setup!**
136
+
137
+ 📖 **For comprehensive usage examples in both JavaScript and TypeScript, see [USAGE_EXAMPLES.md](./USAGE_EXAMPLES.md)**
138
+
139
+ ### Important: Setup Portal Host
140
+
141
+ For modals and overlays to appear properly, you must wrap your app with the `PortalHost` component:
142
+
143
+ ```javascript
144
+ import { PortalHost } from '@onairos/react-native';
145
+
146
+ export default function App() {
147
+ return (
148
+ <PortalHost>
149
+ {/* Your app content goes here */}
150
+ <MainNavigator />
151
+ </PortalHost>
152
+ );
153
+ }
154
+ ```
155
+
156
+ ### Basic Button Integration
157
+
158
+ 1. Import the OnairosButton component:
159
+ ```javascript
160
+ import { OnairosButton } from '@onairos/react-native';
161
+ ```
162
+
163
+ 2. Use the component in your app:
164
+ ```javascript
165
+ export default function App() {
166
+ const handleResolved = (apiUrl, accessToken, loginDetails) => {
167
+ console.log('Authentication successful:', { apiUrl, accessToken, loginDetails });
168
+ // Store the tokens and proceed with your app logic
169
+ };
170
+
171
+ return (
172
+ <View style={styles.container}>
173
+ <OnairosButton
174
+ AppName="YourApp"
175
+ requestData={{
176
+ "Social Media": {
177
+ "Profile Information": "Access to your basic profile data",
178
+ "Post History": "Access to your post history for analysis"
179
+ },
180
+ "Content": {
181
+ "Images": "Access to image data for AI training",
182
+ "Text": "Access to text data for AI training"
183
+ }
184
+ }}
185
+ returnLink="your-app://auth-callback"
186
+ onResolved={handleResolved}
187
+ buttonType="pill"
188
+ color="#00BFA5"
189
+ />
190
+ </View>
191
+ );
192
+ }
193
+ ```
194
+
195
+ ### Initialize OAuth Service
196
+
197
+ Add this to your app's entry point to handle deep linking for OAuth:
198
+
199
+ ```javascript
200
+ import { initializeOAuthService } from '@onairos/react-native';
201
+
202
+ // In your app's entry point
203
+ useEffect(() => {
204
+ // Set up OAuth deep linking
205
+ initializeOAuthService();
206
+
207
+ // Clean up when component unmounts
208
+ return () => {
209
+ cleanupOAuthService();
210
+ };
211
+ }, []);
212
+ ```
213
+
214
+ ### Working with Secure Storage
215
+
216
+ ```javascript
217
+ import { storeCredentials, getCredentials, hasCredentials } from '@onairos/react-native';
218
+
219
+ // Check if user has stored credentials
220
+ const checkAuth = async () => {
221
+ const hasExisting = await hasCredentials();
222
+
223
+ if (hasExisting) {
224
+ // Get credentials with biometric authentication
225
+ const credentials = await getCredentials({
226
+ useBiometrics: true,
227
+ biometricPrompt: {
228
+ title: 'Authenticate to continue',
229
+ subtitle: 'Please verify your identity'
230
+ }
231
+ });
232
+
233
+ if (credentials) {
234
+ // User is authenticated
235
+ console.log('User authenticated:', credentials.username);
236
+ }
237
+ } else {
238
+ // Redirect to onboarding flow
239
+ setShowOnboarding(true);
240
+ }
241
+ };
242
+ ```
243
+
244
+ ## API Reference
245
+
246
+ ### Main Components
247
+
248
+ #### `OnairosButton`
249
+
250
+ The main entry point for Onairos authentication with full training flow support.
251
+
252
+ | Prop | Type | Required | Description |
253
+ |------|------|----------|-------------|
254
+ | AppName | string | Yes | Your application name |
255
+ | requestData | object | Yes | Platform-specific OAuth scopes and data requests |
256
+ | returnLink | string | Yes | Deep link URL for OAuth callback |
257
+ | embedd | boolean | No | Whether to use embedded flow (default: false) |
258
+ | color | string | No | Button color (default: #00BFA5) |
259
+ | icon | string | No | Button icon name (default: 'auto_awesome') |
260
+ | onResolved | function | Yes | Callback for successful auth with (apiUrl, accessToken, loginDetails) |
261
+ | login | boolean | No | Enable login mode (default: false) |
262
+ | buttonType | 'circle' \| 'pill' | No | Button style (default: 'circle') |
263
+ | debug | boolean | No | Enable debug mode (default: false) |
264
+ | test | boolean | No | Enable test mode (default: false) |
265
+
266
+ #### `UniversalOnboarding`
267
+
268
+ The universal onboarding flow component.
269
+
270
+ | Prop | Type | Required | Description |
271
+ |------|------|----------|-------------|
272
+ | visible | boolean | Yes | Whether the onboarding is visible |
273
+ | onClose | function | Yes | Callback when onboarding is closed |
274
+ | AppName | string | Yes | Your application name |
275
+ | requestData | object | Yes | Platform-specific OAuth scopes |
276
+ | returnLink | string | Yes | Deep link URL for OAuth callback |
277
+ | onComplete | function | Yes | Callback when onboarding is complete |
278
+ | embedd | boolean | No | Whether to use embedded flow |
279
+ | debug | boolean | No | Enable debug mode |
280
+ | test | boolean | No | Enable test mode |
281
+
282
+ #### `TrainingModal`
283
+
284
+ Email authentication and training progress modal.
285
+
286
+ | Prop | Type | Required | Description |
287
+ |------|------|----------|-------------|
288
+ | visible | boolean | Yes | Whether the modal is visible |
289
+ | onCancel | function | Yes | Callback when modal is cancelled |
290
+ | onComplete | function | Yes | Callback when training is complete |
291
+ | modelKey | string | No | Model key for training |
292
+ | username | string | No | Username for training |
293
+ | isPrimaryAuth | boolean | No | Whether this is primary authentication |
294
+ | autoFocusEmailInput | boolean | No | Auto-focus email input on show |
295
+
296
+ #### `WelcomeScreen`
297
+
298
+ New welcome flow component with modern UI.
299
+
300
+ | Prop | Type | Required | Description |
301
+ |------|------|----------|-------------|
302
+ | visible | boolean | Yes | Whether the screen is visible |
303
+ | onClose | function | Yes | Callback when screen is closed |
304
+ | onComplete | function | Yes | Callback when flow is complete |
305
+
306
+ #### `Overlay`
307
+
308
+ Data request overlay component.
309
+
310
+ | Prop | Type | Required | Description |
311
+ |------|------|----------|-------------|
312
+ | visible | boolean | Yes | Whether the overlay is visible |
313
+ | onClose | function | Yes | Callback when overlay is closed |
314
+ | onAccept | function | Yes | Callback when request is accepted |
315
+ | AppName | string | Yes | Your application name |
316
+ | requestData | object | Yes | Data being requested |
317
+ | biometricType | 'FaceID' \| 'TouchID' \| 'BiometricID' | No | Type of biometric auth to use |
318
+
319
+ ### Utility Functions
320
+
321
+ #### Secure Storage
322
+
323
+ - `storeCredentials(credentials, options)`: Store credentials securely
324
+ - `getCredentials(options)`: Retrieve credentials with optional biometric auth
325
+ - `hasCredentials()`: Check if user has stored credentials
326
+ - `deleteCredentials()`: Delete stored credentials
327
+ - `updateCredentials(updates, options)`: Update specific fields in credentials
328
+ - `generateDeviceUsername()`: Generate a device-specific unique username
329
+ - `verifyCredentials(credentials)`: Verify if credentials are valid
330
+
331
+ #### OAuth Service
332
+
333
+ - `connectPlatform(platform)`: Initiate OAuth flow for a specific platform
334
+ - `disconnectPlatform(platform, credentials)`: Disconnect a platform
335
+ - `initializeOAuthService()`: Initialize OAuth service handlers
336
+ - `cleanupOAuthService()`: Clean up OAuth service handlers
337
+ - `storePlatformConnection(platform, connectionData, credentials)`: Store platform connection
338
+
339
+ #### API Communication
340
+
341
+ - `validateCredentials(username, options)`: Validate user credentials with the API
342
+ - `createAccount(credentials, options)`: Create a new user account
343
+ - `authenticate(credentials, options)`: Authenticate with the API using credentials
344
+ - `refreshToken(refreshToken, options)`: Refresh authentication token
345
+ - `getPlatformData(accessToken, platform, options)`: Get user's connected platform data
346
+ - `getUserProfile(accessToken, options)`: Get user profile information
347
+ - `updatePlatformConnections(accessToken, platforms, options)`: Update user platform connections
348
+
349
+ ## Development and Testing
350
+
351
+ ### Setup Development Environment
352
+
353
+ 1. Clone the repository:
354
+ ```bash
355
+ git clone https://github.com/onairos/onairos-react-native.git
356
+ cd onairos-react-native
357
+ ```
358
+
359
+ 2. Install dependencies:
360
+ ```bash
361
+ yarn install
362
+ ```
363
+
364
+ 3. Run the typecheck:
365
+ ```bash
366
+ yarn typecheck
367
+ ```
368
+
369
+ ### Building the Package
370
+
371
+ ```bash
372
+ npm run build:all
373
+ ```
374
+
375
+ ### Testing with a Local App
376
+
377
+ 1. Link the package locally:
378
+ ```bash
379
+ # In your package directory
380
+ yarn link
381
+
382
+ # In your app directory
383
+ yarn link @onairos/react-native
384
+ ```
385
+
386
+ 2. Run your app and test the integration.
387
+
388
+ ## Troubleshooting
389
+
390
+ ### OAuth Callback Issues
391
+
392
+ - Ensure your deep link schemes are properly configured in both iOS and Android
393
+ - Check that the callback URLs match what's registered with your OAuth providers
394
+ - Ensure all required permissions are enabled in your app configurations
395
+
396
+ ### Biometric Authentication Issues
397
+
398
+ - Ensure proper permissions are set in Info.plist and AndroidManifest.xml
399
+ - Test on physical devices as simulators may not support all biometric features
400
+ - For iOS, ensure that Face ID/Touch ID is enabled and set up on the device
401
+
402
+ ### Platform Specific Issues
403
+
404
+ #### iOS
405
+
406
+ - For keychain issues, check that the Keychain Sharing capability is enabled
407
+ - Ensure the bundle identifier is consistent with your OAuth configuration
408
+
409
+ #### Android
410
+
411
+ - For deep linking issues, check the androidManifest.xml configuration
412
+ - Ensure that biometric hardware is available on test devices
413
+
414
+ ## Contributing
415
+
416
+ 1. Fork the repository
417
+ 2. Create your feature branch (`git checkout -b feature/amazing-feature`)
418
+ 3. Commit your changes (`git commit -m 'Add some amazing feature'`)
419
+ 4. Push to the branch (`git push origin feature/amazing-feature`)
420
+ 5. Open a Pull Request
421
+
422
+ ## License
423
+
424
424
  MIT