@@ -17,7 +17,7 @@ export function Ol(props: { items: React.ReactNode[] }) {
{i !== props.items.length - 1 ? (
Math.floor(Math.random() * 10) === 0;
+
export function useRandomTranslation() {
const { t } = useTranslation();
+ const shouldJoke = useMemo(() => shouldGiveJokeTitle(), []);
const seed = useMemo(() => Math.random(), []);
const getRandomTranslation = useCallback(
- (key: string) => {
- const res = t(key, { returnObjects: true });
+ (key: string): string => {
+ const defaultTitle = t(`${key}.default`) ?? "";
+ if (!shouldJoke) return defaultTitle;
- if (Array.isArray(res)) {
- return res[Math.floor(seed * res.length)];
+ const keys = t(`${key}.extra`, { returnObjects: true });
+ if (Array.isArray(keys)) {
+ if (keys.length === 0) return defaultTitle;
+ return keys[Math.floor(seed * keys.length)];
}
- return res;
+ return typeof keys === "string" ? keys : defaultTitle;
},
- [t, seed]
+ [t, seed, shouldJoke]
);
return { t: getRandomTranslation };
diff --git a/src/index.tsx b/src/index.tsx
index 79daec72..ac372fee 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -1,3 +1,4 @@
+import "@/setup/pwa";
import "core-js/stable";
import "./stores/__old/imports";
import "@/setup/ga";
@@ -10,7 +11,6 @@ import { HelmetProvider } from "react-helmet-async";
import { useTranslation } from "react-i18next";
import { BrowserRouter, HashRouter } from "react-router-dom";
import { useAsync } from "react-use";
-import { registerSW } from "virtual:pwa-register";
import { Button } from "@/components/buttons/Button";
import { Icon, Icons } from "@/components/Icon";
@@ -40,9 +40,6 @@ if (key) {
(window as any).initMW(conf().PROXY_URLS, key);
}
initializeChromecast();
-registerSW({
- immediate: true,
-});
function LoadingScreen(props: { type: "user" | "lazy" }) {
const mapping = {
diff --git a/src/pages/About.tsx b/src/pages/About.tsx
index fc916c4c..b40dd410 100644
--- a/src/pages/About.tsx
+++ b/src/pages/About.tsx
@@ -22,14 +22,22 @@ export function AboutPage() {
- {t("faq.title")}
+ {t("about.title")}
+ {t("about.description")}
+ {t("about.faqTitle")}
{t("faq.q1.body")},
+
+ {t("about.q1.body")}
+ ,
+
+ {t("about.q2.body")}
+ ,
+
+ {t("about.q3.body")}
+ ,
]}
/>
- {t("faq.how.title")}
- {t("faq.how.body")}
);
diff --git a/src/pages/parts/auth/AccountCreatePart.tsx b/src/pages/parts/auth/AccountCreatePart.tsx
index 7fa90ff7..1c4bd34d 100644
--- a/src/pages/parts/auth/AccountCreatePart.tsx
+++ b/src/pages/parts/auth/AccountCreatePart.tsx
@@ -2,8 +2,8 @@ import { useCallback, useState } from "react";
import { useTranslation } from "react-i18next";
import { Button } from "@/components/buttons/Button";
-import { ColorPicker } from "@/components/form/ColorPicker";
-import { IconPicker } from "@/components/form/IconPicker";
+import { ColorPicker, initialColor } from "@/components/form/ColorPicker";
+import { IconPicker, initialIcon } from "@/components/form/IconPicker";
import { Icon, Icons } from "@/components/Icon";
import {
LargeCard,
@@ -28,9 +28,9 @@ interface AccountCreatePartProps {
export function AccountCreatePart(props: AccountCreatePartProps) {
const [device, setDevice] = useState("");
- const [colorA, setColorA] = useState("#2E65CF");
- const [colorB, setColorB] = useState("#2E65CF");
- const [userIcon, setUserIcon] = useState
(UserIcons.USER);
+ const [colorA, setColorA] = useState(initialColor);
+ const [colorB, setColorB] = useState(initialColor);
+ const [userIcon, setUserIcon] = useState(initialIcon);
const { t } = useTranslation();
const [hasDeviceError, setHasDeviceError] = useState(false);
diff --git a/src/pages/parts/auth/LoginFormPart.tsx b/src/pages/parts/auth/LoginFormPart.tsx
index 82836e74..d87f6e14 100644
--- a/src/pages/parts/auth/LoginFormPart.tsx
+++ b/src/pages/parts/auth/LoginFormPart.tsx
@@ -1,5 +1,5 @@
import { useState } from "react";
-import { useTranslation } from "react-i18next";
+import { Trans, useTranslation } from "react-i18next";
import { useAsyncFn } from "react-use";
import { verifyValidMnemonic } from "@/backend/accounts/crypto";
@@ -10,6 +10,7 @@ import {
LargeCardButtons,
LargeCardText,
} from "@/components/layout/LargeCard";
+import { MwLink } from "@/components/text/Link";
import { AuthInputBox } from "@/components/text-inputs/AuthInputBox";
import { useAuth } from "@/hooks/auth/useAuth";
import { useBookmarkStore } from "@/stores/bookmarks";
@@ -88,6 +89,11 @@ export function LoginFormPart(props: LoginFormPartProps) {
{t("auth.login.submit")}
+
+
+ .
+
+
);
}
diff --git a/src/pages/parts/auth/TrustBackendPart.tsx b/src/pages/parts/auth/TrustBackendPart.tsx
index 77a88409..9118eeae 100644
--- a/src/pages/parts/auth/TrustBackendPart.tsx
+++ b/src/pages/parts/auth/TrustBackendPart.tsx
@@ -12,6 +12,7 @@ import {
LargeCardText,
} from "@/components/layout/LargeCard";
import { Loading } from "@/components/layout/Loading";
+import { MwLink } from "@/components/text/Link";
import { useBackendUrl } from "@/hooks/auth/useBackendUrl";
import { conf } from "@/setup/config";
@@ -60,16 +61,21 @@ export function TrustBackendPart(props: TrustBackendPartProps) {
{cardContent}