From 644d7963b8d108304ba75bb87cacadab66199feb Mon Sep 17 00:00:00 2001 From: Adam Soltys Date: Fri, 29 Nov 2024 21:31:25 -0800 Subject: try service worker again --- src/lib/utils.ts | 11 +-- src/routes/(app)/+layout.svelte | 2 +- src/routes/(app)/invoice/[id]/memo/+page.svelte | 1 - src/routes/(app)/invoice/[id]/tip/+page.svelte | 2 +- .../(app)/payments/[...page]/+page.server.ts | 4 +- src/routes/(app)/payments/[...page]/+page.svelte | 21 +++--- src/service-worker.js | 82 +++++++++++++++++++++- 7 files changed, 95 insertions(+), 28 deletions(-) (limited to 'src') diff --git a/src/lib/utils.ts b/src/lib/utils.ts index cb18d32c..9cf87277 100644 --- a/src/lib/utils.ts +++ b/src/lib/utils.ts @@ -98,15 +98,6 @@ export const copyNoNewlines = (text: string) => { success("Copied!"); }; -export function reverseFormat(val: string, locale: string): number { - const parts = new Intl.NumberFormat(locale).formatToParts(1111.1); - const group = parts.find((part) => part.type === "group")?.value; - const decimal = parts.find((part) => part.type === "decimal")?.value; - let reversedVal = val.replace(new RegExp(`\\${group}`, "g"), ""); - reversedVal = reversedVal.replace(new RegExp(`\\${decimal}`, "g"), "."); - return Number.isNaN(reversedVal) ? 0 : +reversedVal; -} - export const protectedRoutes: RegExp[] = [/customers/, /settings/, /payments/]; let recent: string[] = []; @@ -289,7 +280,7 @@ export const f = ( ) => new Intl.NumberFormat(locale, { style: "currency", - currency, + currency: currency || "USD", minimumFractionDigits, maximumFractionDigits, }).format(s); diff --git a/src/routes/(app)/+layout.svelte b/src/routes/(app)/+layout.svelte index ba838488..d2644443 100644 --- a/src/routes/(app)/+layout.svelte +++ b/src/routes/(app)/+layout.svelte @@ -17,7 +17,7 @@ import LoadingSplash from "$comp/LoadingSplash.svelte"; import AppHeader from "$comp/AppHeader.svelte"; import Password from "$comp/Password.svelte"; - import { getCookie, warning, protectedRoutes } from "$lib/utils"; + import { getCookie, warning } from "$lib/utils"; import { t, locale, loading } from "$lib/translations"; import { goto, afterNavigate, preloadData } from "$app/navigation"; diff --git a/src/routes/(app)/invoice/[id]/memo/+page.svelte b/src/routes/(app)/invoice/[id]/memo/+page.svelte index 02f4a5d9..e5bc8a18 100644 --- a/src/routes/(app)/invoice/[id]/memo/+page.svelte +++ b/src/routes/(app)/invoice/[id]/memo/+page.svelte @@ -10,7 +10,6 @@ f, sat, get, - reverseFormat, s, sats, } from "$lib/utils"; diff --git a/src/routes/(app)/invoice/[id]/tip/+page.svelte b/src/routes/(app)/invoice/[id]/tip/+page.svelte index 4431b17d..1c651163 100644 --- a/src/routes/(app)/invoice/[id]/tip/+page.svelte +++ b/src/routes/(app)/invoice/[id]/tip/+page.svelte @@ -3,7 +3,7 @@ import { browser } from "$app/environment"; import { invoice as inv, request } from "$lib/store"; - import { copy, focus, f, sat, get, reverseFormat, s, sats } from "$lib/utils"; + import { copy, focus, f, sat, get, s, sats } from "$lib/utils"; import Icon from "$comp/Icon.svelte"; import Slider from "$comp/Slider.svelte"; import { goto } from "$app/navigation"; diff --git a/src/routes/(app)/payments/[...page]/+page.server.ts b/src/routes/(app)/payments/[...page]/+page.server.ts index 6b9f47e2..153615b1 100644 --- a/src/routes/(app)/payments/[...page]/+page.server.ts +++ b/src/routes/(app)/payments/[...page]/+page.server.ts @@ -1,6 +1,6 @@ import { auth, get, str } from "$lib/utils"; -const limit = 5; +const limit = 10; export async function load({ cookies, depends, params }) { depends("app:payments"); @@ -30,9 +30,7 @@ export async function load({ cookies, depends, params }) { auth(cookies), ); - console.log("payments", payments.length); const pages = new Array(Math.ceil(count / limit)); - console.log("pages", pages); return { payments, page, pages, start, end, incoming, outgoing }; } diff --git a/src/routes/(app)/payments/[...page]/+page.svelte b/src/routes/(app)/payments/[...page]/+page.svelte index 5625c8de..0a33840e 100644 --- a/src/routes/(app)/payments/[...page]/+page.svelte +++ b/src/routes/(app)/payments/[...page]/+page.svelte @@ -57,12 +57,9 @@ ]); let selection = $derived( - start - ? presets.findIndex( - (p) => - Math.abs(differenceInDays(new Date(start * 1000), p.start)) < 1, - ) - : 0, + presets.findIndex( + (p) => Math.abs(differenceInDays(new Date(start * 1000), p.start)) < 1, + ), ); $effect(() => { @@ -312,7 +309,9 @@ {#if tipsIn || tipsOut}{$t("payments.tips")}{/if} - {$t("payments.total")} + {$t("payments.total")} {@const totalIn = incoming[c]?.fiat || 0} {@const tipsIn = incoming[c]?.fiatTips || 0} @@ -327,14 +326,18 @@ > {tipsIn > 0 ? f(tipsIn, c, userLocale) : "-"} - {totalIn > 0 ? f(totalIn, c, userLocale) : "-"} + {totalIn > 0 ? f(totalIn, c, userLocale) : "-"} {$t("payments.expenditure")} {tipsOut > 0 ? f(tipsOut, c, userLocale) : "-"} - {totalOut > 0 ? f(totalOut, c, userLocale) : "-"} + {totalOut > 0 ? f(totalOut, c, userLocale) : "-"} {/each} diff --git a/src/service-worker.js b/src/service-worker.js index fa934333..febb8cd8 100644 --- a/src/service-worker.js +++ b/src/service-worker.js @@ -1,8 +1,84 @@ import { build, files, version } from "$service-worker"; -self.addEventListener("install", (event) => {}); -self.addEventListener("activate", (event) => {}); -self.addEventListener("fetch", (event) => {}); +// Create a unique cache name for this deployment +const CACHE = `cache-${version}`; + +const ASSETS = [ + ...build, // the app itself + ...files, // everything in `static` +]; + +self.addEventListener("install", (event) => { + // Create a new cache and add all files to it + async function addFilesToCache() { + const cache = await caches.open(CACHE); + await cache.addAll(ASSETS); + } + + event.waitUntil(addFilesToCache()); +}); + +self.addEventListener("activate", (event) => { + // Remove previous cached data from disk + async function deleteOldCaches() { + for (const key of await caches.keys()) { + if (key !== CACHE) await caches.delete(key); + } + } + + event.waitUntil(deleteOldCaches()); +}); + +self.addEventListener("fetch", (event) => { + // ignore POST requests etc + if (event.request.method !== "GET") return; + + async function respond() { + const url = new URL(event.request.url); + const cache = await caches.open(CACHE); + console.log(url.pathname); + + // `build`/`files` can always be served from the cache + if (ASSETS.includes(url.pathname)) { + const response = await cache.match(url.pathname); + + if (response) { + return response; + } + } + + // for everything else, try the network first, but + // fall back to the cache if we're offline + try { + const response = await fetch(event.request); + + // if we're offline, fetch can return a value that is not a Response + // instead of throwing - and we can't pass this non-Response to respondWith + if (!(response instanceof Response)) { + throw new Error("invalid response from fetch"); + } + + if (response.status === 200) { + cache.put(event.request, response.clone()); + } + + return response; + } catch (err) { + const response = await cache.match(event.request); + + if (response) { + return response; + } + + // if there's no cache, then just error out + // as there is nothing we can do to respond to this request + throw err; + } + } + + event.respondWith(respond()); +}); + self.addEventListener("push", (event) => { const { title, body, url } = event.data.json(); const icon = "/images/icon.png"; -- cgit v1.2.3