From 216b913ccd0a7dfe0d03575f842aac9711ef0216 Mon Sep 17 00:00:00 2001
From: MAZE <remvze@proton.me>
Date: Sun, 28 Jan 2024 15:40:51 +0330
Subject: [PATCH] fix: add media session

---
 src/components/app/app.tsx | 25 +++++++++++++++++++++++++
 1 file changed, 25 insertions(+)

diff --git a/src/components/app/app.tsx b/src/components/app/app.tsx
index df72255..4f5285c 100644
--- a/src/components/app/app.tsx
+++ b/src/components/app/app.tsx
@@ -23,6 +23,9 @@ export function App() {
   const categories = useMemo(() => sounds.categories, []);
 
   const favorites = useSoundStore(useShallow(state => state.getFavorites()));
+  const play = useSoundStore(state => state.play);
+  const pause = useSoundStore(state => state.pause);
+  const isPlaying = useSoundStore(state => state.isPlaying);
 
   const favoriteSounds = useMemo(() => {
     const favoriteSounds = categories
@@ -58,6 +61,28 @@ export function App() {
     unmuteAudio();
   }, []);
 
+  useEffect(() => {
+    try {
+      navigator.mediaSession.setActionHandler('play', play);
+      navigator.mediaSession.setActionHandler('pause', pause);
+      navigator.mediaSession.setActionHandler('stop', pause);
+    } catch (error) {
+      console.log('Media session is no supported yet');
+    }
+  }, [play, pause]);
+
+  useEffect(() => {
+    if (isPlaying) {
+      navigator.mediaSession.metadata = new MediaMetadata({
+        title: 'Moodist',
+      });
+
+      navigator.mediaSession.playbackState = 'playing';
+    } else {
+      navigator.mediaSession.playbackState = 'paused';
+    }
+  }, [isPlaying]);
+
   const allCategories = useMemo(() => {
     const favorites = [];