Fix/arabic font style jumua screen (#1510)

* fix: Improve Quran Download and Navigation Experience (#1452)

* fix: Ensure correct Moshaf type (Hafs) is displayed after download

* fix: display Hafs Quran correctly and remove success dialog

- Set Hafs as default Moshaf type if none is selected.
- Auto-dismiss success dialog on download completion.
- Improved state invalidation for Quran reading updates.
- Added FocusNode for better dialog interaction.
- Optimized resource management with keepAlive and link.close().

* fix: improve Quran Download and Navigation Experience

- Redirect user to Quran reading screen automatically after successful download and extraction of Quran (Hafs).
- Remove the unnecessary "OK" button to confirm Quran download completion, streamlining the user experience.
- Enhance state management for download-related UI in `quran_reading_screen.dart` to handle various download states (needed, downloading, extracting).
- Update `download_quran_popup.dart` to ensure proper navigation based on the user's first-time download experience.
- Improve error handling and loading indicators for a smoother and more intuitive flow.

* fix formating

* Update pubspec.yaml

* fix: Resolve overlapping and focus issues for Back and Switch buttons (#1457)

* fix: Resolve pop-up issue when selecting Listening mode (#1455)

- updated `_handleNavigation` method in `quran_mode_selection_screen.dart` to use `async/await` for ensuring proper completion of Quran mode selection before navigation.
- fixed unexpected pop-ups by adjusting the handling of the `moshafType` state in `download_quran_popup.dart`.
- improved navigation flow for both Reading and Listening modes, ensuring seamless user experience.

Co-authored-by: Ghassen Ben Zahra <ghassen.benzahra@gmail.com>

* Update pubspec.yaml

* fix merger conflict'

* fix arbic font style jumua screen

* refactor: rename HadithScreen to DisplayTextWidget and improve re-usability

* fix formatting of the code

---------

Co-authored-by: Yassin Nouh <70436855+YassinNouh21@users.noreply.github.com>
Co-authored-by: Ibrahim ZEHHAF <97339607+ibrahim-zehhaf-mawaqit@users.noreply.github.com>
Co-authored-by: Yassin <yassinnouh21@gmail.com>

lib/src/pages/home/sub_screens/AfterAdhanHadithSubScreen.dart

@@ -6,7 +6,7 @@ import 'package:mawaqit/const/resource.dart';
 import 'package:mawaqit/i18n/l10n.dart';
 import 'package:mawaqit/src/helpers/RelativeSizes.dart';
 import 'package:mawaqit/src/helpers/StringUtils.dart';
-import 'package:mawaqit/src/pages/home/widgets/HadithScreen.dart';
+import 'package:mawaqit/src/widgets/display_text_widget.dart';
 import 'package:provider/provider.dart';
 
 import '../../../const/constants.dart';
@@ -69,7 +69,7 @@ class _AfterAdhanSubScreenState extends State<AfterAdhanSubScreen> {
           fit: BoxFit.cover,
         ),
       ),
-      child: HadithWidget(
+      child: DisplayTextWidget.normal(
         maxHeight: 35,
         title: arTranslation.afterAdhanHadithTitle,
         arabicText: arTranslation.afterSalahHadith,

lib/src/pages/home/sub_screens/AfterSalahAzkarScreen.dart

@@ -6,7 +6,7 @@ import 'package:flutter_gen/gen_l10n/app_localizations_ar.dart';
 import 'package:mawaqit/const/resource.dart';
 import 'package:mawaqit/i18n/l10n.dart';
 import 'package:mawaqit/src/pages/home/widgets/AboveSalahBar.dart';
-import 'package:mawaqit/src/pages/home/widgets/HadithScreen.dart';
+import 'package:mawaqit/src/widgets/display_text_widget.dart';
 import 'package:mawaqit/src/pages/home/widgets/salah_items/responsive_mini_salah_bar_widget.dart';
 import 'package:mawaqit/src/services/mosque_manager.dart';
 import 'package:provider/provider.dart';
@@ -106,7 +106,7 @@ class _AfterSalahAzkarState extends State<AfterSalahAzkar> {
           SizedBox(height: 10),
           AboveSalahBar(),
           Expanded(
-            child: HadithWidget(
+            child: DisplayTextWidget(
               title: widget.azkarTitle,
               arabicText: arabicHadith,
               translatedText: translatedHadith,

lib/src/pages/home/sub_screens/DuaaBetweenAdhanAndIqama.dart

@@ -2,7 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_animate/flutter_animate.dart';
 import 'package:flutter_gen/gen_l10n/app_localizations_ar.dart';
 import 'package:mawaqit/i18n/l10n.dart';
-import 'package:mawaqit/src/pages/home/widgets/HadithScreen.dart';
+import 'package:mawaqit/src/widgets/display_text_widget.dart';
 import 'package:mawaqit/src/services/mosque_manager.dart';
 import 'package:provider/provider.dart';
 
@@ -39,7 +39,7 @@ class _DuaaBetweenAdhanAndIqamaaScreenState extends State<DuaaBetweenAdhanAndIqa
 
   @override
   Widget build(BuildContext context) {
-    return HadithWidget(
+    return DisplayTextWidget(
       title: 'الدعاء لا يرد بين الأذان والإقامة',
       arabicText: arabicTr.duaaBetweenSalahAndAdhan,
       translatedText: S.of(context).duaaBetweenSalahAndAdhan,

lib/src/pages/home/sub_screens/DuaaEftarScreen.dart

@@ -2,7 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_gen/gen_l10n/app_localizations_ar.dart';
 import 'package:mawaqit/i18n/l10n.dart';
 import 'package:mawaqit/src/pages/home/widgets/AboveSalahBar.dart';
-import 'package:mawaqit/src/pages/home/widgets/HadithScreen.dart';
+import 'package:mawaqit/src/widgets/display_text_widget.dart';
 import 'package:mawaqit/src/pages/home/widgets/salah_items/responsive_mini_salah_bar_widget.dart';
 import 'package:mawaqit/src/services/audio_manager.dart';
 import 'package:mawaqit/src/services/mosque_manager.dart';
@@ -44,7 +44,7 @@ class _DuaaEftarScreenState extends State<DuaaEftarScreen> {
       children: [
         AboveSalahBar(),
         Expanded(
-          child: HadithWidget(
+          child: DisplayTextWidget(
             title: arabic.duaaElEftar,
             arabicText: arabic.duaaElEftarText,
             translatedText: S.of(context).duaaElEftarText,

lib/src/pages/home/sub_screens/JumuaHadithSubScreen.dart

@@ -2,7 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_gen/gen_l10n/app_localizations_ar.dart';
 import 'package:mawaqit/i18n/l10n.dart';
 import 'package:mawaqit/src/pages/home/widgets/AboveSalahBar.dart';
-import 'package:mawaqit/src/pages/home/widgets/HadithScreen.dart';
+import 'package:mawaqit/src/widgets/display_text_widget.dart';
 import 'package:mawaqit/src/pages/home/widgets/salah_items/responsive_mini_salah_bar_widget.dart';
 import 'package:mawaqit/src/services/mosque_manager.dart';
 import 'package:provider/provider.dart';
@@ -30,7 +30,7 @@ class JumuaHadithSubScreen extends StatelessWidget {
           child: AboveSalahBar(),
         ),
         Expanded(
-          child: HadithWidget(
+          child: DisplayTextWidget(
             title: tr.jumuaaScreenTitle,
             arabicText: jumuaArHadith,
             translatedText: tr.jumuaaHadith,

lib/src/pages/home/sub_screens/RandomHadithScreen.dart

@@ -4,7 +4,7 @@ import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:mawaqit/const/resource.dart';
 import 'package:mawaqit/src/helpers/RelativeSizes.dart';
 import 'package:mawaqit/src/pages/home/widgets/AboveSalahBar.dart';
-import 'package:mawaqit/src/pages/home/widgets/HadithScreen.dart';
+import 'package:mawaqit/src/widgets/display_text_widget.dart';
 import 'package:mawaqit/src/pages/home/widgets/salah_items/responsive_mini_salah_bar_widget.dart';
 import 'package:provider/provider.dart';
 
@@ -64,7 +64,7 @@ class _RandomHadithScreenState extends ConsumerState<RandomHadithScreen> {
             // ),
             child: hadithState.when(
               data: (hadith) {
-                return HadithWidget(
+                return DisplayTextWidget.hadith(
                   translatedText: hadith.hadith,
                   textDirection: StringManager.getTextDirectionOfLocal(
                     Locale(mosqueManager.mosqueConfig!.hadithLang ?? 'en'),

lib/src/pages/home/sub_screens/takberat_aleid_screen.dart

@@ -2,7 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_animate/flutter_animate.dart';
 import 'package:mawaqit/i18n/l10n.dart';
 import 'package:mawaqit/src/pages/home/widgets/AboveSalahBar.dart';
-import 'package:mawaqit/src/pages/home/widgets/HadithScreen.dart';
+import 'package:mawaqit/src/widgets/display_text_widget.dart';
 import 'package:mawaqit/src/pages/home/widgets/salah_items/responsive_mini_salah_bar_widget.dart';
 import 'package:mawaqit/src/services/audio_manager.dart';
 import 'package:mawaqit/src/services/mosque_manager.dart';
@@ -49,7 +49,7 @@ class _TakberatAleidScreenState extends State<TakberatAleidScreen> {
         children: [
           AboveSalahBar(),
           Expanded(
-            child: HadithWidget(
+            child: DisplayTextWidget(
               title: S.of(context).eidMubarak,
               translatedText: S.of(context).takbeerAleidText,
               mainAxisAlignment: MainAxisAlignment.start,

lib/src/pages/home/widgets/HadithScreen.dart → lib/src/widgets/display_text_widget.dart

@@ -2,20 +2,15 @@ import 'package:auto_size_text/auto_size_text.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_animate/flutter_animate.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
-import 'package:google_fonts/google_fonts.dart';
-import 'package:mawaqit/i18n/AppLanguage.dart';
 import 'package:mawaqit/src/helpers/RelativeSizes.dart';
 import 'package:mawaqit/src/helpers/repaint_boundaries.dart';
-import 'package:mawaqit/src/services/mosque_manager.dart';
 import 'package:mawaqit/src/services/theme_manager.dart';
 import 'package:mawaqit/src/state_management/random_hadith/random_hadith_notifier.dart';
 import 'package:mawaqit/src/themes/UIShadows.dart';
-import 'package:provider/provider.dart';
 
-/// this screen made to show of the hadith screen
-class HadithWidget extends ConsumerWidget {
-  HadithWidget({
-    Key? key,
+class DisplayTextWidget extends ConsumerWidget {
+  const DisplayTextWidget({
+    super.key,
     this.title,
     this.arabicText,
     this.translatedTitle,
@@ -24,31 +19,64 @@ class HadithWidget extends ConsumerWidget {
     this.maxHeight = 50,
     this.mainAxisAlignment = MainAxisAlignment.center,
     this.padding,
-  }) : super(key: key);
+    this.isHadith = false, // Add this flag to determine the mode
+  });
 
-  final EdgeInsetsGeometry? padding;
+  // Factory constructor for normal display
+  factory DisplayTextWidget.normal({
+    Key? key,
+    required String title,
+    required String arabicText,
+    required String translatedTitle,
+    required String translatedText,
+    TextDirection? textDirection,
+    double maxHeight = 50,
+    MainAxisAlignment mainAxisAlignment = MainAxisAlignment.center,
+    EdgeInsetsGeometry? padding,
+  }) {
+    return DisplayTextWidget(
+      key: key,
+      title: title,
+      arabicText: arabicText,
+      translatedTitle: translatedTitle,
+      translatedText: translatedText,
+      textDirection: textDirection,
+      maxHeight: maxHeight,
+      mainAxisAlignment: mainAxisAlignment,
+      padding: padding,
+      isHadith: false,
+    );
+  }
 
-  /// The main title of the screen
-  final String? title;
+  // Factory constructor for hadith display
+  factory DisplayTextWidget.hadith({
+    Key? key,
+    String? translatedText,
+    TextDirection? textDirection,
+    double maxHeight = 50,
+    MainAxisAlignment mainAxisAlignment = MainAxisAlignment.center,
+    EdgeInsetsGeometry? padding,
+  }) {
+    return DisplayTextWidget(
+      key: key,
+      translatedText: translatedText,
+      textDirection: textDirection,
+      maxHeight: maxHeight,
+      mainAxisAlignment: mainAxisAlignment,
+      padding: padding,
+      isHadith: true,
+    );
+  }
 
-  /// arabic text of the hadith screen
+  final EdgeInsetsGeometry? padding;
+  final String? title;
   final String? arabicText;
-
-  /// translated title of the hadith
   final String? translatedTitle;
-
-  /// translated text of the hadith
   final String? translatedText;
-
-  /// force the text direction of the translated text
-  /// used for random hadith because hadith language is not the same as the app language
   final TextDirection? textDirection;
-
-  /// alignment of the item along the main axis
   final MainAxisAlignment mainAxisAlignment;
-
-  // Max height constraint
   final double maxHeight;
+  final bool isHadith;
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
@@ -57,9 +85,7 @@ class HadithWidget extends ConsumerWidget {
         try {
           final lang = state.maybeWhen(
             orElse: () => 'ar',
-            data: (state) {
-              return state.language;
-            },
+            data: (state) => state.language,
           );
           return Locale(lang);
         } catch (e) {
@@ -131,23 +157,29 @@ class HadithWidget extends ConsumerWidget {
     Duration? delay,
   }) {
     return Flexible(
-      fit: FlexFit.tight,
+      fit: isHadith ? FlexFit.tight : FlexFit.loose,
       child: Container(
         constraints: BoxConstraints(maxHeight: maxHeight.vh),
         child: Padding(
           key: ValueKey(text),
-          padding: const EdgeInsets.symmetric(
+          padding: EdgeInsets.symmetric(
             horizontal: 8.0,
-            vertical: 16,
+            vertical: isHadith ? 16.0 : 0.0,
           ),
           child: AutoSizeText(
             text,
-            style: context.getLocalizedTextStyle(locale: hadithLanguage).copyWith(
-                  color: Colors.white,
-                  shadows: kIqamaCountDownTextShadow,
-                  fontWeight: FontWeight.bold,
-                  fontSize: 600,
-                ),
+            style: isHadith
+                ? context.getLocalizedTextStyle(locale: hadithLanguage).copyWith(
+                      color: Colors.white,
+                      shadows: kIqamaCountDownTextShadow,
+                      fontWeight: FontWeight.bold,
+                      fontSize: 600,
+                    )
+                : TextStyle(
+                    fontSize: 600,
+                    color: Colors.white,
+                    shadows: kIqamaCountDownTextShadow,
+                  ),
             textAlign: TextAlign.center,
             textDirection: textDirection,
           ).animate().fadeIn(delay: delay).addRepaintBoundary(),