I don’t have enough written information to implement the chat. Could you please check my code to see if I have implemented it correctly?
Do I understand correctly that users are automatically added to the chat when they navigate to the chat?
Hello @Kateryna ,We would like to ask you for more information: Which platform and version are you using?
@amitysupport
“@amityco/ui-kit”: “^3.10.1”
“react”: “18.2.0”
When I try add in my project, I have errors
Hello @Kateryna , To help us investigate your issue further, could you please provide the full package.json file? This will allow us to better understand the dependencies and configurations in your project. Thank you!
Hello @Kateryna , For this question, it doesn’t automatically add the user; it only shows the chat window of that channel as the default on the right side. So, you need to call joinChannel first. Please refer to this document for more information: Join/Leave Channel.
This is my json file
{
“name”: “concierge”,
“version”: “0.0.1”,
“private”: true,
“scripts”: {
“android”: “react-native run-android”,
“ios”: “react-native run-ios”,
“start”: “webpack serve --config ./webpack.config.js --mode=development --history-api-fallback”,
“lint”: “eslint . --ext .js,.jsx,.ts,.tsx”,
“deploy:dev”: “npm run build:dev && npx json -I -f firebase.json -e "this.hosting.site=null" && firebase deploy”,
“deploy:prod”: “npm run build:prod && npx json -I -f firebase.json -e "this.hosting.site=‘auslaw-webapp’" && firebase deploy --project=auslaw-concierge && npx json -I -f firebase.json -e "this.hosting.site=null"”,
“build:dev”: “webpack --config ./webpack.config.js --mode=development”,
“build:prod”: “webpack --config ./webpack.config.js --mode=production”,
“prettier”: “prettier . --write”,
“postinstall”: “patch-package”,
“e2e”: “cypress open”
},
“dependencies”: {
“emotion/react”: “^11.11.4”,
“emotion/styled”: “^11.11.5”,
“mui/icons-material”: “^5.14.3”,
“mui/material”: “^5.14.5”,
“mui/x-date-pickers”: “^6.12.0”,
“react-native-picker/picker”: “^2.4.10”,
“react-native-segmented-control/segmented-control”: “^2.4.0”,
“react-navigation/bottom-tabs”: “^6.0.9”,
“react-navigation/elements”: “^1.2.1”,
“react-navigation/native”: “^6.0.6”,
“react-navigation/stack”: “^6.0.11”,
“sentry/react”: “^7.72.0”,
“stripe/react-stripe-js”: “^2.1.2”,
“stripe/stripe-js”: “^2.1.0”,
“types/firebase”: “^3.2.1”,
“types/styled-components”: “^5.1.25”,
“types/styled-components-react-native”: “^5.1.3”,
“amityco/ui-kit”: “^3.10.1”,
“firebase”: “^10.1.0”,
"json": "^11.0.0",
"lodash": "^4.17.21",
"moment": "^2.29.1",
"moment-timezone": "^0.5.45",
"nylas": "^7.5.2",
"patch-package": "^6.4.7",
"postinstall-postinstall": "^2.1.0",
"react": "18.2.0",
"react-dom": "^18.2.0",
"react-google-recaptcha": "^3.1.0",
"react-hook-form": "^7.45.4",
"react-load-script": "^0.0.6",
"react-native": "0.72.3",
"react-native-background-fetch": "^4.0.4",
"react-native-calendar-events": "^2.2.0",
"react-native-collapsible": "^1.6.0",
"react-native-config": "^1.4.5",
"react-native-confirmation-code-field": "^7.1.0",
"react-native-elements": "^3.4.2",
"react-native-gesture-handler": "^1.10.3",
"react-native-get-random-values": "^1.8.0",
"react-native-image-picker": "^4.3.0",
"react-native-inset-shadow": "^1.0.3",
"react-native-keyboard-aware-scroll-view": "^0.9.5",
"react-native-modal": "^13.0.0",
"react-native-modal-datetime-picker": "^13.0.0",
"react-native-permissions": "^3.1.0",
"react-native-reanimated": "^2.2.3",
"react-native-safe-area-context": "^3.3.2",
"react-native-screens": "^3.8.0",
"react-native-sectioned-multi-select": "^0.8.1",
"react-native-splash-screen": "^3.2.0",
"react-native-text-size": "^4.0.0-rc.1",
"react-native-vector-icons": "^9.0.0",
"react-native-web": "^0.19.7",
"react-redux": "^8.1.2",
"redux": "^4.1.1",
"redux-thunk": "^2.4.0",
"styled-components": "^5.3.5",
"toggle-switch-react-native": "^3.3.0",
"use-debounce": "^7.0.0"
},
“devDependencies”: {
“babel/cli”: “^7.22.10”,
“babel/core”: “^7.22.10”,
“babel/preset-env”: “^7.22.10”,
“babel/preset-typescript”: “^7.22.5”,
“babel/runtime”: “^7.12.5”,
“faker-js/faker”: “^8.0.2”,
“react-native-community/eslint-config”: “^2.0.0”,
“sentry/webpack-plugin”: “^2.7.1”,
“testing-library/cypress”: “^10.0.1”,
“types/jest”: “^26.0.23”,
“types/lodash”: “^4.14.176”,
“types/react-google-recaptcha”: “^2.1.9”,
“types/react-native”: “^0.65.0”,
“types/react-test-renderer”: “^18.0.0”,
“babel-jest”: “^26.6.3”,
“babel-loader”: “^9.1.3”,
“babel-plugin-module-resolver”: “^5.0.0”,
“babel-plugin-react-native-web”: “^0.19.7”,
“css-loader”: “^6.8.1”,
“cypress”: “^13.2.0”,
“cypress-plugin-stripe-elements”: “^1.0.2”,
“dotenv”: “^16.3.1”,
“eslint”: “^7.14.0”,
“git-revision-webpack-plugin”: “^5.0.0”,
“html-webpack-plugin”: “^5.5.3”,
“jest”: “^26.6.3”,
“metro-react-native-babel-preset”: “^0.66.2”,
“prettier”: “^3.0.1”,
“react-test-renderer”: “18.2.0”,
“style-loader”: “^3.3.3”,
“typescript”: “^5.1.6”,
“url-loader”: “^4.1.1”,
“webpack”: “^5.88.2”,
“webpack-cli”: “^5.1.4”,
“webpack-dev-server”: “^4.15.1”
},
“resolutions”: {
“types/react”: “^17”
},
“jest”: {
“preset”: “react-native”,
“moduleFileExtensions”: [
“ts”,
“tsx”,
“js”,
“jsx”,
“json”,
“node”
]
}
}
Hello @Kateryna, Thank you for the information provided. Could you please share the link to the repository you are using?
Hello @Kateryna , From our investigation, it appears that the issue is due to using the UIKit for React.js, which is not compatible with React Native.
Hello @amitysupport ,
The project in which I need to implement a chat is developed in React, using React Native packages for design. What could be the solution to add chat Amity to my project?
Hello @Kateryna , Currently, we offer a React Native UIKit for integrating chat into your project. Please refer to the following resources for more information:
If you need any further assistance, feel free to reach out!
Hello, thanks.
I will try to add, in case of questions I will write to you in support.
- git clone GitHub - AmityCo/Amity-Chat-UIKit-React-Native-CLI-OpenSource: Amity Social Cloud offers Chat and Social SDKs to streamline app development. Dive into our UI Kits and sample apps in our repositories to spark your creativity. To learn more, visit amity.co.
- cd Amity-Chat-UIKit-React-Native-CLI-OpenSource
- yarn
- npm pack - When I do this command I get an error.
Hello @Kateryna, let us pass to our team to further check.
Hello @Kateryna , Please try pulling the latest code and try again.