diff --git a/js/app/app.config.ts b/js/app/app.config.ts index e6d33f363..f9673be53 100644 --- a/js/app/app.config.ts +++ b/js/app/app.config.ts @@ -196,6 +196,7 @@ export default function () { plugins: [ withAndroidProfileable, "expo-video", + "expo-image", "expo-web-browser", "expo-screen-orientation", streamplaceReactNativeWebRTC, diff --git a/js/app/components/home/cards.tsx b/js/app/components/home/cards.tsx index 293b77039..4ac2f0910 100644 --- a/js/app/components/home/cards.tsx +++ b/js/app/components/home/cards.tsx @@ -1,7 +1,8 @@ import { LiquidGlassView } from "@callstack/liquid-glass"; import { PlayerUI, Text, useTheme, zero } from "@streamplace/components"; +import { Image } from "expo-image"; import useStreamplaceNode from "hooks/useStreamplaceNode"; -import { Image, Platform, View } from "react-native"; +import { Platform, View } from "react-native"; export type StreamCardSize = "xs" | "sm" | "md" | "lg" | "xl"; @@ -77,13 +78,13 @@ const StreamCard = ({ ]} > {isLive && ( )} @@ -155,7 +156,7 @@ const StreamCard = ({ key="avatar" source={require("./../../assets/images/goose.png")} style={{ width: "100%", height: "100%" }} - resizeMode="cover" + contentFit="cover" /> )} diff --git a/js/app/package.json b/js/app/package.json index 7a957a2f3..f873404e7 100644 --- a/js/app/package.json +++ b/js/app/package.json @@ -65,6 +65,7 @@ "expo-dev-client": "~55.0.10", "expo-file-system": "~55.0.10", "expo-font": "~55.0.4", + "expo-image": "^55.0.6", "expo-keep-awake": "~55.0.4", "expo-linking": "~55.0.7", "expo-localization": "^55.0.8", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 814f1bfbc..a8e5827b5 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -156,6 +156,9 @@ importers: expo-font: specifier: ~55.0.4 version: 55.0.4(expo@55.0.5)(react-native@0.83.2(@babel/core@7.26.0)(@types/react@19.2.14)(bufferutil@4.0.8)(react@19.2.0)(utf-8-validate@5.0.10))(react@19.2.0) + expo-image: + specifier: ^55.0.6 + version: 55.0.6(expo@55.0.5)(react-native-web@0.21.2(encoding@0.1.13)(react-dom@19.2.0(react@19.2.0))(react@19.2.0))(react-native@0.83.2(@babel/core@7.26.0)(@types/react@19.2.14)(bufferutil@4.0.8)(react@19.2.0)(utf-8-validate@5.0.10))(react@19.2.0) expo-keep-awake: specifier: ~55.0.4 version: 55.0.4(expo@55.0.5)(react@19.2.0) @@ -7386,6 +7389,17 @@ packages: react: '*' react-native: '*' + expo-image@55.0.6: + resolution: {integrity: sha512-TKuu0uBmgTZlhd91Glv+V4vSBMlfl0bdQxfl97oKKZUo3OBC13l3eLik7v3VNLJN7PZbiwOAiXkZkqSOBx/Xsw==} + peerDependencies: + expo: '*' + react: '*' + react-native: '*' + react-native-web: '*' + peerDependenciesMeta: + react-native-web: + optional: true + expo-json-utils@55.0.0: resolution: {integrity: sha512-aupt/o5PDAb8dXDCb0JcRdkqnTLxe/F+La7jrnyd/sXlYFfRgBJLFOa1SqVFXm1E/Xam1SE/yw6eAb+DGY7Arg==} @@ -22642,6 +22656,15 @@ snapshots: react: 19.2.0 react-native: 0.83.2(@babel/core@7.26.0)(@types/react@19.2.14)(bufferutil@4.0.8)(react@19.2.0)(utf-8-validate@5.0.10) + expo-image@55.0.6(expo@55.0.5)(react-native-web@0.21.2(encoding@0.1.13)(react-dom@19.2.0(react@19.2.0))(react@19.2.0))(react-native@0.83.2(@babel/core@7.26.0)(@types/react@19.2.14)(bufferutil@4.0.8)(react@19.2.0)(utf-8-validate@5.0.10))(react@19.2.0): + dependencies: + expo: 55.0.5(@babel/core@7.26.0)(@expo/dom-webview@55.0.3)(@expo/metro-runtime@55.0.6)(bufferutil@4.0.8)(react-dom@19.2.0(react@19.2.0))(react-native-webview@13.16.0(react-native@0.83.2(@babel/core@7.26.0)(@types/react@19.2.14)(bufferutil@4.0.8)(react@19.2.0)(utf-8-validate@5.0.10))(react@19.2.0))(react-native@0.83.2(@babel/core@7.26.0)(@types/react@19.2.14)(bufferutil@4.0.8)(react@19.2.0)(utf-8-validate@5.0.10))(react@19.2.0)(typescript@5.9.3)(utf-8-validate@5.0.10) + react: 19.2.0 + react-native: 0.83.2(@babel/core@7.26.0)(@types/react@19.2.14)(bufferutil@4.0.8)(react@19.2.0)(utf-8-validate@5.0.10) + sf-symbols-typescript: 2.2.0 + optionalDependencies: + react-native-web: 0.21.2(encoding@0.1.13)(react-dom@19.2.0(react@19.2.0))(react@19.2.0) + expo-json-utils@55.0.0: {} expo-keep-awake@55.0.4(expo@55.0.5)(react@19.2.0):