fix : mobile web app install
This commit is contained in:
@@ -21,7 +21,6 @@ export function SiteEntryPrompt() {
|
||||
const [open, setOpen] = useState(false);
|
||||
const [installed, setInstalled] = useState(false);
|
||||
const [installEvent, setInstallEvent] = useState<InstallEvent | null>(null);
|
||||
const [instructions, setInstructions] = useState(false);
|
||||
const [permission, setPermission] = useState<NotificationPermission | null>(null);
|
||||
const [busy, setBusy] = useState(false);
|
||||
const [error, setError] = useState("");
|
||||
@@ -36,7 +35,6 @@ export function SiteEntryPrompt() {
|
||||
const installedNow = isInstalled();
|
||||
const ios = /iPad|iPhone|iPod/.test(navigator.userAgent) ||
|
||||
(navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1);
|
||||
const mobile = ios || /Android|Mobile/.test(navigator.userAgent);
|
||||
const canNotify = window.isSecureContext && "Notification" in window &&
|
||||
"PushManager" in window && "serviceWorker" in navigator;
|
||||
|
||||
@@ -44,7 +42,7 @@ export function SiteEntryPrompt() {
|
||||
setInstalled(installedNow);
|
||||
setPermission(canNotify ? Notification.permission : null);
|
||||
if (!sessionStorage.getItem(dismissedKey) &&
|
||||
((mobile && !installedNow) || (canNotify && Notification.permission === "default"))) {
|
||||
((ios && !installedNow) || (canNotify && Notification.permission === "default"))) {
|
||||
setOpen(true);
|
||||
}
|
||||
});
|
||||
@@ -57,7 +55,6 @@ export function SiteEntryPrompt() {
|
||||
const onInstalled = () => {
|
||||
setInstalled(true);
|
||||
setInstallEvent(null);
|
||||
setInstructions(false);
|
||||
if (!canNotify || Notification.permission !== "default") setOpen(false);
|
||||
};
|
||||
window.addEventListener("beforeinstallprompt", beforeInstall);
|
||||
@@ -75,10 +72,7 @@ export function SiteEntryPrompt() {
|
||||
}
|
||||
|
||||
async function install() {
|
||||
if (!installEvent) {
|
||||
setInstructions(true);
|
||||
return;
|
||||
}
|
||||
if (!installEvent) return;
|
||||
await installEvent.prompt();
|
||||
await installEvent.userChoice;
|
||||
setInstallEvent(null);
|
||||
@@ -113,9 +107,7 @@ export function SiteEntryPrompt() {
|
||||
const ios = typeof navigator !== "undefined" &&
|
||||
(/iPad|iPhone|iPod/.test(navigator.userAgent) ||
|
||||
(navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1));
|
||||
const mobile = typeof navigator !== "undefined" &&
|
||||
(ios || /Android|Mobile/.test(navigator.userAgent));
|
||||
const showInstall = !installed && (mobile || installEvent !== null);
|
||||
const showInstall = !installed && (ios || installEvent !== null);
|
||||
const canAskNotification = permission === "default" && (!ios || installed);
|
||||
|
||||
return <Dialog open={open} onOpenChange={(next) => { if (!next) dismiss(); }}>
|
||||
@@ -128,9 +120,8 @@ export function SiteEntryPrompt() {
|
||||
"รับการแจ้งเตือนเมื่อมีข้อความใหม่ใน Commission หลังเข้าสู่ระบบ"}
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
{!installed && (ios || instructions) && <p className="text-sm text-muted-foreground">
|
||||
{ios ? "บน iPhone/iPad แตะปุ่มแชร์ใน Safari แล้วเลือก ‘เพิ่มไปยังหน้าจอโฮม’ จากนั้นเปิดแอปที่ติดตั้ง" :
|
||||
"เปิดเมนูของเบราว์เซอร์ แล้วเลือก ‘ติดตั้งแอป’ หรือ ‘เพิ่มไปยังหน้าจอหลัก’"}
|
||||
{!installed && ios && <p className="text-sm text-muted-foreground">
|
||||
บน iPhone/iPad แตะปุ่มแชร์ใน Safari แล้วเลือก ‘เพิ่มไปยังหน้าจอโฮม’ จากนั้นเปิดแอปที่ติดตั้ง
|
||||
</p>}
|
||||
{ios && !installed && <p className="text-sm text-muted-foreground">
|
||||
ติดตั้งและเปิดจากหน้าจอโฮมก่อน จึงจะเปิดการแจ้งเตือนได้บน iPhone/iPad
|
||||
@@ -138,7 +129,7 @@ export function SiteEntryPrompt() {
|
||||
{error && <p role="alert" className="text-sm text-destructive">{error}</p>}
|
||||
<DialogFooter>
|
||||
<Button type="button" variant="outline" disabled={busy} onClick={dismiss}>ไว้ก่อน</Button>
|
||||
{showInstall && !ios && <Button type="button" variant="secondary" disabled={busy} onClick={() => void install()}>ติดตั้งแอป</Button>}
|
||||
{installEvent && !installed && <Button type="button" variant="secondary" disabled={busy} onClick={() => void install()}>ติดตั้งแอป</Button>}
|
||||
{canAskNotification && <Button type="button" disabled={busy} onClick={() => void enableNotifications()}>เปิดการแจ้งเตือน</Button>}
|
||||
</DialogFooter>
|
||||
</DialogContent>
|
||||
|
||||
Reference in New Issue
Block a user