+
+
+
{children}
diff --git a/app/xassida/components/Verses/VerseAndTranslation.tsx b/app/xassida/components/Verses/VerseAndTranslation.tsx
index fd69d42..b522eb4 100644
--- a/app/xassida/components/Verses/VerseAndTranslation.tsx
+++ b/app/xassida/components/Verses/VerseAndTranslation.tsx
@@ -1,6 +1,6 @@
"use client"
-import React from "react"
+import React, { useMemo } from "react"
import { readerSelector } from "@/zustand/slices/reader"
import { useStore } from "@/zustand/store"
import { Play } from "lucide-react"
@@ -19,11 +19,17 @@ interface Props {
}
const VerseAndTranslation: React.FC
= ({ verse, font, last, more }) => {
- const { translation, translationFontScale } = useStore(readerSelector)
+ const { translation, translationFontScale, translationLang } =
+ useStore(readerSelector)
const elemRef = React.useRef(null)
const ref = useObserveElement(more)
+ const getTranslation = useMemo(() => {
+ const trans = verse.translations.filter((t) => t.lang === translationLang)
+ return trans?.[0]
+ }, [translationLang, verse.translations])
+
React.useEffect(() => {
ref(elemRef.current)
}, [ref])
@@ -43,7 +49,7 @@ const VerseAndTranslation: React.FC = ({ verse, font, last, more }) => {
className="mt-4 font-sans"
style={{ fontSize: translationFontScale }}
>
- {verse.translations?.[0]?.text}
+ {getTranslation?.text}
)}
diff --git a/components/Navbar/NavigationDrawer/DonationCard.tsx b/components/Navbar/NavigationDrawer/DonationCard.tsx
index 56845fb..f9786c2 100644
--- a/components/Navbar/NavigationDrawer/DonationCard.tsx
+++ b/components/Navbar/NavigationDrawer/DonationCard.tsx
@@ -20,15 +20,15 @@ const DonationCard = () => (