From 02fe176fd4bc095cd6819606cc310cc8bc234e91 Mon Sep 17 00:00:00 2001
From: Claire <claire.github-309c@sitedethib.com>
Date: Fri, 3 Jan 2025 22:51:51 +0100
Subject: [PATCH] Fix audio player modal having white-on-white buttons in light
 theme (#33444)

---
 .../mastodon/features/ui/components/audio_modal.jsx | 13 +++++++++++++
 .../mastodon/features/ui/components/video_modal.jsx |  4 ++++
 2 files changed, 17 insertions(+)

diff --git a/app/javascript/mastodon/features/ui/components/audio_modal.jsx b/app/javascript/mastodon/features/ui/components/audio_modal.jsx
index 5baed2b3f9..dfefe689d8 100644
--- a/app/javascript/mastodon/features/ui/components/audio_modal.jsx
+++ b/app/javascript/mastodon/features/ui/components/audio_modal.jsx
@@ -4,6 +4,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import { connect } from 'react-redux';
 
+import { getAverageFromBlurhash } from 'mastodon/blurhash';
 import Audio from 'mastodon/features/audio';
 import Footer from 'mastodon/features/picture_in_picture/components/footer';
 
@@ -26,6 +27,18 @@ class AudioModal extends ImmutablePureComponent {
     onChangeBackgroundColor: PropTypes.func.isRequired,
   };
 
+  componentDidMount () {
+    const { media, onChangeBackgroundColor } = this.props;
+
+    const backgroundColor = getAverageFromBlurhash(media.get('blurhash'));
+
+    onChangeBackgroundColor(backgroundColor || { r: 255, g: 255, b: 255 });
+  }
+
+  componentWillUnmount () {
+    this.props.onChangeBackgroundColor(null);
+  }
+
   render () {
     const { media, status, accountStaticAvatar, onClose } = this.props;
     const options = this.props.options || {};
diff --git a/app/javascript/mastodon/features/ui/components/video_modal.jsx b/app/javascript/mastodon/features/ui/components/video_modal.jsx
index cc166d8bc5..4fc3ee1728 100644
--- a/app/javascript/mastodon/features/ui/components/video_modal.jsx
+++ b/app/javascript/mastodon/features/ui/components/video_modal.jsx
@@ -37,6 +37,10 @@ class VideoModal extends ImmutablePureComponent {
     }
   }
 
+  componentWillUnmount () {
+    this.props.onChangeBackgroundColor(null);
+  }
+
   render () {
     const { media, status, onClose } = this.props;
     const options = this.props.options || {};