diff --git a/examples/mobile-client/fishjam-chat/app/room/preview.tsx b/examples/mobile-client/fishjam-chat/app/room/preview.tsx index 82b5c47c..59843de3 100644 --- a/examples/mobile-client/fishjam-chat/app/room/preview.tsx +++ b/examples/mobile-client/fishjam-chat/app/room/preview.tsx @@ -12,6 +12,7 @@ import { } from "@fishjam-cloud/react-native-client"; import { Button, InCallButton, NoCameraView } from "../../components"; +import { useMediaPermissions } from "../../hooks/useMediaPermissions"; import { BrandColors } from "../../utils/Colors"; export default function PreviewScreen() { @@ -29,6 +30,8 @@ export default function PreviewScreen() { useMicrophone(); const { joinRoom, leaveRoom } = useConnection(); + const { permissionsGranted, openSettings } = useMediaPermissions(); + const [isInitialized, setIsInitialized] = useState(false); const [isJoining, setIsJoining] = useState(false); const [error, setError] = useState(null); @@ -36,6 +39,8 @@ export default function PreviewScreen() { const hasJoinedRef = useRef(false); useEffect(() => { + if (!permissionsGranted) return; + const setup = async () => { try { await initializeDevices({ enableVideo: true, enableAudio: true }); @@ -61,7 +66,7 @@ export default function PreviewScreen() { } }; // eslint-disable-next-line react-hooks/exhaustive-deps - }, []); + }, [permissionsGranted]); const handleJoinRoom = useCallback(async () => { try { @@ -101,8 +106,24 @@ export default function PreviewScreen() { {!isInitialized ? ( - - Initializing camera... + {permissionsGranted === false ? ( + + Permissions denied. Please grant camera and microphone access in + settings. + + ) : ( + <> + + + {permissionsGranted === null + ? "Requesting permissions..." + : "Initializing camera..."} + + + )} ) : cameraStream ? ( -