Disable autoplay by default if prefers-reduced-motion (#3671)

2 files changed, 8 insertions, 2 deletions

diff --git a/src/platform/detection.ts b/src/platform/detection.ts
index 150fc1fe3..de4dfc07b 100644
--- a/src/platform/detection.ts
+++ b/src/platform/detection.ts
@@ -1,5 +1,6 @@
 import {Platform} from 'react-native'
 import {getLocales} from 'expo-localization'
+
 import {dedupArray} from 'lib/functions'
 
 export const isIOS = Platform.OS === 'ios'
@@ -18,3 +19,8 @@ export const deviceLocales = dedupArray(
     .map?.(locale => locale.languageCode)
     .filter(code => typeof code === 'string'),
 ) as string[]
+
+export const prefersReducedMotion =
+  isWeb &&
+  // @ts-ignore we know window exists -prf
+  !global.window.matchMedia('(prefers-reduced-motion: no-preference)')?.matches
diff --git a/src/state/persisted/schema.ts b/src/state/persisted/schema.ts
index 4076a582a..714719c2b 100644
--- a/src/state/persisted/schema.ts
+++ b/src/state/persisted/schema.ts
@@ -1,6 +1,6 @@
 import {z} from 'zod'
 
-import {deviceLocales} from '#/platform/detection'
+import {deviceLocales, prefersReducedMotion} from '#/platform/detection'
 
 const externalEmbedOptions = ['show', 'hide'] as const
 
@@ -98,5 +98,5 @@ export const defaults: Schema = {
   lastSelectedHomeFeed: undefined,
   pdsAddressHistory: [],
   disableHaptics: false,
-  disableAutoplay: false,
+  disableAutoplay: prefersReducedMotion,
 }