From 548679571142cf6843419fc6070f51b2c5cfa283 Mon Sep 17 00:00:00 2001 From: Fred Boniface Date: Sun, 3 May 2026 11:45:07 +0100 Subject: [PATCH] Tidy up train service component, add loading state, convert tiploc to name... etc. --- package-lock.json | 24 ++++- package.json | 2 +- src/lib/components/ui/TiplocConverter.svelte | 10 ++ src/lib/components/ui/TrainService.svelte | 98 +++++++++++++++----- src/lib/locations-object.svelte.ts | 14 +++ src/routes/trains/+page.svelte | 3 + 6 files changed, 120 insertions(+), 31 deletions(-) create mode 100644 src/lib/components/ui/TiplocConverter.svelte diff --git a/package-lock.json b/package-lock.json index 3c511e1..9db00ca 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,7 +8,7 @@ "name": "web-pwa", "version": "0.0.1", "dependencies": { - "@owlboard/owlboard-ts": "^3.0.0-dev.20260503T0051", + "@owlboard/owlboard-ts": "^3.0.0-dev.20260503t0947", "@tabler/icons-svelte": "^3.40.0" }, "devDependencies": { @@ -786,12 +786,12 @@ "license": "MIT" }, "node_modules/@owlboard/owlboard-ts": { - "version": "3.0.0-dev.20260503T0051", - "resolved": "https://git.fjla.uk/api/packages/OwlBoard/npm/%40owlboard%2Fowlboard-ts/-/3.0.0-dev.20260503T0051/owlboard-ts-3.0.0-dev.20260503t0051.tgz", - "integrity": "sha512-YPW89izHnbQLX2rfLaPM1t8x77ajGW61Up/m4NDkEjRyMV1z/mAGj40wj7yfkwoXr8AEgVWlqfpWeR5JDxqrBQ==", + "version": "3.0.0-dev.20260503t0947", + "resolved": "https://git.fjla.uk/api/packages/OwlBoard/npm/%40owlboard%2Fowlboard-ts/-/3.0.0-dev.20260503t0947/owlboard-ts-3.0.0-dev.20260503t0947.tgz", + "integrity": "sha512-t6wcsq53ZM9hKphn9QClN4fUjIF53RbQ/oOh1pRQ6vpxhGVuh3xf46wPR8h67lLh0UWUEolYyDCA4TTz3a56fw==", "license": "GPL-3.0", "dependencies": { - "@owlboard/api-schema-types": "^3.0.3-alpha8", + "@owlboard/api-schema-types": "^3.0.3-alpha10", "install": "^0.13.0", "latlon-geohash": "^2.0.0", "npm": "^11.13.0" @@ -1827,6 +1827,7 @@ "version": "4.3.0", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", + "dev": true, "license": "MIT", "dependencies": { "color-convert": "^2.0.1" @@ -1877,12 +1878,14 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz", "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==", + "dev": true, "license": "MIT" }, "node_modules/brace-expansion": { "version": "1.1.13", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.13.tgz", "integrity": "sha512-9ZLprWS6EENmhEOpjCYW2c8VkmOvckIJZfkr7rBW6dObmfgJ/L1GpSYW5Hpo9lDz4D1+n0Ckz8rU7FwHDQiG/w==", + "dev": true, "license": "MIT", "dependencies": { "balanced-match": "^1.0.0", @@ -1913,6 +1916,7 @@ "version": "4.1.2", "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", + "dev": true, "license": "MIT", "dependencies": { "ansi-styles": "^4.1.0", @@ -1954,6 +1958,7 @@ "version": "2.0.1", "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", + "dev": true, "license": "MIT", "dependencies": { "color-name": "~1.1.4" @@ -1966,12 +1971,14 @@ "version": "1.1.4", "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", + "dev": true, "license": "MIT" }, "node_modules/concat-map": { "version": "0.0.1", "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==", + "dev": true, "license": "MIT" }, "node_modules/cookie": { @@ -2515,6 +2522,7 @@ "version": "4.0.0", "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", + "dev": true, "license": "MIT", "engines": { "node": ">=8" @@ -2602,6 +2610,7 @@ "version": "2.0.0", "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz", "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==", + "dev": true, "license": "ISC" }, "node_modules/js-yaml": { @@ -2737,6 +2746,7 @@ "version": "3.1.5", "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.5.tgz", "integrity": "sha512-VgjWUsnnT6n+NUk6eZq77zeFdpW2LWDzP6zFGrCbHXiYNul5Dzqk2HHQ5uFH2DNW5Xbp8+jVzaeNt94ssEEl4w==", + "dev": true, "license": "ISC", "dependencies": { "brace-expansion": "^1.1.7" @@ -2769,6 +2779,7 @@ "version": "2.1.3", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz", "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==", + "dev": true, "license": "MIT" }, "node_modules/nanoid": { @@ -5006,6 +5017,7 @@ "version": "7.7.4", "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.4.tgz", "integrity": "sha512-vFKC2IEtQnVhpT78h1Yp8wzwrf8CM+MzKMHGJZfBtzhZNycRFnXsHk6E5TxIkkMsgNS7mdX3AGB7x2QM2di4lA==", + "dev": true, "license": "ISC", "bin": { "semver": "bin/semver.js" @@ -5107,6 +5119,7 @@ "version": "7.2.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", + "dev": true, "license": "MIT", "dependencies": { "has-flag": "^4.0.0" @@ -5547,6 +5560,7 @@ "version": "2.0.2", "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz", "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==", + "dev": true, "license": "ISC", "dependencies": { "isexe": "^2.0.0" diff --git a/package.json b/package.json index 9e8658e..ccf2776 100644 --- a/package.json +++ b/package.json @@ -41,7 +41,7 @@ "vitest-browser-svelte": "^2.0.2" }, "dependencies": { - "@owlboard/owlboard-ts": "^3.0.0-dev.20260503T0051", + "@owlboard/owlboard-ts": "^3.0.0-dev.20260503t0947", "@tabler/icons-svelte": "^3.40.0" } } diff --git a/src/lib/components/ui/TiplocConverter.svelte b/src/lib/components/ui/TiplocConverter.svelte new file mode 100644 index 0000000..2eb08dd --- /dev/null +++ b/src/lib/components/ui/TiplocConverter.svelte @@ -0,0 +1,10 @@ + + +{displayName} diff --git a/src/lib/components/ui/TrainService.svelte b/src/lib/components/ui/TrainService.svelte index cfff6c3..12bb4fb 100644 --- a/src/lib/components/ui/TrainService.svelte +++ b/src/lib/components/ui/TrainService.svelte @@ -5,12 +5,12 @@ import { quintOut } from 'svelte/easing'; import { formatUkTime } from '$lib/utils/time'; import TocStyle from '$lib/components/ui/TocStyle.svelte'; - + import TiplocConverter from '$lib/components/ui/TiplocConverter.svelte'; let { service }: { service: ApiTrainsTrainByHeadcode.TrainByHeadcodeResponse } = $props(); let isExpanded = $state(false); let loadingDetails = $state(false); let loadingDetailsError = $state(false); - let loadingDetailsErrorMsg = $state(""); + let loadingDetailsErrorMsg = $state(''); let details = $state(null); const toggleExpand = async (rid: string) => { @@ -19,11 +19,6 @@ return; } - if (details) { - isExpanded = true; - return; - } - loadingDetails = true; try { const result = await OwlClient.trains.getByRid(service.r); @@ -49,11 +44,14 @@ loadingDetails = false; } - const estClass = (act, est) => (!act && est) ? 'est' : 'act'; + const estClass = (act, est) => (!act && est ? 'est' : 'act');