🐛 fix: pwa-install cause mobile infinity scroll (#7521)

* 🐛 fix: pwa-install cause mobile infinity scroll #7408

* 🐛 fix: use dismiss install pws still render pws-install

src/features/PWAInstall/index.tsx

@@ -1,9 +1,12 @@
 'use client';
 
 import dynamic from 'next/dynamic';
-import { memo } from 'react';
+import { pwaInstallHandler } from 'pwa-install-handler';
+import { memo, useEffect, useState } from 'react';
 
 import { usePlatform } from '@/hooks/usePlatform';
+import { useGlobalStore } from '@/store/global';
+import { systemStatusSelectors } from '@/store/global/selectors';
 import { useUserStore } from '@/store/user';
 
 const Install: any = dynamic(() => import('./Install'), {
@@ -13,8 +16,28 @@ const Install: any = dynamic(() => import('./Install'), {
 const PWAInstall = memo(() => {
   const { isPWA, isSupportInstallPWA } = usePlatform();
   const isShowPWAGuide = useUserStore((s) => s.isShowPWAGuide);
+  const hidePWAInstaller = useGlobalStore((s) => systemStatusSelectors.hidePWAInstaller(s));
+  const [canInstallFromPWAInstallHandler, setCanInstallFromPWAInstallHandler] = useState<
+    boolean | undefined
+  >();
 
-  if (isPWA || !isShowPWAGuide || !isSupportInstallPWA) return null;
+  useEffect(() => {
+    pwaInstallHandler.addListener((canInstall) => {
+      setCanInstallFromPWAInstallHandler(canInstall);
+    });
+    return () => {
+      pwaInstallHandler.removeListener(setCanInstallFromPWAInstallHandler);
+    };
+  }, []);
+
+  if (
+    isPWA ||
+    !isShowPWAGuide ||
+    !isSupportInstallPWA ||
+    hidePWAInstaller ||
+    canInstallFromPWAInstallHandler === false
+  )
+    return null;
 
   // only when the user is suitable for the pwa install and not install the pwa
   // then show the installation guide