Ichitux/fichajes
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Enable PWA
All checks were successful
Build and Deploy / build-and-deploy (push) Successful in 4m14s
Details

Browse Source
This commit is contained in:
Antoni Nuñez Romeu
2026-05-06 16:21:51 +02:00
parent 012d4aa121
commit 5e6e3f04d3
4 changed files with 59 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
public/index.html
View File

@@ -11,7 +11,7 @@
<meta name="mobile-web-app-capable" content="yes"> <meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-title" content="Time Tracker"> <meta name="apple-mobile-web-app-title" content="Time Tracker">
<meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black"> <meta name="apple-mobile-web-app-status-bar-style" content="default">
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" /> <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
@@ -23,20 +23,5 @@
<body> <body>
<noscript>You need to enable JavaScript to run this app.</noscript> <noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div> <div id="root"></div>
<!-- Service Worker Registration -->
<script>
if ('serviceWorker' in navigator) {
window.addEventListener('load', () => {
navigator.serviceWorker.register('%PUBLIC_URL%/service-worker.js')
.then((registration) => {
console.log('SW registered: ', registration);
})
.catch((registrationError) => {
console.log('SW registration failed: ', registrationError);
});
});
}
</script>
</body> </body>
</html> </html>

19
public/manifest.json
View File

@@ -2,6 +2,7 @@
"short_name": "Time Tracker", "short_name": "Time Tracker",
"name": "Ficosa Time Tracker App", "name": "Ficosa Time Tracker App",
"description": "Track your work hours and manage your time efficiently", "description": "Track your work hours and manage your time efficiently",
"id": "/time-tracker/",
"icons": [ "icons": [
{ {
"src": "favicon.ico", "src": "favicon.ico",
@@ -11,12 +12,26 @@
{ {
"src": "logo192.png", "src": "logo192.png",
"type": "image/png", "type": "image/png",
"sizes": "192x192" "sizes": "192x192",
"purpose": "any"
},
{
"src": "logo192.png",
"type": "image/png",
"sizes": "192x192",
"purpose": "maskable"
}, },
{ {
"src": "logo512.png", "src": "logo512.png",
"type": "image/png", "type": "image/png",
"sizes": "512x512" "sizes": "512x512",
"purpose": "any"
},
{
"src": "logo512.png",
"type": "image/png",
"sizes": "512x512",
"purpose": "maskable"
} }
], ],
"start_url": ".", "start_url": ".",

48
public/service-worker.js
View File

@@ -1,37 +1,67 @@
const CACHE_NAME = 'time-tracker-app-v1'; const CACHE_NAME = 'time-tracker-app-v2';
const urlsToCache = [ const urlsToCache = [
'/', '/',
'/static/js/bundle.js', '/index.html',
'/static/css/main.css',
'/manifest.json', '/manifest.json',
'/favicon.ico', '/favicon.ico',
'/logo_ficosa.png' '/logo192.png',
'/logo512.png'
]; ];
// Install event - cache essential assets // Install event - cache essential static assets
self.addEventListener('install', (event) => { self.addEventListener('install', (event) => {
// Skip waiting to activate immediately
self.skipWaiting();
event.waitUntil( event.waitUntil(
caches.open(CACHE_NAME) caches.open(CACHE_NAME)
.then((cache) => { .then((cache) => {
console.log('Opened cache'); console.log('Opened cache');
// Use addAll for guaranteed files. If these fail, SW won't install.
// We omit JS/CSS because CRA uses hashed filenames in production.
return cache.addAll(urlsToCache); return cache.addAll(urlsToCache);
}) })
); );
}); });
// Fetch event - serve cached content when offline // Fetch event - Stale-while-revalidate strategy for most requests
self.addEventListener('fetch', (event) => { self.addEventListener('fetch', (event) => {
// Only handle GET requests
if (event.request.method !== 'GET') return;
// Skip cross-origin requests
if (!event.request.url.startsWith(self.location.origin)) return;
event.respondWith( event.respondWith(
caches.match(event.request) caches.match(event.request)
.then((response) => { .then((cachedResponse) => {
// Return cached version or fetch from network const fetchPromise = fetch(event.request).then((networkResponse) => {
return response || fetch(event.request); // Dynamically cache successful GET requests
if (networkResponse && networkResponse.status === 200) {
const responseToCache = networkResponse.clone();
caches.open(CACHE_NAME)
.then((cache) => {
cache.put(event.request, responseToCache);
});
}
return networkResponse;
}).catch(() => {
// If network fails and we have no cache, return the cached index.html for navigation requests (SPA fallback)
if (event.request.mode === 'navigate') {
return caches.match('/');
}
});
return cachedResponse || fetchPromise;
}) })
); );
}); });
// Activate event - clean up old caches // Activate event - clean up old caches
self.addEventListener('activate', (event) => { self.addEventListener('activate', (event) => {
// Take control of all clients immediately
event.waitUntil(self.clients.claim());
event.waitUntil( event.waitUntil(
caches.keys().then((cacheNames) => { caches.keys().then((cacheNames) => {
return Promise.all( return Promise.all(

3
src/index.js
View File

@@ -7,7 +7,8 @@ import reportWebVitals from './reportWebVitals';
// Register service worker for PWA functionality // Register service worker for PWA functionality
if ('serviceWorker' in navigator) { if ('serviceWorker' in navigator) {
window.addEventListener('load', () => { window.addEventListener('load', () => {
navigator.serviceWorker.register('/service-worker.js') const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
navigator.serviceWorker.register(swUrl)
.then((registration) => { .then((registration) => {
console.log('Service Worker registered: ', registration); console.log('Service Worker registered: ', registration);
}) })