fix: fix PWA
This commit is contained in:
@ -1,5 +1,10 @@
|
||||
<script lang="ts">
|
||||
import { onMount, onDestroy } from "svelte";
|
||||
|
||||
interface BeforeInstallPromptEvent extends Event {
|
||||
prompt(): Promise<void>;
|
||||
readonly userChoice: Promise<{ outcome: "accepted" | "dismissed" }>;
|
||||
}
|
||||
import { goto } from "$app/navigation";
|
||||
import {
|
||||
fetchContainers,
|
||||
@ -59,6 +64,25 @@
|
||||
return "dot-other";
|
||||
}
|
||||
|
||||
// PWA install prompt
|
||||
let installPrompt = $state<BeforeInstallPromptEvent | null>(null);
|
||||
|
||||
function onBeforeInstallPrompt(e: Event) {
|
||||
e.preventDefault();
|
||||
installPrompt = e as BeforeInstallPromptEvent;
|
||||
}
|
||||
|
||||
function onAppInstalled() {
|
||||
installPrompt = null;
|
||||
}
|
||||
|
||||
async function installPWA() {
|
||||
if (!installPrompt) return;
|
||||
installPrompt.prompt();
|
||||
await installPrompt.userChoice;
|
||||
installPrompt = null;
|
||||
}
|
||||
|
||||
let disconnect: (() => void) | null = null;
|
||||
|
||||
async function load() {
|
||||
@ -99,9 +123,15 @@
|
||||
if (evt.type === "containers.updated") load();
|
||||
if (evt.type === "agent.connected" || evt.type === "agent.disconnected") load();
|
||||
});
|
||||
window.addEventListener("beforeinstallprompt", onBeforeInstallPrompt);
|
||||
window.addEventListener("appinstalled", onAppInstalled);
|
||||
});
|
||||
|
||||
onDestroy(() => disconnect?.());
|
||||
onDestroy(() => {
|
||||
disconnect?.();
|
||||
window.removeEventListener("beforeinstallprompt", onBeforeInstallPrompt);
|
||||
window.removeEventListener("appinstalled", onAppInstalled);
|
||||
});
|
||||
|
||||
function uniquePorts(ports: ContainerPort[] | null) {
|
||||
const seen = new Set<string>();
|
||||
@ -168,6 +198,15 @@
|
||||
</span>
|
||||
{/if}
|
||||
|
||||
{#if installPrompt}
|
||||
<button onclick={installPWA} class="nav-btn" title="Installer l'application">
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.75"
|
||||
d="M4 16v2a2 2 0 002 2h12a2 2 0 002-2v-2M7 10l5 5m0 0l5-5m-5 5V4" />
|
||||
</svg>
|
||||
</button>
|
||||
{/if}
|
||||
|
||||
<a href="/admin" class="nav-btn" title="Administration">
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.75"
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 207 KiB After Width: | Height: | Size: 39 KiB |
Reference in New Issue
Block a user