From 7528243daa27843aed77eaf49d1ea1d723aff617 Mon Sep 17 00:00:00 2001
From: Ahmed El-Helw <ahmedre@gmail.com>
Date: Tue, 17 Dec 2024 00:08:16 +0400
Subject: [PATCH] Fix header being flipped for Arabic

Previously, the footer page number was fixed for Arabic. The same fix
should also apply to the header.
---
 .../linebyline/ui/QuranHeaderFooter.kt        | 25 +++++++++++++------
 .../feature/linebyline/ui/QuranPageWrapper.kt | 22 +++++-----------
 2 files changed, 24 insertions(+), 23 deletions(-)

diff --git a/feature/linebyline/src/main/java/com/quran/labs/androidquran/extra/feature/linebyline/ui/QuranHeaderFooter.kt b/feature/linebyline/src/main/java/com/quran/labs/androidquran/extra/feature/linebyline/ui/QuranHeaderFooter.kt
index 35327b4b9e..bf28929c70 100644
--- a/feature/linebyline/src/main/java/com/quran/labs/androidquran/extra/feature/linebyline/ui/QuranHeaderFooter.kt
+++ b/feature/linebyline/src/main/java/com/quran/labs/androidquran/extra/feature/linebyline/ui/QuranHeaderFooter.kt
@@ -7,8 +7,11 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.platform.LocalLayoutDirection
+import androidx.compose.ui.unit.LayoutDirection
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.min
 import androidx.compose.ui.unit.sp
@@ -20,13 +23,21 @@ fun QuranHeaderFooter(
   color: Color,
   modifier: Modifier = Modifier,
 ) {
-  BoxWithConstraints {
-    val fontSize = (min(this.maxWidth, 480.dp) * 0.0345f).value.sp
-    Row(modifier = modifier.padding(vertical = 2.dp)) {
-      val textStyle = MaterialTheme.typography.subtitle2.copy(fontSize = fontSize)
-      Text(left, style = textStyle, color = color)
-      Spacer(modifier = Modifier.weight(1f, true))
-      Text(right, style = textStyle, color = color)
+  // always render the footer as LTR, otherwise, the page number will be rendered
+  // on the wrong side of the page for RTL due to Row being smart and flipping the
+  // children based on LTR/RTL. We want this flipping for the header and footer
+  // so that the page number is always on the right side for odd numbered
+  // pages and always on the left side for even numbered pages, and likewise with
+  // the juz' number and sura name.
+  CompositionLocalProvider(LocalLayoutDirection provides LayoutDirection.Ltr) {
+    BoxWithConstraints {
+      val fontSize = (min(this.maxWidth, 480.dp) * 0.0345f).value.sp
+      Row(modifier = modifier.padding(vertical = 2.dp)) {
+        val textStyle = MaterialTheme.typography.subtitle2.copy(fontSize = fontSize)
+        Text(left, style = textStyle, color = color)
+        Spacer(modifier = Modifier.weight(1f, true))
+        Text(right, style = textStyle, color = color)
+      }
     }
   }
 }
diff --git a/feature/linebyline/src/main/java/com/quran/labs/androidquran/extra/feature/linebyline/ui/QuranPageWrapper.kt b/feature/linebyline/src/main/java/com/quran/labs/androidquran/extra/feature/linebyline/ui/QuranPageWrapper.kt
index e3246342de..23f0f778f1 100644
--- a/feature/linebyline/src/main/java/com/quran/labs/androidquran/extra/feature/linebyline/ui/QuranPageWrapper.kt
+++ b/feature/linebyline/src/main/java/com/quran/labs/androidquran/extra/feature/linebyline/ui/QuranPageWrapper.kt
@@ -5,15 +5,12 @@ import androidx.compose.foundation.clickable
 import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.runtime.Composable
-import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.ColorFilter
 import androidx.compose.ui.graphics.ImageBitmap
 import androidx.compose.ui.platform.LocalConfiguration
-import androidx.compose.ui.platform.LocalLayoutDirection
-import androidx.compose.ui.unit.LayoutDirection
 import com.quran.data.source.PageContentType
 import com.quran.labs.androidquran.extra.feature.linebyline.model.PageInfo
 import com.quran.labs.androidquran.extra.feature.linebyline.model.SidelinesPosition
@@ -135,19 +132,12 @@ fun QuranPageWrapper(
           "" to displayInfo.localizedPageText
         }
 
-        // always render the footer as LTR, otherwise, the page number will be rendered
-        // on the wrong side of the page for RTL due to Row being smart and flipping the
-        // children based on LTR/RTL. We want this flipping for the header, but not for
-        // the footer, so that the page number is always on the right side for odd numbered
-        // pages and always on the left side for even numbered pages.
-        CompositionLocalProvider(LocalLayoutDirection provides LayoutDirection.Ltr) {
-          QuranHeaderFooter(
-            leftText,
-            rightText,
-            overlayColor,
-            modifier = Modifier
-          )
-        }
+        QuranHeaderFooter(
+          leftText,
+          rightText,
+          overlayColor,
+          modifier = Modifier
+        )
       } else {
         Spacer(modifier = Modifier)
       }