From e758f32483affc4e92173f49095343e90595ef80 Mon Sep 17 00:00:00 2001 From: mrjvs Date: Tue, 23 Jan 2024 19:48:23 +0100 Subject: [PATCH 1/2] Add loading screen for SetupPart checks --- src/pages/parts/settings/SetupPart.tsx | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/src/pages/parts/settings/SetupPart.tsx b/src/pages/parts/settings/SetupPart.tsx index 074f920d..d188c759 100644 --- a/src/pages/parts/settings/SetupPart.tsx +++ b/src/pages/parts/settings/SetupPart.tsx @@ -8,6 +8,7 @@ import { isExtensionActive } from "@/backend/extension/messaging"; import { singularProxiedFetch } from "@/backend/helpers/fetch"; import { Button } from "@/components/buttons/Button"; import { Icon, Icons } from "@/components/Icon"; +import { Loading } from "@/components/layout/Loading"; import { SettingsCard } from "@/components/layout/SettingsCard"; import { StatusCircle, @@ -121,7 +122,15 @@ export function SetupPart() { const { t } = useTranslation(); const navigate = useNavigate(); const { loading, setupStates, globalState } = useIsSetup(); - if (loading || !setupStates) return

Loading states...

; // TODO proper loading screen + if (loading || !setupStates) { + return ( + +
+ +
+ + ); + } const textLookupMap: Record< Status, From dbaba7ff1886eac6d1cff0a0a48cb9b350a3abb9 Mon Sep 17 00:00:00 2001 From: mrjvs Date: Tue, 23 Jan 2024 19:57:05 +0100 Subject: [PATCH 2/2] Add configurable links to onboarding --- src/pages/onboarding/OnboardingExtension.tsx | 11 +++++++---- src/pages/onboarding/OnboardingProxy.tsx | 9 +++++++-- src/setup/config.ts | 14 ++++++++++++++ 3 files changed, 28 insertions(+), 6 deletions(-) diff --git a/src/pages/onboarding/OnboardingExtension.tsx b/src/pages/onboarding/OnboardingExtension.tsx index 70472a1a..3c17e3b8 100644 --- a/src/pages/onboarding/OnboardingExtension.tsx +++ b/src/pages/onboarding/OnboardingExtension.tsx @@ -17,6 +17,7 @@ import { } from "@/pages/onboarding/onboardingHooks"; import { Card, Link } from "@/pages/onboarding/utils"; import { PageTitle } from "@/pages/parts/util/PageTitle"; +import { conf } from "@/setup/config"; type ExtensionStatus = | "unknown" @@ -108,6 +109,7 @@ export function OnboardingExtensionPage() { const { t } = useTranslation(); const navigate = useNavigateOnboarding(); const { completeAndRedirect } = useRedirectBack(); + const installLink = conf().ONBOARDING_EXTENSION_INSTALL_LINK; const [{ loading, value }, exec] = useAsyncFn( async (triggeredManually: boolean = false) => { @@ -119,7 +121,6 @@ export function OnboardingExtensionPage() { ); useInterval(exec, 1000); - // TODO proper link to install extension return ( @@ -131,9 +132,11 @@ export function OnboardingExtensionPage() { {t("onboarding.extension.explainer")} - - {t("onboarding.extension.link")} - + {installLink ? ( + + {t("onboarding.extension.link")} + + ) : null}
diff --git a/src/pages/onboarding/OnboardingProxy.tsx b/src/pages/onboarding/OnboardingProxy.tsx index e576779c..ae76b9aa 100644 --- a/src/pages/onboarding/OnboardingProxy.tsx +++ b/src/pages/onboarding/OnboardingProxy.tsx @@ -17,6 +17,7 @@ import { } from "@/pages/onboarding/onboardingHooks"; import { Link } from "@/pages/onboarding/utils"; import { PageTitle } from "@/pages/parts/util/PageTitle"; +import { conf } from "@/setup/config"; import { useAuthStore } from "@/stores/auth"; const testUrl = "https://postman-echo.com/get"; @@ -27,6 +28,7 @@ export function OnboardingProxyPage() { const { completeAndRedirect } = useRedirectBack(); const [url, setUrl] = useState(""); const setProxySet = useAuthStore((s) => s.setProxySet); + const installLink = conf().ONBOARDING_PROXY_INSTALL_LINK; const [{ loading, error }, test] = useAsyncFn(async () => { if (!url.startsWith("http")) @@ -42,7 +44,6 @@ export function OnboardingProxyPage() { } }, [url, completeAndRedirect, setProxySet]); - // TODO proper link to proxy deployment docs return ( @@ -54,7 +55,11 @@ export function OnboardingProxyPage() { {t("onboarding.proxy.explainer")} - {t("onboarding.proxy.link")} + {installLink ? ( + + {t("onboarding.proxy.link")} + + ) : null}
; HAS_ONBOARDING: boolean; + ONBOARDING_EXTENSION_INSTALL_LINK: string | null; + ONBOARDING_PROXY_INSTALL_LINK: string | null; } const env: Record = { @@ -44,6 +48,10 @@ const env: Record = { GITHUB_LINK: undefined, DONATION_LINK: undefined, DISCORD_LINK: undefined, + ONBOARDING_EXTENSION_INSTALL_LINK: import.meta.env + .VITE_ONBOARDING_EXTENSION_INSTALL_LINK, + ONBOARDING_PROXY_INSTALL_LINK: import.meta.env + .VITE_ONBOARDING_PROXY_INSTALL_LINK, DMCA_EMAIL: import.meta.env.VITE_DMCA_EMAIL, CORS_PROXY_URL: import.meta.env.VITE_CORS_PROXY_URL, NORMAL_ROUTER: import.meta.env.VITE_NORMAL_ROUTER, @@ -72,6 +80,8 @@ function getKey(key: keyof Config, defaultString?: string): string { export function conf(): RuntimeConfig { const dmcaEmail = getKey("DMCA_EMAIL"); + const extensionLink = getKey("ONBOARDING_EXTENSION_INSTALL_LINK"); + const proxyInstallLink = getKey("ONBOARDING_PROXY_INSTALL_LINK"); const turnstileKey = getKey("TURNSTILE_KEY"); return { APP_VERSION, @@ -79,6 +89,10 @@ export function conf(): RuntimeConfig { DONATION_LINK, DISCORD_LINK, DMCA_EMAIL: dmcaEmail.length > 0 ? dmcaEmail : null, + ONBOARDING_EXTENSION_INSTALL_LINK: + extensionLink.length > 0 ? extensionLink : null, + ONBOARDING_PROXY_INSTALL_LINK: + proxyInstallLink.length > 0 ? proxyInstallLink : null, BACKEND_URL: getKey("BACKEND_URL", BACKEND_URL), TMDB_READ_API_KEY: getKey("TMDB_READ_API_KEY"), PROXY_URLS: getKey("CORS_PROXY_URL")