Closed fawzii0x3 closed 1 month ago
@khushal87 yup the new arch is enabled
Hey @fawzii0x3, right now, we haven't tested our SDK with the new architecture. However, it is in our pipeline, and we will pick this up in the weeks to come. Please stay in the loop until then, and feel free to remove the new architecture for now if you want to use the SDK to the best of your capabilities. Thanks 😄
I'm also facing same error , currently using expo 50.0.19, as soon as i import anything from "stream-chat-expo", application is crashing
But i'm not not using expo-router for navigation, i'm creating navigator using "@react-navigation/stack"
`import React, { useContext, useEffect, useState } from "react"; import { createStackNavigator } from "@react-navigation/stack"; import { SafeAreaView } from "react-native-safe-area-context"; import { Stack, YStack } from "tamagui"; import { StreamVideo, StreamVideoClient, User, } from "@stream-io/video-react-native-sdk"; import CardSkeleton from "@components/skeleton/CardSkeleton"; import RoundedSkeleton from "@components/skeleton/RoundedSkeleton"; import BottomNavigation from "./BottomNavigation"; import { ApiContext } from "context/ApiContext"; import VideoCall from "@screens/VideoStream/VideoCall"; import { useQuery } from "react-query"; import { stream_key } from "@utils/globalConstants"; import { StreamChat } from "stream-chat"; import ChatSystem from "@screens/ChatSystem"; import { Chat, OverlayProvider } from "stream-chat-expo";
const UserStack = createStackNavigator();
const AppStack = () => { const apiContext = useContext(ApiContext); if (!apiContext) { throw new Error("ApiContext is not available"); } const { client, userData, setUserData } = apiContext; const chatClient = StreamChat.getInstance(stream_key); const [isLoading, setIsLoading] = useState(true); const [initialRouteName, setInitialRouteName] = useState("BottomNavigation"); const [status, setStatus] = useState(null); const [clientStream, setClient] = useState<StreamVideoClient | null>(null);
const fetchGetStreamToken = async () => {
const response = await client.get(telehealth/session/token
);
return response.data.result;
};
const { data } = useQuery("fetchGetStreamToken", fetchGetStreamToken, { refetchOnMount: true, });
useEffect(() => { const user: User = { id: String(userData?.user?.id ?? "") };
const initializeClient = async () => {
if (!data?.sessionToken) {
console.log("Session token is not available.");
return;
}
try {
const client = new StreamVideoClient({
apiKey: stream_key,
user,
token: data.sessionToken,
});
setClient(client);
if (userData?.streamToken !== data.sessionToken) {
setUserData({
...userData,
streamToken: data.sessionToken,
});
}
} catch (e) {
console.log("Error creating client:", e);
}
};
if (client && data) {
initializeClient();
}
return () => {
if (clientStream) {
clientStream?.disconnectUser();
}
};
}, [client, data]); // React to changes in client or data
return (
Hey @Raghu-M-S, are you on new architecture as well?
@Raghu-M-S install missing dependencies and create a development build to add native modules
Hi @khushal87 , The error is related to usage of nativeTag in gorhom/react-native-bottom-sheet which in is causing the app to crash when using new architecture
They already fixed the issue with this commit and published it in the release 4.6.4.
If gorhom/react-native-bottom-sheet in peer dependencies for this package is update to to version 4.6.4, the issue should be resolved. Should be a small change for you. Or let me know if you want me to open a pull request.
:tada: This issue has been resolved in version 5.36.1 :tada:
The release is available on:
Your semantic-release bot :package::rocket:
Issue
getRefNativeTag error related to https://github.com/gorhom/react-native-bottom-sheet/issues/1438
Expected behavior
Project Related Information
Customization
Click To Expand
```typescript jsx newArchEnabled : true ```
Offline support
Environment
Click To Expand
#### `package.json`: ```json "dependencies": { "@apollo/client": "^3.10.3", "@dev-plugins/apollo-client": "^0.0.6", "@dev-plugins/react-native-mmkv": "^0.0.1", "@gorhom/bottom-sheet": "^4.6.3", "@hookform/resolvers": "^3.4.0", "@react-native-community/datetimepicker": "8.0.1", "@react-native-community/netinfo": "11.3.1", "@react-native-firebase/app": "^20.0.0", "@react-native-firebase/auth": "^20.0.0", "@react-native-firebase/crashlytics": "^20.0.0", "@react-navigation/native": "^6.0.2", "@shopify/flash-list": "1.6.4", "@stream-io/flat-list-mvcp": "^0.10.3", "apollo-upload-client": "^17.0.0", "apollo3-cache-persist": "^0.15.0", "expo": "~51.0.8", "expo-asset": "~10.0.6", "expo-av": "~14.0.5", "expo-battery": "~8.0.1", "expo-blur": "~13.0.2", "expo-build-properties": "~0.12.1", "expo-checkbox": "~3.0.0", "expo-constants": "~16.0.1", "expo-dev-client": "~4.0.14", "expo-document-picker": "~12.0.1", "expo-dynamic-app-icon": "^1.2.0", "expo-file-system": "~17.0.1", "expo-font": "~12.0.5", "expo-haptics": "~13.0.1", "expo-image": "~1.12.9", "expo-image-manipulator": "~12.0.5", "expo-image-picker": "~15.0.5", "expo-linking": "~6.3.1", "expo-localization": "~15.0.3", "expo-location": "~17.0.1", "expo-media-library": "~16.0.3", "expo-router": "~3.5.14", "expo-splash-screen": "~0.27.4", "expo-status-bar": "~1.12.1", "expo-system-ui": "~3.0.4", "expo-updates": "~0.25.14", "expo-web-browser": "~13.0.3", "graphql": "^16.8.1", "i18next": "^23.11.5", "immer": "^10.1.1", "react": "18.2.0", "react-hook-form": "^7.51.4", "react-i18next": "^14.1.1", "react-native": "0.74.1", "react-native-gesture-handler": "~2.16.1", "react-native-maps": "1.14.0", "react-native-mmkv": "^3.0.0-beta.5", "react-native-modal-datetime-picker": "^17.1.0", "react-native-reanimated": "~3.10.1", "react-native-safe-area-context": "4.10.1", "react-native-screens": "3.31.1", "react-native-svg": "15.2.0", "react-native-ui-datepicker": "^2.0.2", "react-native-unistyles": "^2.7.2", "stream-chat-expo": "^5.31.0", "valibot": "^0.30.0", "zustand": "^4.5.2" }, "devDependencies": { "@babel/core": "^7.24.5", "@babel/preset-env": "^7.24.5", "@babel/preset-typescript": "^7.24.1", "@commitlint/cli": "^19.3.0", "@commitlint/config-conventional": "^19.2.2", "@graphql-codegen/add": "^5.0.2", "@graphql-codegen/cli": "^5.0.2", "@graphql-codegen/fragment-matcher": "^5.0.2", "@graphql-codegen/introspection": "^4.0.3", "@graphql-codegen/typescript": "^4.0.7", "@graphql-codegen/typescript-operations": "^4.2.1", "@graphql-codegen/typescript-react-apollo": "^4.3.0", "@testing-library/jest-dom": "^6.4.5", "@testing-library/react": "^15.0.7", "@testing-library/react-hooks": "^8.0.1", "@types/apollo-upload-client": "^17.0.5", "@types/jest": "^29.5.12", "@types/react": "~18.2.79", "@types/react-test-renderer": "^18.0.7", "babel-jest": "^29.7.0", "cross-env": "^7.0.3", "cz-conventional-changelog": "^3.3.0", "eslint": "^8.57.0", "eslint-config-expo": "^7.1.2", "eslint-config-universe": "^12.0.0", "eslint-import-resolver-typescript": "^3.6.1", "eslint-plugin-import": "^2.29.1", "eslint-plugin-react-compiler": "^0.0.0-experimental-c8b3f72-20240517", "husky": "^9.0.11", "jest": "^29.7.0", "jest-expo": "~51.0.2", "prettier": "3.2.5", "react-test-renderer": "18.3.1", "ts-jest": "^29.1.3", "typescript": "~5.3.3" }, ``` **`react-native info` output:** ``` OUTPUT GOES HERE ``` - **Platform that you're experiencing the issue on**: - [ ] iOS - [ ] Android - [x] **iOS** but have not tested behavior on Android - [ ] **Android** but have not tested behavior on iOS - [ ] Both - **`stream-chat-expo` version you're using that has this issue:** - `5.31.0` - Device/Emulator info: - [x] I am using a physical device - OS version: `e.g. Android 10` - Device/Emulator: `e.g. iPhone 11`
Additional context
Screenshots
Click To Expand
![Screenshot](https://github.com/GetStream/stream-chat-react-native/assets/93863937/013db647-94f0-47b9-ae13-4687cec28ae6) ![IMG_9090](https://github.com/GetStream/stream-chat-react-native/assets/93863937/b8a4d00f-c146-4ccc-9081-86455735592d)