mirror of
				https://github.com/binwiederhier/ntfy.git
				synced 2025-10-31 21:12:36 +01:00 
			
		
		
		
	Fix: refresh web push pref on standalone change
This commit is contained in:
		
							parent
							
								
									5627097a6c
								
							
						
					
					
						commit
						175ab5ea76
					
				
					 3 changed files with 33 additions and 26 deletions
				
			
		|  | @ -263,16 +263,3 @@ export const urlB64ToUint8Array = (base64String) => { | |||
|   } | ||||
|   return outputArray; | ||||
| }; | ||||
| 
 | ||||
| export const isLaunchedPWA = () => { | ||||
|   if (window.matchMedia("(display-mode: standalone)").matches) { | ||||
|     return true; | ||||
|   } | ||||
| 
 | ||||
|   // iOS
 | ||||
|   if (window.navigator.standalone === true) { | ||||
|     return true; | ||||
|   } | ||||
| 
 | ||||
|   return false; | ||||
| }; | ||||
|  |  | |||
|  | @ -36,7 +36,7 @@ import { Info } from "@mui/icons-material"; | |||
| import { useOutletContext } from "react-router-dom"; | ||||
| import theme from "./theme"; | ||||
| import userManager from "../app/UserManager"; | ||||
| import { isLaunchedPWA, playSound, shuffle, sounds, validUrl } from "../app/utils"; | ||||
| import { playSound, shuffle, sounds, validUrl } from "../app/utils"; | ||||
| import session from "../app/Session"; | ||||
| import routes from "./routes"; | ||||
| import accountApi, { Permission, Role } from "../app/AccountApi"; | ||||
|  | @ -49,6 +49,7 @@ import { ReserveAddDialog, ReserveDeleteDialog, ReserveEditDialog } from "./Rese | |||
| import { UnauthorizedError } from "../app/errors"; | ||||
| import { subscribeTopic } from "./SubscribeDialog"; | ||||
| import notifier from "../app/Notifier"; | ||||
| import { useIsLaunchedPWA } from "./hooks"; | ||||
| 
 | ||||
| const maybeUpdateAccountSettings = async (payload) => { | ||||
|   if (!session.exists()) { | ||||
|  | @ -77,6 +78,9 @@ const Preferences = () => ( | |||
| 
 | ||||
| const Notifications = () => { | ||||
|   const { t } = useTranslation(); | ||||
| 
 | ||||
|   const isLaunchedPWA = useIsLaunchedPWA(); | ||||
| 
 | ||||
|   return ( | ||||
|     <Card sx={{ p: 3 }} aria-label={t("prefs_notifications_title")}> | ||||
|       <Typography variant="h5" sx={{ marginBottom: 2 }}> | ||||
|  | @ -86,7 +90,7 @@ const Notifications = () => { | |||
|         <Sound /> | ||||
|         <MinPriority /> | ||||
|         <DeleteAfter /> | ||||
|         {!isLaunchedPWA() && notifier.pushPossible() && <WebPushEnabled />} | ||||
|         {!isLaunchedPWA && notifier.pushPossible() && <WebPushEnabled />} | ||||
|       </PrefGroup> | ||||
|     </Card> | ||||
|   ); | ||||
|  |  | |||
|  | @ -2,7 +2,7 @@ import { useParams } from "react-router-dom"; | |||
| import { useEffect, useMemo, useState } from "react"; | ||||
| import { useLiveQuery } from "dexie-react-hooks"; | ||||
| import subscriptionManager from "../app/SubscriptionManager"; | ||||
| import { disallowedTopic, expandSecureUrl, isLaunchedPWA, topicUrl } from "../app/utils"; | ||||
| import { disallowedTopic, expandSecureUrl, topicUrl } from "../app/utils"; | ||||
| import routes from "./routes"; | ||||
| import connectionManager from "../app/ConnectionManager"; | ||||
| import poller from "../app/Poller"; | ||||
|  | @ -212,17 +212,24 @@ export const useWebPushTopics = () => { | |||
|   return topics; | ||||
| }; | ||||
| 
 | ||||
| /** | ||||
| const matchMedia = window.matchMedia("(display-mode: standalone)"); | ||||
| 
 | ||||
| const isIOSStandAlone = window.navigator.standalone === true; | ||||
| 
 | ||||
| /* | ||||
|  * Watches the "display-mode" to detect if the app is running as a standalone app (PWA), | ||||
|  * and enables "Web Push" if it is. | ||||
|  */ | ||||
| export const useStandaloneWebPushAutoSubscribe = () => { | ||||
|   const matchMedia = window.matchMedia("(display-mode: standalone)"); | ||||
|   const [isStandalone, setIsStandalone] = useState(isLaunchedPWA()); | ||||
| export const useIsLaunchedPWA = () => { | ||||
|   const [isStandalone, setIsStandalone] = useState(matchMedia.matches); | ||||
| 
 | ||||
|   useEffect(() => { | ||||
|     // no need to listen for events on iOS
 | ||||
|     if (isIOSStandAlone) { | ||||
|       return () => {}; | ||||
|     } | ||||
| 
 | ||||
|     const handler = (evt) => { | ||||
|       console.log(`[useStandaloneAutoWebPushSubscribe] App is now running ${evt.matches ? "standalone" : "in the browser"}`); | ||||
|       console.log(`[useIsLaunchedPWA] App is now running ${evt.matches ? "standalone" : "in the browser"}`); | ||||
|       setIsStandalone(evt.matches); | ||||
|     }; | ||||
| 
 | ||||
|  | @ -231,14 +238,23 @@ export const useStandaloneWebPushAutoSubscribe = () => { | |||
|     return () => { | ||||
|       matchMedia.removeEventListener("change", handler); | ||||
|     }; | ||||
|   }); | ||||
|   }, []); | ||||
| 
 | ||||
|   return isIOSStandAlone || isStandalone; | ||||
| }; | ||||
| 
 | ||||
| /** | ||||
|  * Watches the result of `useIsLaunchedPWA` and enables "Web Push" if it is. | ||||
|  */ | ||||
| export const useStandaloneWebPushAutoSubscribe = () => { | ||||
|   const isLaunchedPWA = useIsLaunchedPWA(); | ||||
| 
 | ||||
|   useEffect(() => { | ||||
|     if (isStandalone) { | ||||
|       console.log(`[useStandaloneAutoWebPushSubscribe] Turning on web push automatically`); | ||||
|     if (isLaunchedPWA) { | ||||
|       console.log(`[useStandaloneWebPushAutoSubscribe] Turning on web push automatically`); | ||||
|       prefs.setWebPushEnabled(true); // Dangle!
 | ||||
|     } | ||||
|   }, [isStandalone]); | ||||
|   }, [isLaunchedPWA]); | ||||
| }; | ||||
| 
 | ||||
| /** | ||||
|  |  | |||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue
	
	 nimbleghost
						nimbleghost