diff --git a/src/assets/locales/en.json b/src/assets/locales/en.json index 8d9b0b72..6e755356 100644 --- a/src/assets/locales/en.json +++ b/src/assets/locales/en.json @@ -218,9 +218,18 @@ "stopEditing": "Stop editing" }, "titles": { - "morning": ["Morning title"], - "day": ["Day title"], - "night": ["Night title"] + "morning": { + "default": "What would you like to watch this morning?", + "extra": ["I hear Before Sunrise is good"] + }, + "day": { + "default": "What would you like to watch this afternoon?", + "extra": [] + }, + "night": { + "default": "What would you like to watch tonight?", + "extra": ["Tired? I hear The Excorcist is good."] + } }, "search": { "loading": "Loading...", diff --git a/src/hooks/useRandomTranslation.ts b/src/hooks/useRandomTranslation.ts index 90c4cdc9..5602ddf8 100644 --- a/src/hooks/useRandomTranslation.ts +++ b/src/hooks/useRandomTranslation.ts @@ -1,19 +1,26 @@ import { useCallback, useMemo } from "react"; import { useTranslation } from "react-i18next"; +// 10% chance of getting a joke title +const shouldGiveJokeTitle = () => Math.floor(Math.random() * 10) === 0; + export function useRandomTranslation() { const { t } = useTranslation(); const seed = useMemo(() => Math.random(), []); const getRandomTranslation = useCallback( - (key: string) => { - const res = t(key, { returnObjects: true }); + (key: string): string => { + const shouldRandom = shouldGiveJokeTitle(); + const defaultTitle = t(`${key}.default`) ?? ""; + if (!shouldRandom) 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] ); diff --git a/src/pages/parts/home/HeroPart.tsx b/src/pages/parts/home/HeroPart.tsx index ea6e1112..871a2095 100644 --- a/src/pages/parts/home/HeroPart.tsx +++ b/src/pages/parts/home/HeroPart.tsx @@ -41,7 +41,7 @@ export function HeroPart({ setIsSticky, searchParams }: HeroPartProps) {
- {title} + {title}