- Added icons for PWA: icon-192x192.png, icon-512x512.png, and maskable-icon.png. - Created manifest.json for PWA configuration. - Integrated PWA registration in app.tsx with update notifications. - Implemented PWA update toast component for user notifications. - Enhanced permissions page with platform-specific denied messages. - Updated app.blade.php to include manifest and meta tags for PWA. - Configured Vite to support PWA with caching strategies for assets and APIs.
37 lines
1.2 KiB
TypeScript
37 lines
1.2 KiB
TypeScript
import { useEffect } from 'react';
|
|
import { toast } from 'sonner';
|
|
|
|
export function PWAUpdateToast() {
|
|
useEffect(() => {
|
|
const handleOfflineReady = () => {
|
|
toast.success('Aplikasi siap offline!', {
|
|
description: 'Aplikasi dapat digunakan tanpa koneksi internet.',
|
|
duration: 5000,
|
|
});
|
|
};
|
|
|
|
const handleUpdateAvailable = () => {
|
|
toast.info('Update tersedia!', {
|
|
description: 'Versi baru aplikasi telah tersedia. Klik untuk memperbarui.',
|
|
duration: Infinity,
|
|
action: {
|
|
label: 'Update',
|
|
onClick: () => {
|
|
window.location.reload();
|
|
},
|
|
},
|
|
});
|
|
};
|
|
|
|
window.addEventListener('sw-offline-ready', handleOfflineReady);
|
|
window.addEventListener('sw-update-available', handleUpdateAvailable);
|
|
|
|
return () => {
|
|
window.removeEventListener('sw-offline-ready', handleOfflineReady);
|
|
window.removeEventListener('sw-update-available', handleUpdateAvailable);
|
|
};
|
|
}, []);
|
|
|
|
return null;
|
|
}
|