From 3c97ac12bdb8e201d75261e62a176f08d9cbdb1c Mon Sep 17 00:00:00 2001 From: Adam Soltys Date: Thu, 30 Nov 2023 16:44:58 -0800 Subject: page transitions --- package.json | 2 +- pnpm-lock.yaml | 124 ++++++++++++--------- src/components/AppHeader.svelte | 4 + src/routes/(app)/+layout.svelte | 5 +- src/routes/(app)/[username]/+layout.svelte | 52 ++++++++- .../[username]/settings/[...tab]/+page.svelte | 40 ++++--- 6 files changed, 156 insertions(+), 71 deletions(-) diff --git a/package.json b/package.json index 911e287f..b1b4bcd5 100644 --- a/package.json +++ b/package.json @@ -12,7 +12,7 @@ "devDependencies": { "@scure/base": "^1.1.1", "@sveltejs/adapter-node": "^1.1.4", - "@sveltejs/kit": "^1.14.0", + "@sveltejs/kit": "^1.27.6", "@tailwindcss/line-clamp": "^0.4.2", "@zerodevx/svelte-toast": "^0.7.2", "autoprefixer": "^10.4.13", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 1463027a..026e22a3 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -33,10 +33,10 @@ devDependencies: version: 1.1.1 '@sveltejs/adapter-node': specifier: ^1.1.4 - version: 1.1.4(@sveltejs/kit@1.14.0) + version: 1.1.4(@sveltejs/kit@1.27.6) '@sveltejs/kit': - specifier: ^1.14.0 - version: 1.14.0(svelte@3.55.0)(vite@4.2.1) + specifier: ^1.27.6 + version: 1.27.6(svelte@3.55.0)(vite@4.2.1) '@tailwindcss/line-clamp': specifier: ^0.4.2 version: 0.4.2(tailwindcss@3.2.4) @@ -330,10 +330,19 @@ packages: engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0, npm: '>=6.14.13'} dev: false + /@fastify/busboy@2.1.0: + resolution: {integrity: sha512-+KpH+QxZU7O4675t3mnkQKcZZg56u+K/Ct2K+N2AZYNVK8kyeo/bI18tI8aPm3tvNNRyTWfj6s5tnGNlcbQRsA==} + engines: {node: '>=14'} + dev: true + /@jridgewell/sourcemap-codec@1.4.14: resolution: {integrity: sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw==} dev: true + /@jridgewell/sourcemap-codec@1.4.15: + resolution: {integrity: sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg==} + dev: true + /@mapbox/geojson-rewind@0.5.2: resolution: {integrity: sha512-tJaT+RbYGJYStt7wI3cq4Nl4SXxG8W7JDG5DMJu97V25RnbNg3QtQtf+KD+VLjNpWKYsRvXDNmNrBgEETr1ifA==} hasBin: true @@ -506,7 +515,7 @@ packages: '@noble/hashes': 1.3.0 '@scure/base': 1.1.1 - /@sveltejs/adapter-node@1.1.4(@sveltejs/kit@1.14.0): + /@sveltejs/adapter-node@1.1.4(@sveltejs/kit@1.27.6): resolution: {integrity: sha512-3iEBqi1fXLXP9YIbVuz2LXajoebRJCmAFEQbN40DlxAnA7G+InxUgnqFun3q9gBMz2Qvd99K51g/HxWetXRe8Q==} peerDependencies: '@sveltejs/kit': ^1.0.0 @@ -514,53 +523,70 @@ packages: '@rollup/plugin-commonjs': 24.0.1(rollup@3.8.1) '@rollup/plugin-json': 6.0.0(rollup@3.8.1) '@rollup/plugin-node-resolve': 15.0.1(rollup@3.8.1) - '@sveltejs/kit': 1.14.0(svelte@3.55.0)(vite@4.2.1) + '@sveltejs/kit': 1.27.6(svelte@3.55.0)(vite@4.2.1) rollup: 3.8.1 dev: true - /@sveltejs/kit@1.14.0(svelte@3.55.0)(vite@4.2.1): - resolution: {integrity: sha512-4e/cZT0z4IppEkqNvMrurGz6VE1gScukFU7XqwTL/yrGJGXHqS9D7RvsOcE1hASsgrMu6w/fKTIhxT5oN0K1Jw==} + /@sveltejs/kit@1.27.6(svelte@3.55.0)(vite@4.2.1): + resolution: {integrity: sha512-GsjTkMbKzXdbeRg0tk8S7HNShQ4879ftRr0ZHaZfjbig1xQwG57Bvcm9U9/mpLJtCapLbLWUnygKrgcLISLC8A==} engines: {node: ^16.14 || >=18} hasBin: true requiresBuild: true peerDependencies: - svelte: ^3.54.0 + svelte: ^3.54.0 || ^4.0.0-next.0 || ^5.0.0-next.0 vite: ^4.0.0 || 4 dependencies: - '@sveltejs/vite-plugin-svelte': 2.0.2(svelte@3.55.0)(vite@4.2.1) + '@sveltejs/vite-plugin-svelte': 2.5.3(svelte@3.55.0)(vite@4.2.1) '@types/cookie': 0.5.1 cookie: 0.5.0 - devalue: 4.3.0 + devalue: 4.3.2 esm-env: 1.0.0 kleur: 4.1.5 magic-string: 0.30.0 - mime: 3.0.0 + mrmime: 1.0.1 sade: 1.8.1 - set-cookie-parser: 2.5.1 + set-cookie-parser: 2.6.0 sirv: 2.0.2 svelte: 3.55.0 tiny-glob: 0.2.9 - undici: 5.21.0 + undici: 5.26.5 vite: 4.2.1 transitivePeerDependencies: - supports-color dev: true - /@sveltejs/vite-plugin-svelte@2.0.2(svelte@3.55.0)(vite@4.2.1): - resolution: {integrity: sha512-xCEan0/NNpQuL0l5aS42FjwQ6wwskdxC3pW1OeFtEKNZwRg7Evro9lac9HesGP6TdFsTv2xMes5ASQVKbCacxg==} + /@sveltejs/vite-plugin-svelte-inspector@1.0.4(@sveltejs/vite-plugin-svelte@2.5.3)(svelte@3.55.0)(vite@4.2.1): + resolution: {integrity: sha512-zjiuZ3yydBtwpF3bj0kQNV0YXe+iKE545QGZVTaylW3eAzFr+pJ/cwK8lZEaRp4JtaJXhD5DyWAV4AxLh6DgaQ==} engines: {node: ^14.18.0 || >= 16} peerDependencies: - svelte: ^3.54.0 + '@sveltejs/vite-plugin-svelte': ^2.2.0 + svelte: ^3.54.0 || ^4.0.0 vite: ^4.0.0 || 4 dependencies: + '@sveltejs/vite-plugin-svelte': 2.5.3(svelte@3.55.0)(vite@4.2.1) debug: 4.3.4 - deepmerge: 4.2.2 + svelte: 3.55.0 + vite: 4.2.1 + transitivePeerDependencies: + - supports-color + dev: true + + /@sveltejs/vite-plugin-svelte@2.5.3(svelte@3.55.0)(vite@4.2.1): + resolution: {integrity: sha512-erhNtXxE5/6xGZz/M9eXsmI7Pxa6MS7jyTy06zN3Ck++ldrppOnOlJwHHTsMC7DHDQdgUp4NAc4cDNQ9eGdB/w==} + engines: {node: ^14.18.0 || >= 16} + peerDependencies: + svelte: ^3.54.0 || ^4.0.0 || ^5.0.0-next.0 + vite: ^4.0.0 || 4 + dependencies: + '@sveltejs/vite-plugin-svelte-inspector': 1.0.4(@sveltejs/vite-plugin-svelte@2.5.3)(svelte@3.55.0)(vite@4.2.1) + debug: 4.3.4 + deepmerge: 4.3.1 kleur: 4.1.5 - magic-string: 0.27.0 + magic-string: 0.30.5 svelte: 3.55.0 - svelte-hmr: 0.15.1(svelte@3.55.0) + svelte-hmr: 0.15.3(svelte@3.55.0) vite: 4.2.1 - vitefu: 0.2.4(vite@4.2.1) + vitefu: 0.2.5(vite@4.2.1) transitivePeerDependencies: - supports-color dev: true @@ -796,13 +822,6 @@ packages: engines: {node: '>=6'} dev: true - /busboy@1.6.0: - resolution: {integrity: sha512-8SFQbg/0hQ9xy3UNTB0YEnsNBbWfhf7RtnzpL7TkBiTBRfrQ9Fxcnz7VJsleJpyp6rVLvXiuORqjlHi5q+PYuA==} - engines: {node: '>=10.16.0'} - dependencies: - streamsearch: 1.1.0 - dev: true - /bytewise-core@1.2.3: resolution: {integrity: sha512-nZD//kc78OOxeYtRlVk8/zXqTB4gf/nlguL1ggWA8FuchMyOxcyHR4QPQZMUmA7czC+YnaBrPUCubqAWe50DaA==} dependencies: @@ -898,6 +917,11 @@ packages: engines: {node: '>=0.10.0'} dev: true + /deepmerge@4.3.1: + resolution: {integrity: sha512-3sUqbMEc77XqpdNO7FRyRog+eW3ph+GYCbj+rK+uYyRMuwsVy0rMiVtPn+QJlKFvWP/1PYpapqYn0Me2knFn+A==} + engines: {node: '>=0.10.0'} + dev: true + /defined@1.0.1: resolution: {integrity: sha512-hsBd2qSVCRE+5PmNdHt1uzyrFu5d3RwmFDKzyNZMFq/EwDNJF7Ee5+D5oEKF0hU6LhtoUF1macFvOe4AskQC1Q==} dev: true @@ -917,8 +941,8 @@ packages: minimist: 1.2.7 dev: true - /devalue@4.3.0: - resolution: {integrity: sha512-n94yQo4LI3w7erwf84mhRUkUJfhLoCZiLyoOZ/QFsDbcWNZePrLwbQpvZBUG2TNxwV3VjCKPxkiiQA6pe3TrTA==} + /devalue@4.3.2: + resolution: {integrity: sha512-KqFl6pOgOW+Y6wJgu80rHpo2/3H07vr8ntR9rkkFIRETewbf5GaYYcakYfiKz89K+sLsuPkQIZaXDMjUObZwWg==} dev: true /didyoumean@1.2.2: @@ -1305,6 +1329,13 @@ packages: '@jridgewell/sourcemap-codec': 1.4.14 dev: true + /magic-string@0.30.5: + resolution: {integrity: sha512-7xlpfBaQaP/T6Vh8MO/EqXSW5En6INHEvEXQiuff7Gku0PWjU3uf6w/j9o7O+SpB5fOAkrI5HeoNgwjEO0pFsA==} + engines: {node: '>=12'} + dependencies: + '@jridgewell/sourcemap-codec': 1.4.15 + dev: true + /maplibre-gl@3.3.1: resolution: {integrity: sha512-SfRq9bT68GytDzCOG0IoTGg2rASbgdYunW/6xhnp55QuLmwG1M/YOlXxqHaphwia7kZbMvBOocvY0fp5yfTjZA==} engines: {node: '>=16.14.0', npm: '>=8.1.0'} @@ -1349,12 +1380,6 @@ packages: picomatch: 2.3.1 dev: true - /mime@3.0.0: - resolution: {integrity: sha512-jSCU7/VB1loIWBZe14aEYHU/+1UMEHoaO7qxCOVJOw9GgH72VAWppxNcjU+x9a2k3GSIBXNKxXQFqRvvZ7vr3A==} - engines: {node: '>=10.0.0'} - hasBin: true - dev: true - /min-indent@1.0.1: resolution: {integrity: sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==} engines: {node: '>=4'} @@ -1720,8 +1745,8 @@ packages: engines: {node: ^14.13.1 || >=16.0.0} dev: true - /set-cookie-parser@2.5.1: - resolution: {integrity: sha512-1jeBGaKNGdEq4FgIrORu/N570dwoPYio8lSoYLWmX7sQ//0JY08Xh9o5pBcgmHQ/MbsYp/aZnOe1s1lIsbLprQ==} + /set-cookie-parser@2.6.0: + resolution: {integrity: sha512-RVnVQxTXuerk653XfuliOxBP81Sf0+qfQE73LIYKcyMYHG94AuH0kgrQpRDuTZnSmjpysHmzxJXKNfa6PjFhyQ==} dev: true /set-value@2.0.1: @@ -1804,11 +1829,6 @@ packages: extend-shallow: 3.0.2 dev: false - /streamsearch@1.1.0: - resolution: {integrity: sha512-Mcc5wHehp9aXz1ax6bZUyY5afg9u2rv5cqQI3mRrYkGC8rW2hM02jWuwjtL++LS5qinSyhj2QfLyNsuc+VsExg==} - engines: {node: '>=10.0.0'} - dev: true - /strip-indent@3.0.0: resolution: {integrity: sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==} engines: {node: '>=8'} @@ -1827,11 +1847,11 @@ packages: engines: {node: '>= 0.4'} dev: true - /svelte-hmr@0.15.1(svelte@3.55.0): - resolution: {integrity: sha512-BiKB4RZ8YSwRKCNVdNxK/GfY+r4Kjgp9jCLEy0DuqAKfmQtpL38cQK3afdpjw4sqSs4PLi3jIPJIFp259NkZtA==} + /svelte-hmr@0.15.3(svelte@3.55.0): + resolution: {integrity: sha512-41snaPswvSf8TJUhlkoJBekRrABDXDMdpNpT2tfHIv4JuhgvHqLMhEPGtaQn0BmbNSTkuz2Ed20DF2eHw0SmBQ==} engines: {node: ^12.20 || ^14.13.1 || >= 16} peerDependencies: - svelte: '>=3.19.0' + svelte: ^3.19.0 || ^4.0.0 dependencies: svelte: 3.55.0 dev: true @@ -2005,11 +2025,11 @@ packages: engines: {node: '>=18'} dev: false - /undici@5.21.0: - resolution: {integrity: sha512-HOjK8l6a57b2ZGXOcUsI5NLfoTrfmbOl90ixJDl0AEFG4wgHNDQxtZy15/ZQp7HhjkpaGlp/eneMgtsu1dIlUA==} - engines: {node: '>=12.18'} + /undici@5.26.5: + resolution: {integrity: sha512-cSb4bPFd5qgR7qr2jYAi0hlX9n5YKK2ONKkLFkxl+v/9BvC0sOpZjBHDBSXc5lWAf5ty9oZdRXytBIHzgUcerw==} + engines: {node: '>=14.0'} dependencies: - busboy: 1.6.0 + '@fastify/busboy': 2.1.0 dev: true /union-value@1.0.1: @@ -2086,10 +2106,10 @@ packages: fsevents: 2.3.3 dev: true - /vitefu@0.2.4(vite@4.2.1): - resolution: {integrity: sha512-fanAXjSaf9xXtOOeno8wZXIhgia+CZury481LsDaV++lSvcU2R9Ch2bPh3PYFyoHW+w9LqAeYRISVQjUIew14g==} + /vitefu@0.2.5(vite@4.2.1): + resolution: {integrity: sha512-SgHtMLoqaeeGnd2evZ849ZbACbnwQCIwRH57t18FxcXoZop0uQu0uzlIhJBlF/eWVzuce0sHeqPcDo+evVcg8Q==} peerDependencies: - vite: ^3.0.0 || ^4.0.0 || 4 + vite: ^3.0.0 || ^4.0.0 || ^5.0.0 || 4 peerDependenciesMeta: vite: optional: true diff --git a/src/components/AppHeader.svelte b/src/components/AppHeader.svelte index ae162e1f..53b31de4 100644 --- a/src/components/AppHeader.svelte +++ b/src/components/AppHeader.svelte @@ -142,4 +142,8 @@ .z { z-index: 100; } + + header { + view-transition-name: header; + } diff --git a/src/routes/(app)/+layout.svelte b/src/routes/(app)/+layout.svelte index 7f4e3c7b..3422d358 100644 --- a/src/routes/(app)/+layout.svelte +++ b/src/routes/(app)/+layout.svelte @@ -10,8 +10,6 @@ import { warning, protectedRoutes } from '$lib/utils'; import { t, locale } from '$lib/translations'; - const localeLocalStorageKey = 'sveltekit-i18n-locale'; - export let data; let { rate, user, subject, token, rates } = data; @@ -22,6 +20,7 @@ }; onMount(async () => { + let localeLocalStorageKey = 'sveltekit-i18n-locale'; let localStorageLocale = localStorage.getItem(localeLocalStorageKey); if (localStorageLocale) locale.set(localStorageLocale); @@ -32,7 +31,7 @@ if (browser) { let log = console.log; checkSocket(); - expireTimer = setTimeout(expirePin, user.locktime * 1000 || 300000); + expireTimer = setTimeout(expirePin, user.locktime * 1000 || 300000); // if (window.NDEFReader) { // try { diff --git a/src/routes/(app)/[username]/+layout.svelte b/src/routes/(app)/[username]/+layout.svelte index b2efa894..54fcd600 100644 --- a/src/routes/(app)/[username]/+layout.svelte +++ b/src/routes/(app)/[username]/+layout.svelte @@ -1,7 +1,57 @@ - +
+ +
+ + diff --git a/src/routes/(app)/[username]/settings/[...tab]/+page.svelte b/src/routes/(app)/[username]/settings/[...tab]/+page.svelte index a3afce62..933fa1f6 100644 --- a/src/routes/(app)/[username]/settings/[...tab]/+page.svelte +++ b/src/routes/(app)/[username]/settings/[...tab]/+page.svelte @@ -121,6 +121,10 @@ } } + if (user.email !== prev.email) { + await post('/api/verify', { test: true }); + } + const response = await fetch(formElement.action, { method: 'POST', body: data @@ -156,20 +160,22 @@
-

- {$t('user.settings.header')} -

- -
- {#each tabs.filter((t) => t.name !== 'shopify') as { name, key }} - - - - {/each} +
+

+ {$t('user.settings.header')} +

+ +
+ {#each tabs.filter((t) => t.name !== 'shopify') as { name, key }} + + + + {/each} +
@@ -192,3 +198,9 @@
+ + -- cgit v1.2.3