From 8e4d0531e0e9aaf4e52b3b3a8666b74ff0c0222e Mon Sep 17 00:00:00 2001
From: MAZE <remvze@proton.me>
Date: Sun, 28 Jan 2024 14:44:31 +0330
Subject: [PATCH] fix: resume audio

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

diff --git a/src/components/app/app.tsx b/src/components/app/app.tsx
index aa4d138..e398562 100644
--- a/src/components/app/app.tsx
+++ b/src/components/app/app.tsx
@@ -1,6 +1,7 @@
-import { useMemo } from 'react';
+import { useMemo, useEffect } from 'react';
 import { useShallow } from 'zustand/react/shallow';
 import { BiSolidHeart } from 'react-icons/bi/index';
+import { Howler } from 'howler';
 
 import { useSoundStore } from '@/store';
 
@@ -36,6 +37,22 @@ export function App() {
     );
   }, [favorites, categories]);
 
+  useEffect(() => {
+    const onChange = () => {
+      const { ctx } = Howler;
+
+      if (ctx && !document.hidden) {
+        setTimeout(() => {
+          ctx.resume();
+        }, 100);
+      }
+    };
+
+    document.addEventListener('visibilitychange', onChange, false);
+
+    return () => document.removeEventListener('visibilitychange', onChange);
+  }, []);
+
   const allCategories = useMemo(() => {
     const favorites = [];