[connectReactNativeChat] fix broken demo app and code cleanup#279
[connectReactNativeChat] fix broken demo app and code cleanup#279spenlep-amzn merged 1 commit intomasterfrom
Conversation
| {/* Header */} | ||
| <View style={styles.headerContainer}> | ||
| <View style={styles.headerContent}> | ||
| <Text style={styles.headerText}>Chat UI Demo - Amazon Connect ChatJS</Text> |
There was a problem hiding this comment.
Recommendation generated by Amazon CodeGuru Reviewer. Leave feedback on this recommendation by replying to the comment or by reacting to the comment using emoji.
JSX element content is not internationalized. Application should support multiple languages through internationalization. Instead, utilize packages like 'i18next' to internationalize your items.
6b62ef8 to
15b5b07
Compare
d1a2299 to
2eb186b
Compare
31240cf to
1862546
Compare
85a6613 to
cdea874
Compare
| "@react-navigation/native": "^6.1.6", | ||
| "@react-navigation/stack": "^6.3.16", | ||
| "amazon-connect-chatjs": ">=1.5.0", | ||
| "amazon-connect-chatjs": ">=1.5.0 <=3.0.2", |
There was a problem hiding this comment.
what is the point of this? does it mean it will use 3.0.2? Lets just put 3.0.2 then
There was a problem hiding this comment.
I think it's best to keep the known-good range, so it's very clear.
Technically, this installs v1.5.0, I've pushed a new commit to manually set 3.0.2 in the package-lock.json, demo app uses 3.0.2 now.
Once we release a fix (e.g. v3.1.1 or greater), then we should follow up and update this demo app to use @latest
Otherwise:
- If we use
3.0.2, the customer has no way of knowing that>=3.0.3is incompatible (until we make fix) - If we use
>=1.5.0, the customer has no way of knowing that>=3.0.3is incompatible (until we make fix) - If we use
<=3.0.2, customer doesn't know that minimum version is 1.5.0 - If we use
*orlatest, that's 3.1.0 which is incompatible
| const packageJson = require('../package.json') | ||
|
|
||
| describe('Package Versions', () => { | ||
| test('core dependencies should match expected versions', () => { |
There was a problem hiding this comment.
what is the point of this file? does it mean every time we change a package, we just need to change this file? the expected versions will change right?
There was a problem hiding this comment.
This is odd pattern yes, but we need it. Expo is very strict about npm dependencies, so I am enforcing known-good versions with these unit tests.
React Native demo app was broken since July, 2024 from PR#218, so this will prevent that from happening. We don't have bandwidth for thorough end-to-end testing, hence why it broke earlier.
It's important to keep this demo app working.. production-ready code is not the goal here. The dependabot/CVE alerts are not a concern, I added this to README "⚠️ This demo code is for example purposes only and should not be used in production without updating dependencies.".
Purpose of the demo app is just boilerplate React Native + ChatJS code. It won't be major concern if Expo is out-dated, customer probably isn't building their mobile app from scratch, they will probably copy/paste code snippets from this app.
…eContext() hook - downgrade ChatJS to known-good version v3.0.2 - ChatJS >= 3.0.3 uses AWS-SDK v3 createParticipantConnection(), which is failing in React Native, solution unknown. - refactor to use useContext() hook // TODO - remove dead code // Will raise follow-up PR Code to keep: ```sh App.js src/ChatContext.js src/ChatContext.test.js src/ChatUI.js src/ChatUI.test.js src/packageJson.test.js ``` Code to delete: ```sh src/utils src/datamodel src/constants src/components src/api endpoints.sample.js config.js ```
cdea874 to
47466ce
Compare
| } | ||
| }); | ||
|
|
||
| // chatSession.onDeepHeartbeatSuccess(() => { |
There was a problem hiding this comment.
why are these functions commented out?
Issue #, if available:
Description of changes:
Fix the React Native demo app. WebSocketManager was broken on mobile, and code was very messy.
This new implementation is robust, including browser-refresh and auto re-connect when the device goes offline/online.
Testing
Tested end-to-end chat on 5/23 ✅
react-native-demo-app-web-testing.mov
end-to-end-android.mov
By submitting this pull request, I confirm that you can use, modify, copy, and redistribute this contribution, under the terms of your choice.