diff --git a/package.json b/package.json index 500edc4dc3..e426d67d24 100644 --- a/package.json +++ b/package.json @@ -145,6 +145,7 @@ "expo-image-manipulator": "~14.0.7", "expo-image-picker": "~17.0.8", "expo-intent-launcher": "~13.0.7", + "expo-keep-awake": "^15.0.7", "expo-linear-gradient": "~15.0.7", "expo-linking": "~8.0.8", "expo-localization": "~17.0.7", diff --git a/src/components/KeepAwake.tsx b/src/components/KeepAwake.tsx new file mode 100644 index 0000000000..d423656216 --- /dev/null +++ b/src/components/KeepAwake.tsx @@ -0,0 +1,28 @@ +import {useId} from 'react' +import {useKeepAwake} from 'expo-keep-awake' +import {useIsFocused} from '@react-navigation/native' + +/** + * Stops the screen from sleeping. Only applies to the current screen. + * + * Note: Expo keeps the screen permanently awake when in dev mode, so + * you'll only see this do anything when in production. + * + * @platform ios, android + */ +export function KeepAwake({enabled = true}) { + const isFocused = useIsFocused() + if (enabled && isFocused) { + return + } else { + return null + } +} + +function KeepAwakeInner() { + const id = useId() + // if you don't pass an explicit ID, any `useKeepAwake` hook unmounting disables them all. + // very strange behaviour, but easily fixed by passing a unique ID -sfn + useKeepAwake(id) + return null +} diff --git a/src/components/KeepAwake.web.tsx b/src/components/KeepAwake.web.tsx new file mode 100644 index 0000000000..06eb3112ae --- /dev/null +++ b/src/components/KeepAwake.web.tsx @@ -0,0 +1,3 @@ +export function KeepAwake() { + return null +} diff --git a/src/screens/VideoFeed/index.tsx b/src/screens/VideoFeed/index.tsx index a29bb2335a..8ea3e1c623 100644 --- a/src/screens/VideoFeed/index.tsx +++ b/src/screens/VideoFeed/index.tsx @@ -93,6 +93,7 @@ import {ArrowLeft_Stroke2_Corner0_Rounded as ArrowLeftIcon} from '#/components/i import {Check_Stroke2_Corner0_Rounded as CheckIcon} from '#/components/icons/Check' import {EyeSlash_Stroke2_Corner0_Rounded as Eye} from '#/components/icons/EyeSlash' import {Leaf_Stroke2_Corner0_Rounded as LeafIcon} from '#/components/icons/Leaf' +import {KeepAwake} from '#/components/KeepAwake' import * as Layout from '#/components/Layout' import {Link} from '#/components/Link' import {ListFooter} from '#/components/Lists' @@ -150,6 +151,7 @@ export function VideoFeed({}: NativeStackScreenProps< return ( +