canastack-admin
/
sw-fe
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update frontend

This commit is contained in:
Your Name 2025-12-21 19:54:35 -05:00
parent 862e9f4303
commit 7ea3b2c4fa
2 changed files with 17 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
public/pwaInstall.js
View File

@ -1,39 +1,28 @@
// src/pwaInstall.js // src/pwaInstall.js
let deferredPrompt = null; let deferredPrompt = null;
// Écoute l'événement natif PWA (se déclenche quand Chrome pense que l'app est installable)
window.addEventListener('beforeinstallprompt', (e) => { window.addEventListener('beforeinstallprompt', (e) => {
// Empêche le prompt auto (on veut le contrôler avec le bouton)
e.preventDefault(); e.preventDefault();
deferredPrompt = e; deferredPrompt = e;
console.log('PWA install prompt ready'); console.log('PWA install prompt ready - waiting for user click');
}); });
// Fonction appelée quand on clique sur le bouton "Install"
export function promptInstall() { export function promptInstall() {
if (deferredPrompt) { if (deferredPrompt) {
deferredPrompt.prompt(); deferredPrompt.prompt(); // Affiche le prompt natif "Add to home screen"
deferredPrompt.userChoice.then((choice) => { deferredPrompt.userChoice.then((choiceResult) => {
console.log('Install outcome:', choice.outcome); if (choiceResult.outcome === 'accepted') {
console.log('User accepted PWA install');
} else {
console.log('User dismissed PWA install');
}
deferredPrompt = null; deferredPrompt = null;
}); });
} else { } else {
console.log('No install prompt available'); console.log('No install prompt available yet - try again later');
alert('PWA installation not ready yet. Try again in a few seconds.');
} }
} }
// Fonction pour ajouter le bouton dans TopBar (on l'appelle depuis TopBar.jsx)
export function addPwaInstallButton(container) {
const btn = document.createElement('button');
btn.innerHTML = '<i class="fa-solid fa-download"></i> Installer'; // icône + texte
btn.style.marginLeft = '10px';
btn.style.padding = '6px 12px';
btn.style.fontSize = '12px';
btn.style.background = '#0ea5e9';
btn.style.color = 'white';
btn.style.border = 'none';
btn.style.borderRadius = '999px';
btn.style.cursor = 'pointer';
btn.style.display = 'flex';
btn.style.alignItems = 'center';
btn.style.gap = '6px';
btn.onclick = promptInstall;
container.appendChild(btn);
}

15
src/components/Layout/TopBar.jsx
View File

@ -3,6 +3,9 @@ import { useAuth } from "../../auth/AuthContext";
import { registerUser } from "../../api/client"; import { registerUser } from "../../api/client";
import AuthToast from "../Auth/AuthToast"; import AuthToast from "../Auth/AuthToast";
// Import pour le bouton PWA
import { promptInstall } from '../../pwaInstall';
const THEME_LABELS = { dark: "Dark", blue: "Blue", light: "Light" }; const THEME_LABELS = { dark: "Dark", blue: "Blue", light: "Light" };
const LAST_SIGNUP_KEY = "sociowire:lastSignup"; const LAST_SIGNUP_KEY = "sociowire:lastSignup";
@ -219,16 +222,6 @@ export default function TopBar({ theme = "dark", onChangeTheme }) {
return null; return null;
}, [lastError, lastInfo, needsEmailVerification]); }, [lastError, lastInfo, needsEmailVerification]);
// Fonction pour afficher le prompt PWA (appelée par le bouton)
const handleInstall = () => {
if ('beforeinstallprompt' in window) {
const e = new Event('beforeinstallprompt');
window.dispatchEvent(e);
} else {
alert('PWA installation not supported on this browser.');
}
};
return ( return (
<> <>
{/* Toast area (under topbar) */} {/* Toast area (under topbar) */}
@ -274,7 +267,7 @@ export default function TopBar({ theme = "dark", onChangeTheme }) {
{/* BOUTON INSTALL PWA ici en haut */} {/* BOUTON INSTALL PWA ici en haut */}
<button <button
onClick={handleInstall} onClick={() => promptInstall()}
style={{ style={{
marginLeft: '8px', marginLeft: '8px',
padding: '5px 10px', padding: '5px 10px',