From 24da3a8f4e81e0f7694b02545711536414dcd17a Mon Sep 17 00:00:00 2001
From: dan <dan.abramov@gmail.com>
Date: Wed, 24 Apr 2024 01:07:18 +0100
Subject: [PATCH] Disable autoplay by default if prefers-reduced-motion (#3671)

---
 src/platform/detection.ts     | 6 ++++++
 src/state/persisted/schema.ts | 4 ++--
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/platform/detection.ts b/src/platform/detection.ts
index 150fc1fe33..de4dfc07b9 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 4076a582aa..714719c2bc 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,
 }