diff --git a/src/hooks/useRandomTranslation.ts b/src/hooks/useRandomTranslation.ts new file mode 100644 index 00000000..fcda150a --- /dev/null +++ b/src/hooks/useRandomTranslation.ts @@ -0,0 +1,15 @@ +import { useTranslation } from "react-i18next"; + +export function useRandomTranslation() { + const { t } = useTranslation(); + + const getRandomTranslation = (key: string) => { + const res = t(key, { returnObjects: true }); + + if (Array.isArray(res)) return res[Math.floor(Math.random() * res.length)]; + + return res; + }; + + return { t: getRandomTranslation }; +} diff --git a/src/pages/parts/home/HeroPart.tsx b/src/pages/parts/home/HeroPart.tsx index 1cb8e763..1ab20fab 100644 --- a/src/pages/parts/home/HeroPart.tsx +++ b/src/pages/parts/home/HeroPart.tsx @@ -1,10 +1,10 @@ import { useCallback, useState } from "react"; -import { useTranslation } from "react-i18next"; import Sticky from "react-stickynode"; import { ThinContainer } from "@/components/layout/ThinContainer"; import { SearchBarInput } from "@/components/SearchBar"; import { HeroTitle } from "@/components/text/HeroTitle"; +import { useRandomTranslation } from "@/hooks/useRandomTranslation"; import { useSearchQuery } from "@/hooks/useSearchQuery"; import { useBannerSize } from "@/stores/banner"; @@ -14,7 +14,7 @@ export interface HeroPartProps { } export function HeroPart({ setIsSticky, searchParams }: HeroPartProps) { - const { t } = useTranslation(); + const { t } = useRandomTranslation(); const [search, setSearch, setSearchUnFocus] = searchParams; const [, setShowBg] = useState(false); const bannerSize = useBannerSize(); @@ -27,13 +27,17 @@ export function HeroPart({ setIsSticky, searchParams }: HeroPartProps) { [setShowBg, setIsSticky] ); + let time = "night"; + const hour = new Date().getHours(); + if (hour < 12) time = "morning"; + if (hour < 19) time = "day"; + const title = t(`search.title.${time}`); + return (
- - {t("search.title")} - + {title}