From 601597eb151eabfe7d87edf54f3144f2cc14df80 Mon Sep 17 00:00:00 2001 From: wukko Date: Sat, 23 Nov 2024 19:13:23 +0600 Subject: [PATCH] web: add support for custom api keys & improve turnstile states --- web/i18n/en/settings.json | 5 +- web/src/components/save/Omnibox.svelte | 7 +-- web/src/lib/api/api.ts | 60 ++++++++++++------- web/src/lib/state/turnstile.ts | 15 ++++- web/src/routes/+layout.svelte | 28 +++++---- .../routes/settings/instances/+page.svelte | 26 ++++++++ 6 files changed, 101 insertions(+), 40 deletions(-) diff --git a/web/i18n/en/settings.json b/web/i18n/en/settings.json index b18b375a..b4665ee9 100644 --- a/web/i18n/en/settings.json +++ b/web/i18n/en/settings.json @@ -114,9 +114,10 @@ "advanced.data": "data management", "processing.community": "community instances", - "processing.enable_custom.title": "use a custom processing server", "processing.enable_custom.description": "cobalt will use a custom processing server if you choose to. even though cobalt has some security measures in place, we are not responsible for any damages done via a community instance, as we have no control over them.\n\nplease be mindful of what instances you use and make sure they're hosted by people you trust.", - "processing.custom.placeholder": "custom instance domain" + "processing.access_key": "instance access key", + "processing.access_key.title": "use an instance access key", + "processing.access_key.description": "cobalt will use this key to make requests to the api instance." } diff --git a/web/src/components/save/Omnibox.svelte b/web/src/components/save/Omnibox.svelte index 108371ac..8da051d4 100644 --- a/web/src/components/save/Omnibox.svelte +++ b/web/src/components/save/Omnibox.svelte @@ -7,12 +7,11 @@ import { SvelteComponent, tick } from "svelte"; import { t } from "$lib/i18n/translations"; - import { cachedInfo } from "$lib/api/server-info"; import dialogs from "$lib/state/dialogs"; import { link } from "$lib/state/omnibox"; import { updateSetting } from "$lib/state/settings"; - import { turnstileSolved } from "$lib/state/turnstile"; + import { turnstileEnabled, turnstileSolved } from "$lib/state/turnstile"; import type { Optional } from "$lib/types/generic"; import type { DownloadModeOption } from "$lib/types/settings"; @@ -37,8 +36,8 @@ let isDisabled = false; let isLoading = false; - $: isBotCheckOngoing = - !!$cachedInfo?.info?.cobalt?.turnstileSitekey && !$turnstileSolved; + + $: isBotCheckOngoing = $turnstileEnabled && !$turnstileSolved; const validLink = (url: string) => { try { diff --git a/web/src/lib/api/api.ts b/web/src/lib/api/api.ts index f69c3323..0f2d5b9f 100644 --- a/web/src/lib/api/api.ts +++ b/web/src/lib/api/api.ts @@ -5,12 +5,45 @@ import lazySettingGetter from "$lib/settings/lazy-get"; import { getSession } from "$lib/api/session"; import { currentApiURL } from "$lib/api/api-url"; -import { turnstileSolved } from "$lib/state/turnstile"; +import { turnstileEnabled, turnstileSolved } from "$lib/state/turnstile"; import { cachedInfo, getServerInfo } from "$lib/api/server-info"; import type { Optional } from "$lib/types/generic"; import type { CobaltAPIResponse, CobaltErrorResponse } from "$lib/types/api"; +const getAuthorization = async () => { + const processing = get(settings).processing; + + if (get(turnstileEnabled)) { + if (!get(turnstileSolved)) { + return { + status: "error", + error: { + code: "error.captcha_ongoing" + } + } as CobaltErrorResponse; + } + + const session = await getSession(); + + if (session) { + if ("error" in session) { + if (session.error.code !== "error.api.auth.not_configured") { + return session; + } + } else { + return `Bearer ${session.token}`; + } + } + } + + if (processing.enableCustomApiKey && processing.customApiKey.length > 0) { + return `Api-Key ${processing.customApiKey}`; + } + + return false; +} + const request = async (url: string) => { const getSetting = lazySettingGetter(get(settings)); @@ -49,31 +82,14 @@ const request = async (url: string) => { } as CobaltErrorResponse; } - if (getCachedInfo?.info?.cobalt?.turnstileSitekey && !get(turnstileSolved)) { - return { - status: "error", - error: { - code: "error.captcha_ongoing" - } - } as CobaltErrorResponse; - } - const api = currentApiURL(); - - const session = getCachedInfo?.info?.cobalt?.turnstileSitekey - ? await getSession() : undefined; + const authorization = await getAuthorization(); let extraHeaders = {} - if (session) { - if ("error" in session) { - if (session.error.code !== "error.api.auth.not_configured") { - return session; - } - } else { - extraHeaders = { - "Authorization": `Bearer ${session.token}`, - }; + if (authorization) { + extraHeaders = { + "Authorization": authorization } } diff --git a/web/src/lib/state/turnstile.ts b/web/src/lib/state/turnstile.ts index 12231b11..fffd90da 100644 --- a/web/src/lib/state/turnstile.ts +++ b/web/src/lib/state/turnstile.ts @@ -1,4 +1,17 @@ -import { writable } from "svelte/store"; +import settings from "$lib/state/settings"; +import { cachedInfo } from "$lib/api/server-info"; +import { derived, writable } from "svelte/store"; export const turnstileSolved = writable(false); export const turnstileCreated = writable(false); + +export const turnstileEnabled = derived( + [settings, cachedInfo], + ([$settings, $cachedInfo]) => { + return !!$cachedInfo?.info?.cobalt?.turnstileSitekey && + !( + $settings.processing.enableCustomApiKey && + $settings.processing.customApiKey.length > 0 + ) + } +) diff --git a/web/src/routes/+layout.svelte b/web/src/routes/+layout.svelte index 8f3a4f17..1a878aff 100644 --- a/web/src/routes/+layout.svelte +++ b/web/src/routes/+layout.svelte @@ -7,18 +7,18 @@ import { updated } from "$app/stores"; import { browser } from "$app/environment"; import { afterNavigate } from "$app/navigation"; - import { getServerInfo, cachedInfo } from "$lib/api/server-info"; + import { getServerInfo } from "$lib/api/server-info"; import "$lib/polyfills"; import env from "$lib/env"; - import settings from "$lib/state/settings"; import locale from "$lib/i18n/locale"; + import settings from "$lib/state/settings"; import { t } from "$lib/i18n/translations"; import { device, app } from "$lib/device"; - import { turnstileCreated } from "$lib/state/turnstile"; import currentTheme, { statusBarColors } from "$lib/state/theme"; + import { turnstileCreated, turnstileEnabled } from "$lib/state/turnstile"; import Sidebar from "$components/sidebar/Sidebar.svelte"; import Turnstile from "$components/misc/Turnstile.svelte"; @@ -28,13 +28,12 @@ $: reduceMotion = $settings.appearance.reduceMotion || device.prefers.reducedMotion; + $: reduceTransparency = $settings.appearance.reduceTransparency || device.prefers.reducedTransparency; - $: spawnTurnstile = !!$cachedInfo?.info?.cobalt?.turnstileSitekey; - - afterNavigate(async() => { + afterNavigate(async () => { const to_focus: HTMLElement | null = document.querySelector("[data-first-focus]"); to_focus?.focus(); @@ -46,11 +45,14 @@ - - + + {#if env.HOST} - + {/if} {#if device.is.mobile} @@ -67,7 +69,11 @@ {/if} -
+
- {#if (spawnTurnstile && $page.url.pathname === "/") || $turnstileCreated} + {#if ($turnstileEnabled && $page.url.pathname === "/") || $turnstileCreated} {/if} diff --git a/web/src/routes/settings/instances/+page.svelte b/web/src/routes/settings/instances/+page.svelte index 324a9af6..6b749e21 100644 --- a/web/src/routes/settings/instances/+page.svelte +++ b/web/src/routes/settings/instances/+page.svelte @@ -31,6 +31,32 @@
+{#if $settings.processing.enableCustomInstances} + +
+ + {#if $settings.processing.enableCustomApiKey} + + {/if} +
+
+ {$t("settings.processing.access_key.description")} +
+ +{/if} +