From 79e16ab449e4891ded22f70cf1940698a8d37ae5 Mon Sep 17 00:00:00 2001 From: madkarmaa Date: Wed, 14 Aug 2024 12:15:21 +0200 Subject: [PATCH 01/47] chore: update package-lock.json --- package-lock.json | 30 ++++++++++++++++++++---------- 1 file changed, 20 insertions(+), 10 deletions(-) diff --git a/package-lock.json b/package-lock.json index 906a93bf..dd995a3e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,7 +11,8 @@ "@tanstack/query-core": "^4.36.1", "@tanstack/query-persist-client-core": "^4.36.1", "@tanstack/query-sync-storage-persister": "^4.36.1", - "@tanstack/svelte-query": "^4.36.1" + "@tanstack/svelte-query": "^4.36.1", + "datetrigger": "^1.1.1" }, "devDependencies": { "@sveltejs/adapter-static": "3.0.2", @@ -19,7 +20,7 @@ "@sveltejs/vite-plugin-svelte": "3.1.1", "@typescript-eslint/eslint-plugin": "7.16.0", "@typescript-eslint/parser": "7.16.0", - "eslint": "^8.56.0", + "eslint": "^8.57.0", "eslint-config-prettier": "^9.1.0", "eslint-plugin-svelte": "2.42.0", "fuse.js": "^7.0.0", @@ -532,10 +533,11 @@ } }, "node_modules/@eslint/js": { - "version": "8.56.0", - "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.56.0.tgz", - "integrity": "sha512-gMsVel9D7f2HLkBma9VbtzZRehRogVRfbr++f06nL2vnCGCNlzOD+/MUov/F4p8myyAHspEhVobgjpX64q5m6A==", + "version": "8.57.0", + "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.57.0.tgz", + "integrity": "sha512-Ys+3g2TaW7gADOJzPt83SJtCDhMjndcDMFVQ/Tj9iA1BfJzFKD9mAUXT3OenpuPHbI6P/myECxRJrofUsDx/5g==", "dev": true, + "license": "MIT", "engines": { "node": "^12.22.0 || ^14.17.0 || >=16.0.0" } @@ -2083,6 +2085,13 @@ "node": ">=4" } }, + "node_modules/datetrigger": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/datetrigger/-/datetrigger-1.1.1.tgz", + "integrity": "sha512-SGKQEQO0xqBxDwtpY/qViOpUbN3L3Jr27ZHm1AQ/fQlXLtiFbdKsdwMSEW/reIjWLaNn9R/40to2tM3xibbBRA==", + "hasInstallScript": true, + "license": "MIT" + }, "node_modules/debug": { "version": "4.3.4", "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz", @@ -2232,16 +2241,17 @@ } }, "node_modules/eslint": { - "version": "8.56.0", - "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.56.0.tgz", - "integrity": "sha512-Go19xM6T9puCOWntie1/P997aXxFsOi37JIHRWI514Hc6ZnaHGKY9xFhrU65RT6CcBEzZoGG1e6Nq+DT04ZtZQ==", + "version": "8.57.0", + "resolved": "https://registry.npmjs.org/eslint/-/eslint-8.57.0.tgz", + "integrity": "sha512-dZ6+mexnaTIbSBZWgou51U6OmzIhYM2VcNdtiTtI7qPNZm35Akpr0f6vtw3w1Kmn5PYo+tZVfh13WrhpS6oLqQ==", "dev": true, + "license": "MIT", "dependencies": { "@eslint-community/eslint-utils": "^4.2.0", "@eslint-community/regexpp": "^4.6.1", "@eslint/eslintrc": "^2.1.4", - "@eslint/js": "8.56.0", - "@humanwhocodes/config-array": "^0.11.13", + "@eslint/js": "8.57.0", + "@humanwhocodes/config-array": "^0.11.14", "@humanwhocodes/module-importer": "^1.0.1", "@nodelib/fs.walk": "^1.2.8", "@ungap/structured-clone": "^1.2.0", From d40fe997d0c09249af836112ad2f485edfc9104b Mon Sep 17 00:00:00 2001 From: madkarmaa Date: Sun, 18 Aug 2024 13:53:06 +0200 Subject: [PATCH 02/47] feat: add banner component --- src/app.scss | 6 +++ src/lib/components/Banner.svelte | 75 ++++++++++++++++++++++++++++++++ src/routes/+layout.svelte | 1 + 3 files changed, 82 insertions(+) create mode 100644 src/lib/components/Banner.svelte diff --git a/src/app.scss b/src/app.scss index 306a73b0..e07c5a85 100644 --- a/src/app.scss +++ b/src/app.scss @@ -74,6 +74,12 @@ body { --red-one: hsl(333, 84%, 62%); + --red-two: hsl(0, 100%, 33%); + --red-three: hsl(0, 100%, 50%); + + --yellow-one: hsl(51, 95%, 52%); + --yellow-two: hsl(60, 100%, 50%); + --bezier-one: cubic-bezier(0.25, 0.46, 0.45, 0.94); --drop-shadow-one: 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12), 0px 2px 4px -1px rgba(0, 0, 0, 0.2); diff --git a/src/lib/components/Banner.svelte b/src/lib/components/Banner.svelte new file mode 100644 index 00000000..aa8b8b48 --- /dev/null +++ b/src/lib/components/Banner.svelte @@ -0,0 +1,75 @@ + + + + + diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index dca9b774..ed81854c 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -20,6 +20,7 @@ import Spinner from '$lib/components/Spinner.svelte'; import Dialogue from '$lib/components/Dialogue.svelte'; import Button from '$lib/components/Button.svelte'; + import Banner from '$lib/components/Banner.svelte'; import { staleTime } from '$data/api'; import RouterEvents from '$data/RouterEvents'; import { events as themeEvents } from '$util/themeEvents'; From 538da8a194b3d21e0c47728f4724c58aaebbb1d4 Mon Sep 17 00:00:00 2001 From: madkarmaa Date: Sun, 18 Aug 2024 13:54:32 +0200 Subject: [PATCH 03/47] feat: fetch /v3/ping and show banner accordingly --- src/routes/+layout.svelte | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index ed81854c..25a021d2 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -95,6 +95,20 @@ +{#await fetch('https://api.revanced.app/v3/ping', { method: 'HEAD' }) then res} + {#if !res.ok} + + The API is currently down! Most of our services will be affected. Check our status page for more info. + + {/if} +{/await} + From 4e5f3ac53b36b771bebb0970362e22ad233577df Mon Sep 17 00:00:00 2001 From: madkarmaa Date: Sun, 18 Aug 2024 14:09:39 +0200 Subject: [PATCH 04/47] feat: add icons --- src/lib/components/Banner.svelte | 17 ++- src/routes/+layout.svelte | 12 +- static/icons/caution.svg | 2 + static/icons/info.svg | 6 + static/icons/warning.svg | 202 +++++++++++++++++++++++++++++++ 5 files changed, 229 insertions(+), 10 deletions(-) create mode 100644 static/icons/caution.svg create mode 100644 static/icons/info.svg create mode 100644 static/icons/warning.svg diff --git a/src/lib/components/Banner.svelte b/src/lib/components/Banner.svelte index aa8b8b48..4e8f3fa8 100644 --- a/src/lib/components/Banner.svelte +++ b/src/lib/components/Banner.svelte @@ -8,7 +8,8 @@ @@ -33,6 +34,13 @@ align-items: center; justify-content: center; flex: 1; + padding: 0 2rem; + gap: 0.55rem; + } + + .banner-text > img { + height: 2rem; + width: auto; } .banner-container.info { @@ -51,7 +59,8 @@ color: #000; } - .banner-container.warning > :global(button img) { + .banner-container.warning > :global(button img), + .banner-container.warning > .banner-text > img { filter: grayscale(1) brightness(0); /* Make the icon black */ } @@ -65,7 +74,9 @@ color: #fff; } - .banner-container.caution > :global(button img) { + .banner-container.caution > :global(button img), + .banner-container.caution > .banner-text > img, + .banner-container.info > .banner-text > img { filter: grayscale(1) brightness(0) invert(1); /* Make the icon white */ } diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 25a021d2..36cc647d 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -98,13 +98,11 @@ {#await fetch('https://api.revanced.app/v3/ping', { method: 'HEAD' }) then res} {#if !res.ok} - The API is currently down! Most of our services will be affected. Check our status page for more info. + The API is currently down! Most of our services will be affected. Check our status page for more info. {/if} {/await} diff --git a/static/icons/caution.svg b/static/icons/caution.svg new file mode 100644 index 00000000..7a84fa18 --- /dev/null +++ b/static/icons/caution.svg @@ -0,0 +1,2 @@ + + \ No newline at end of file diff --git a/static/icons/info.svg b/static/icons/info.svg new file mode 100644 index 00000000..4331934f --- /dev/null +++ b/static/icons/info.svg @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/static/icons/warning.svg b/static/icons/warning.svg new file mode 100644 index 00000000..d4dcefd7 --- /dev/null +++ b/static/icons/warning.svg @@ -0,0 +1,202 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file From beed9e02fcef27a3572e713953cb0542b47dc27a Mon Sep 17 00:00:00 2001 From: madkarmaa Date: Sun, 18 Aug 2024 14:16:06 +0200 Subject: [PATCH 05/47] fix: style links --- src/lib/components/Banner.svelte | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/src/lib/components/Banner.svelte b/src/lib/components/Banner.svelte index 4e8f3fa8..45d669c0 100644 --- a/src/lib/components/Banner.svelte +++ b/src/lib/components/Banner.svelte @@ -15,6 +15,16 @@ From 90e42e174d9b06e58a2416cbd5873660ace6ce36 Mon Sep 17 00:00:00 2001 From: madkarmaa Date: Tue, 20 Aug 2024 23:08:21 +0200 Subject: [PATCH 18/47] fix: fix coloring --- src/app.scss | 9 ++++++--- src/lib/components/Banner.svelte | 16 ++++++++++------ 2 files changed, 16 insertions(+), 9 deletions(-) diff --git a/src/app.scss b/src/app.scss index b2890b03..9683370a 100644 --- a/src/app.scss +++ b/src/app.scss @@ -73,11 +73,14 @@ body { --surface-nine: hsl(calc(var(--hue, 206) + 24), 9.5%, 17.5%); --red-one: hsl(333, 84%, 62%); - --red-two: hsl(357.14, 100%, 20.59%); --red-three: hsl(355.92, 100%, 28.82%); - --red-four: hsl(6.43, 100%, 83.53%); - --red-five: hsl(5.85, 100%, 91.96%); + --red-four: hsl(5.85, 100%, 91.96%); + + --yellow-one: hsl(0, 0%, 0%); + --yellow-two: hsl(49.57, 100%, 4.51%); + --yellow-three: hsl(50.3, 39.13%, 50.39%); + --yellow-four: hsl(49.64, 85.94%, 74.9%); --bezier-one: cubic-bezier(0.25, 0.46, 0.45, 0.94); --drop-shadow-one: 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12), diff --git a/src/lib/components/Banner.svelte b/src/lib/components/Banner.svelte index 49476158..2b668789 100644 --- a/src/lib/components/Banner.svelte +++ b/src/lib/components/Banner.svelte @@ -22,6 +22,10 @@ diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 87f415d8..3dded36e 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -10,6 +10,7 @@ import { onMount } from 'svelte'; import { browser } from '$app/environment'; + import { createQuery } from '@tanstack/svelte-query'; import { QueryClient } from '@tanstack/query-core'; import { persistQueryClient } from '@tanstack/query-persist-client-core'; import { QueryClientProvider } from '@tanstack/svelte-query'; @@ -20,7 +21,9 @@ import Spinner from '$lib/components/Spinner.svelte'; import Dialogue from '$lib/components/Dialogue.svelte'; import Button from '$lib/components/Button.svelte'; - import { staleTime } from '$data/api'; + import Banner from '$lib/components/Banner.svelte'; + import Query from '$lib/components/Query.svelte'; + import { staleTime, queries } from '$data/api'; import RouterEvents from '$data/RouterEvents'; import { events as themeEvents } from '$util/themeEvents'; @@ -73,6 +76,8 @@ }, false ); + + const pingQuery = () => createQuery(['ping'], queries.ping); @@ -95,6 +100,18 @@ + + {#if !data} + + The API is currently unresponsive, and some services may not work correctly. Check the status page for updates. + + {/if} + + diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index eaf61241..fffdc80f 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -1,16 +1,9 @@
- - {#if !data} - - The API is currently unresponsive, and some services may not work correctly. Check the status page for updates. - - {/if} - -
From 23c087cf90109dd240d891a74e5e1618e25d670d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?madk=C3=A4rma?= <100418457+madkarmaa@users.noreply.github.com> Date: Sat, 24 Aug 2024 22:09:05 +0200 Subject: [PATCH 29/47] refactor: update API status message Co-authored-by: oSumAtrIX --- src/routes/+layout.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index 3dded36e..401525ac 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -103,7 +103,7 @@ {#if !data} - The API is currently unresponsive, and some services may not work correctly. Check the status page Date: Sat, 24 Aug 2024 22:23:57 +0200 Subject: [PATCH 30/47] feat: add closing animation --- src/lib/components/Banner.svelte | 25 +++++++++++++++++++++---- 1 file changed, 21 insertions(+), 4 deletions(-) diff --git a/src/lib/components/Banner.svelte b/src/lib/components/Banner.svelte index 91875572..7471b0bc 100644 --- a/src/lib/components/Banner.svelte +++ b/src/lib/components/Banner.svelte @@ -7,19 +7,23 @@ const dispatch = createEventDispatcher(); let banner: Element; - const dismiss = () => { - banner.remove(); + const removeElement = (e: AnimationEvent) => { + if (e.animationName.includes('swipeUp')) (e.target as Element).remove(); + }; + + const dismissBanner = () => { + banner.classList.add('closed'); dispatch('dismissed'); }; -