File size: 3,098 Bytes
212c959 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 | import { useEffect, useMemo, useState } from 'react'
function isStandaloneDisplay() {
if (typeof window === 'undefined') return false
return (
window.matchMedia?.('(display-mode: standalone)').matches ||
window.navigator.standalone === true
)
}
function detectPlatform() {
if (typeof navigator === 'undefined') return 'desktop'
const userAgent = navigator.userAgent || ''
const isIOS =
/iPad|iPhone|iPod/.test(userAgent) ||
(navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1)
if (isIOS) return 'ios'
if (/Android/i.test(userAgent)) return 'android'
return 'desktop'
}
function getManualInstallInstructions(platform) {
if (platform === 'ios') {
return 'Open this app in Safari, tap Share, then choose Add to Home Screen.'
}
if (platform === 'android') {
return 'Open the browser menu and choose Install app or Add to Home screen.'
}
return 'Open the browser menu and choose Install OwnGPT, Install app, or Create shortcut.'
}
export function useInstallPrompt() {
const [deferredPrompt, setDeferredPrompt] = useState(null)
const [isInstalled, setIsInstalled] = useState(() => isStandaloneDisplay())
const [platform, setPlatform] = useState(() => detectPlatform())
useEffect(() => {
if (typeof window === 'undefined') return undefined
const handleBeforeInstallPrompt = (event) => {
event.preventDefault()
setDeferredPrompt(event)
}
const handleInstalled = () => {
setDeferredPrompt(null)
setIsInstalled(true)
}
const handleModeChange = () => {
setIsInstalled(isStandaloneDisplay())
}
const mediaQuery = window.matchMedia?.('(display-mode: standalone)')
window.addEventListener('beforeinstallprompt', handleBeforeInstallPrompt)
window.addEventListener('appinstalled', handleInstalled)
mediaQuery?.addEventListener?.('change', handleModeChange)
setPlatform(detectPlatform())
setIsInstalled(isStandaloneDisplay())
return () => {
window.removeEventListener('beforeinstallprompt', handleBeforeInstallPrompt)
window.removeEventListener('appinstalled', handleInstalled)
mediaQuery?.removeEventListener?.('change', handleModeChange)
}
}, [])
const manualInstructions = useMemo(() => getManualInstallInstructions(platform), [platform])
const installState = isInstalled ? 'installed' : deferredPrompt ? 'ready' : 'manual'
const install = async () => {
if (isInstalled) {
return { status: 'installed', platform, instructions: manualInstructions }
}
if (!deferredPrompt) {
return { status: 'manual', platform, instructions: manualInstructions }
}
deferredPrompt.prompt()
const choice = await deferredPrompt.userChoice.catch(() => null)
setDeferredPrompt(null)
return {
status: choice?.outcome === 'accepted' ? 'accepted' : 'dismissed',
platform,
instructions: manualInstructions,
}
}
return {
install,
installState,
canPromptInstall: Boolean(deferredPrompt),
isInstalled,
platform,
manualInstructions,
}
}
|