merge

lib/config/my_router.dart

@@ -656,8 +656,7 @@ final GoRouter router = GoRouter(
 
       GoRoute(
         path: '/countryprofile',
-        builder: (context, state) => const CountryProfilePage(),
-
+        builder: (context, state) => const ListCountriesRoute(),
       ),
       GoRoute(
         path: '/country-profile-detail',
@@ -673,7 +672,9 @@ final GoRouter router = GoRouter(
         path: '/reportDetail',
         builder: (context, state) {
           final report = state.extra as Map<String, dynamic>;
-          return ReportDetailPage();
+          return ReportDetailPage(
+            title:report['title']!,
+          );
         },
       ),
 

lib/infrastructure/services/img_asset_paths/icons/popup_asset_path.dart

@@ -0,0 +1,23 @@
+abstract class PopupAssetPath {
+  static const _basePath = 'assets/country-profile/icons';
+  static const capital = '$_basePath/capital.png';
+  static const area = '$_basePath/area.png';
+  static const exports = '$_basePath/exports.png';
+  static const female = '$_basePath/female.png';
+  static const imports = '$_basePath/imports.png';
+  static const IncomeLevel = '$_basePath/IncomLevel.png';
+  static const inflows = '$_basePath/inflows.png';
+  static const male = '$_basePath/male.png';
+  static const nominal = '$_basePath/nominal.png';
+  static const outflows = '$_basePath/outflows.png';
+  static const perCapita = '$_basePath/perCapita.png';
+  static const population = '$_basePath/population.png';
+  static const real = '$_basePath/real.png';
+  static const stocks = '$_basePath/stocks.png';
+  static const trade = '$_basePath/trade.png';
+  static const vegetable = '$_basePath/vegetable.png';
+  static const metal = '$_basePath/metal.png';
+  static const food = '$_basePath/food.png';
+  static const chemical = '$_basePath/chemical.png';
+  static const animal = '$_basePath/animal.png';
+}

lib/l10n/intl_ar.arb

@@ -1,8 +1,8 @@
 {
   "all_bookmarks":"كل العلامات المرجعية",
-  "economy_title":"الاقتصاد",
-  "social_title":"الاجتماعي",
-  "environment_title":"البيئة",
+  "economy_title":"اقتصاد",
+  "social_title":"اجتماعي",
+  "environment_title":"بيئة",
   "bookmarks": "الإشارات المرجعية",
   "searchCountry": "Search Country",
   "feedback_title": "تعليق",

lib/presentation/Screens/Bottom Navigation Pages/Competitiveness/Detailedcompetitiveness.dart

@@ -4,157 +4,220 @@ import 'package:uae_stat/domain/use_cases/language.dart';
 import 'package:uae_stat/presentation/routes/drawer_routes/custom_drawer_routes.dart';
 
 class ReportDetailPage extends StatelessWidget {
-  const ReportDetailPage({super.key});
+  final String title;
+   ReportDetailPage({super.key, required this.title});
+
+
 
   @override
+
   Widget build(BuildContext context) {
-    return BaseScaffold(
-      title: Text(
-        context.translate(
-          'UAE Competitiveness',
-          'التقارير التنافسيه لدولة الامارات',
-        ),
-        style: TextStyle(
-          fontFamily: context.translate('Roboto', 'NotoKufi'),
+     late String rank;
+     late String edition;
+     late String para;
+    final List<Map<String, dynamic>> contentData=[
+      {
+        'title':context.translate('Prosperity Index (2023)', 'تقرير مؤشر الازدهار (2023)',),'rank':'44' ,'edition':'41','content':                  context.translate(
+        'The Legatum Prosperity Index is published annually by the Legatum Institute. It is a policy-focused report that measures the current state of prosperity since 2007. Using the Prosperity Index framework, nations around the world can assess their strengths and weaknesses in order to determine the economic and strategic choices that need to be made to further build inclusive societies, open economies, and empowered people to drive greater levels of prosperity.',
+        'تم إصدار تقرير مؤشر الازدهار من قبل معهد ليجاتم لأول مرة في عام 2007 ويتم إصداره بشكل سنوي. يقيس التقرير جهود 167 دولة لتعزيز رفاه مواطنيها عبر 12 محور التي تضم 300 مؤشر (منقسمين إلى 192 بيانات إحصائية و108 استبيانات).',
+      ),
+      },
+      {
+        'title':context.translate('World Happiness Report (2023)', 'تقرير مؤشر الازدهار (2023)',),'rank':'24' ,'edition':'26','content': context.translate(
+        'The World Happiness Report was first published in 2012, by the United Nations Sustainable Development Solutions Network (UNSDSN).',
+        'تقرير السعادة العالمية يصدر سنوياً عن شبكة تنمية الحلول المستدامة التابعة للأمانة العامة للأمم المتحدة.',
+      ),
+      },
+      {
+        'title':context.translate('Logistics Performance Index (2023)', 'تقرير مؤشر الازدهار (2023)',),'rank':'7' ,'edition':'11','content':                  context.translate(
+        'The Logistics Performance Index (LPI) report is a tool developed by the World Bank to measure a country\'s logistics performance. The report uses a range of indicators such as customs performance, infrastructure quality, and logistics competence to assess a countrys logistics strengths and weaknesses. The latest report highlights the importance of efficient logistics systems for economic growth and competitiveness, and emphasizes the need for investment in infrastructure and digitalization. The LPI report is a valuable resource for policymakers and businesses looking to understand a country\'s logistics performance and identify areas for improvement.',
+        'تقرير مؤشر أداء الخدمات اللوجستية (LPI) هو أداة طورها البنك الدولي لقياس أداء الخدمات اللوجستية في بلد ما. يستخدم التقرير مجموعة من المؤشرات مثل أداء الجمارك ، وجودة البنية التحتية ، والكفاءة اللوجستية لتقييم نقاط القوة والضعف اللوجستية للبلد. يسلط التقرير الأخير الضوء على أهمية النظم اللوجستية الفعالة للنمو الاقتصادي والقدرة التنافسية ، ويؤكد على الحاجة إلى الاستثمار في البنية التحتية والرقمنة. يعد تقرير LPI مورداً قيماً لواضعي السياسات والشركات التي تتطلع إلى فهم الأداء اللوجستي للبلد وتحديد مجالات التحسين.'
+      ),
+      },
+
+    ];
+
+    void ContentChange(){
+      rank = '';
+      edition = '';
+      para = '';
+      for (var content in contentData){
+        print('${content['title']} and  $title   are finout');
+        if(content['title']==title){
+          rank=content['rank'];
+          edition=content['edition'];
+          para=content['content'];
+          print('competiviness change $edition and $rank');
+        }else {
+          rank='40';
+          edition='41';
+          para=  context.translate(
+            'The Legatum Prosperity Index is published annually by the Legatum Institute. It is a policy-focused report that measures the current state of prosperity since 2007. Using the Prosperity Index framework, nations around the world can assess their strengths and weaknesses in order to determine the economic and strategic choices that need to be made to further build inclusive societies, open economies, and empowered people to drive greater levels of prosperity.',
+            'تم إصدار تقرير مؤشر الازدهار من قبل معهد ليجاتم لأول مرة في عام 2007 ويتم إصداره بشكل سنوي. يقيس التقرير جهود 167 دولة لتعزيز رفاه مواطنيها عبر 12 محور التي تضم 300 مؤشر (منقسمين إلى 192 بيانات إحصائية و108 استبيانات).',
+          );
+        }
+      }
+    }
+    ContentChange();
+    return Theme(
+      data: ThemeData(
+        fontFamily: context.translate(
+          'Roboto',
+          'NotoKufi',
         ),
       ),
-      showBackButton: true,
-      body: SingleChildScrollView(
-        padding: const EdgeInsets.all(16.0),
-        child: Column(
-          crossAxisAlignment: CrossAxisAlignment.start,
-          children: [
-            // Header
-            Container(
-              padding: const EdgeInsets.all(12),
-              decoration: BoxDecoration(
-                color: Colors.grey.shade100,
-                borderRadius: BorderRadius.circular(12),
-              ),
-              child: Row(
-                mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                children: [
-                  Expanded(
-                    child: Text(
-                      'Prosperity Index (2023)',
-                      style: TextStyle(
-                        fontSize: 20,
-                        fontWeight: FontWeight.bold,
+      child: BaseScaffold(
+        title: Text(
+          context.translate(
+            'UAE Competitiveness',
+            'التقارير التنافسيه لدولة الامارات',
+          ),
+        ),
+        showBackButton: true,
+        body: SingleChildScrollView(
+          padding: const EdgeInsets.all(16.0),
+          child: Column(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: [
+              // Header
+              Container(
+                padding: const EdgeInsets.all(12),
+                decoration: BoxDecoration(
+                  color: Color(0xFFF5F5F5),
+                  borderRadius: BorderRadius.circular(12),
+                ),
+                child: Row(
+                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                  children: [
+                    Expanded(
+                      child: Text(
+                        title,
+                        // context.translate(
+                        //   'Prosperity Index (2023)',
+                        //   'تقرير مؤشر الازدهار (2023)',
+                        // ),
+                        style: TextStyle(
+                          fontSize: 20,
+                          fontWeight: FontWeight.bold,
+                        ),
                       ),
                     ),
-                  ),
-                  Image.asset(
-                    'assets/competitiveness/solo.png',
-                    height: 71,
-                    width: 84,
-                  ),
-                ],
-              ),
-            ),
-            const SizedBox(height: 24),
-
-            const Text(
-              'The Legatum Prosperity Index is published annually by the Legatum Institute. It is a policy-focused report that measures the current state of prosperity since 2007. Using the Prosperity Index framework, nations around the world can assess their strengths and weaknesses in order to determine the economic and strategic choices that need to be made to further build inclusive societies, open economies, and empowered people to drive greater levels of prosperity.',
-              style: TextStyle(fontSize: 14),
-            ),
-            const SizedBox(height: 24),
-
-            // Ranking section
-            Container(
-              decoration: BoxDecoration(
-                color: Colors.grey[100],
-                borderRadius: BorderRadius.circular(12),
-              ),
-              padding: const EdgeInsets.symmetric(vertical: 12, horizontal: 8),
-              child: Row(
-                children: [
-                  Expanded(
-                    child: _RankingCard(
-                      title: 'Rank in 2023',
-                      value: '44',
-                      icon: const Icon(Icons.arrow_downward, color: Colors.red, size: 25),
+                    Image.asset(
+                      'assets/competitiveness/solo.png',
+                      height: 71,
+                      width: 84,
                     ),
-                  ),
-                  SizedBox(
-                    height: 60,
-                    width: 1,
-                    child: CustomPaint(
-                      painter: DottedLinePainter(),
-                    ),
-                  ),
-                  Expanded(
-                    child: _RankingCard(
-                      title: 'vs. Previous Edition',
-                      value: '41',
-                      icon: const SizedBox.shrink(),
-                    ),
-                  ),
-                ],
+                  ],
+                ),
               ),
-            ),
-            const SizedBox(height: 24),
+              const SizedBox(height: 24),
 
-            // Country ranking section
-            Container(
-              decoration: BoxDecoration(
-                color: const Color(0xFFF5F5F5),
-                borderRadius: BorderRadius.circular(12),
+              SizedBox(
+                height: MediaQuery.of(context).size.height*0.2,
+                child: Text(
+                      para,
+                  style: TextStyle(fontSize: 14),
+                ),
               ),
-              padding: const EdgeInsets.symmetric(vertical: 8),
-              child: Column(
-                children: [
-                  _CountryRankingItem(
-                    title: 'First Globally',
-                    country: 'DENMARK',
-                    flagPath: 'assets/country_flags/de.png',
-                  ),
-                  const Padding(
-                    padding: EdgeInsets.symmetric(horizontal: 8),
-                    child: DottedDivider(),
-                  ),
-                  _CountryRankingItem(
-                    title: 'First in GCC',
-                    country: 'MULTIPLE COUNTRIES',
-                    flagPath: 'assets/competitiveness/multi-frame.jpg',
-                    onTap: () => showDialog(
-                      context: context,
-                      builder: (context) => Dialog(
-                        shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
-                        child: Container(
-                          padding: const EdgeInsets.all(16),
-                          decoration: BoxDecoration(
-                            color: Colors.white,
-                            borderRadius: BorderRadius.circular(12),
-                          ),
-                          child: Column(
-                            mainAxisSize: MainAxisSize.min,
-                            children: [
-                              _CountryItem(name: 'Argentina', flag: 'assets/country_flags/ar.png'),
-                              _CountryItem(name: 'Bahrain', flag: 'assets/country_flags/ba.png'),
-                              _CountryItem(name: 'Denmark', flag: 'assets/country_flags/de.png'),
-                              _CountryItem(name: 'Finland', flag: 'assets/country_flags/fi.png'),
-                              _CountryItem(name: 'Oman', flag: 'assets/country_flags/am.png'),
-                              _CountryItem(name: 'Singapore', flag: 'assets/country_flags/si.png'),
-                              _CountryItem(name: 'Saudi Arabia', flag: 'assets/country_flags/sa.png'),
-                            ],
+              const SizedBox(height: 24),
+
+              // Ranking section
+              Container(
+                decoration: BoxDecoration(
+                  color: Color(0xFFF5F5F5),
+                  borderRadius: BorderRadius.circular(12),
+                ),
+                padding: const EdgeInsets.symmetric(vertical: 3, horizontal: 8),
+                child: Row(
+                  children: [
+                    Expanded(
+                      child: _RankingCard(
+                        title: context.translate('Rank in 2023','تقرير مؤشر الازدهار (2023)'),
+                        value: rank,
+                        icon: const Icon(Icons.arrow_downward, color: Colors.red, size: 25),
+                      ),
+                    ),
+                    SizedBox(
+                      height: 60,
+                      width: 1,
+                      child: CustomPaint(
+                        painter: DottedLinePainter(),
+                      ),
+                    ),
+                    Expanded(
+                      child: _RankingCard(
+                          title: context.translate('vs. Previous Edition','مقابل الإصدار السابق'),
+                        value: edition,
+                        icon: const SizedBox.shrink(),
+                      ),
+                    ),
+                  ],
+                ),
+              ),
+              const SizedBox(height: 24),
+
+              // Country ranking section
+              Container(
+                decoration: BoxDecoration(
+                  color: const Color(0xFFF5F5F5),
+                  borderRadius: BorderRadius.circular(12),
+                ),
+                padding: const EdgeInsets.symmetric(vertical: 8),
+                child: Column(
+                  children: [
+                    _CountryRankingItem(
+                      title: context.translate('First Globally','أولاً عالمياً'),
+                      country: context.translate('DENMARK','الدنمارك'),
+                      flagPath: 'assets/country_flags/de.png',
+                    ),
+                    const Padding(
+                      padding: EdgeInsets.symmetric(horizontal: 8),
+                      child: DottedDivider(),
+                    ),
+                    _CountryRankingItem(
+                      title: 'First in GCC',
+                      country: context.translate('MULTIPLE COUNTRIES','دول متعددة'),
+                      flagPath: 'assets/competitiveness/multi.png',
+                      onTap: () => showDialog(
+                        context: context,
+                        builder: (context) => Dialog(
+                          shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(12)),
+                          child: Container(
+                            padding: const EdgeInsets.all(16),
+                            decoration: BoxDecoration(
+                              color: Colors.white,
+                              borderRadius: BorderRadius.circular(12),
+                            ),
+                            child: Column(
+                              mainAxisSize: MainAxisSize.min,
+                              children: [
+                                _CountryItem(name: context.translate('Argentina','الأرجنتين'), flag: 'assets/country_flags/ar.png'),
+                                _CountryItem(name: context.translate('Bahrain','البحرين') ,flag: 'assets/country_flags/ba.png'),
+                                _CountryItem(name: context.translate('Denmark','الدنمارك'), flag: 'assets/country_flags/de.png'),
+                                _CountryItem(name: context.translate('Finland','فنلندا'), flag: 'assets/country_flags/fi.png'),
+                                _CountryItem(name: context.translate('Oman','عمان') ,flag: 'assets/country_flags/am.png'),
+                                _CountryItem(name: context.translate('Singapore','سنغافورة'), flag: 'assets/country_flags/si.png'),
+                                _CountryItem(name: context.translate('Saudi Arabia','المملكة العربية السعودية'), flag: 'assets/country_flags/sa.png'),
+                              ],
+                            ),
                           ),
                         ),
                       ),
                     ),
-                  ),
-                  const Padding(
-                    padding: EdgeInsets.symmetric(horizontal: 8),
-                    child: DottedDivider(),
-                  ),
-                  _CountryRankingItem(
-                    title: 'First in Arab Countries',
-                    country: 'UNITED ARAB EMIRATES',
-                    flagPath: 'assets/country_flags/ga.png',
-                  ),
-                ],
+                    const Padding(
+                      padding: EdgeInsets.symmetric(horizontal: 8),
+                      child: DottedDivider(),
+                    ),
+                    _CountryRankingItem(
+                      title: context.translate('First in Arab Countries','الأول في دول مجلس التعاون الخليجي'),
+                      country: context.translate('UNITED ARAB EMIRATES','الإمارات العربية المتحدة'),
+                      flagPath: 'assets/country_flags/ga.png',
+                    ),
+                  ],
+                ),
               ),
-            ),
-          ],
+            ],
+          ),
         ),
       ),
     );
@@ -179,14 +242,14 @@ class _RankingCard extends StatelessWidget {
       width: 160,
       padding: const EdgeInsets.all(12),
       decoration: BoxDecoration(
-        color: Colors.grey[100],
+        color:  Color(0xFFF5F5F5),
       ),
       child: Column(
         children: [
           Text(
             title,
             textAlign: TextAlign.center,
-            style: const TextStyle(fontSize: 13, color: Colors.black54),
+            style: TextStyle(fontSize: context.translate(13,11),fontWeight: FontWeight.w500,),
           ),
           const SizedBox(height: 4),
           Row(
@@ -194,8 +257,8 @@ class _RankingCard extends StatelessWidget {
             children: [
               Text(
                 value,
-                style: const TextStyle(
-                  fontSize: 36,
+                style: TextStyle(
+                  fontSize: context.translate(36,32),
                   fontWeight: FontWeight.bold,
                 ),
               ),
@@ -238,13 +301,13 @@ class _CountryRankingItem extends StatelessWidget {
                 children: [
                   Text(
                     title,
-                    style: const TextStyle(fontSize: 14, color: Colors.black54),
+                    style:TextStyle(fontSize: context.translate(14,11), color: Colors.black),
                   ),
                   const SizedBox(height: 4),
                   Text(
                     country,
-                    style: const TextStyle(
-                      fontSize: 20,
+                    style: TextStyle(
+                      fontSize: context.translate(20,18),
                       fontWeight: FontWeight.bold,
                     ),
                   ),
@@ -252,17 +315,29 @@ class _CountryRankingItem extends StatelessWidget {
               ),
             ),
             const SizedBox(width: 16),
-            ClipOval(
-              child: Container(
-                width: 50,
-                height: 50,
-                decoration: const BoxDecoration(
-                  shape: BoxShape.circle,
-                  color: Colors.transparent,
-                ),
-                child: Image.asset(flagPath, width: 50, height: 50, fit: BoxFit.cover),
+
+            Container(
+              padding: EdgeInsets.zero,
+              decoration: BoxDecoration(
+                shape: BoxShape.circle,
+                border: Border.all(color: Colors.white, width: 3),
+              ),
+              child: CircleAvatar(
+                radius: 20,
+                backgroundImage: AssetImage(flagPath,),
               ),
             ),
+            // ClipOval(
+            //   child: Container(
+            //     width: 50,
+            //     height: 50,
+            //     decoration: const BoxDecoration(
+            //       shape: BoxShape.circle,
+            //       color: Colors.transparent,
+            //     ),
+            //     child: Image.asset(flagPath, width: 50, height: 50, fit: BoxFit.cover),
+            //   ),
+            // ),
           ],
         ),
       ),

lib/presentation/Screens/Bottom Navigation Pages/Competitiveness/competitiveness.dart

@@ -14,20 +14,26 @@ class Competitiveness extends StatelessWidget {
         if (didPop) return;
         context.go('/myhomepage');
       },
-      child: BaseScaffold(
-        title: Text(
-          context.translate(
-            'UAE Competitiveness',
-            'تنافسية دولة الإمارات العربية المتحدة',
-          ),
-          style: TextStyle(
-              fontFamily: context.translate(
-                'Roboto',
-                'NotoKufi',
-              )
+      child: Theme(
+        data: ThemeData(
+          fontFamily: context.translate(
+            'Roboto',
+            'NotoKufi',
           ),
         ),
-        body: CompetitivenessState(context),
+        child: BaseScaffold(
+          mytitleColor: Colors.black,
+          title: Text(
+            context.translate(
+              'UAE Competitiveness',
+              'تنافسية دولة الإمارات العربية المتحدة',
+            ),
+            style: TextStyle(
+              fontSize: context.translate(22, 16),
+            ),
+          ),
+          body: CompetitivenessState(context),
+        ),
       ),
     );
   }
@@ -36,59 +42,76 @@ class Competitiveness extends StatelessWidget {
     final List<Map<String, dynamic>> reports = [
       {
         'rank': 44,
+        'title-ar':'تقرير مؤشر الازدهار (2023)',
         'title': 'Prosperity Index (2023)',
         'logo': 'assets/competitiveness/solo.png',
         'borderColor': Colors.blue,
       },
       {
         'rank': 26,
+        'title-ar':'تقرير السعادة العالمية (2023)',
         'title': 'World Happiness Report (2023)',
         'logo': 'assets/competitiveness/soloo.png',
         'borderColor': Color(0xFF844F36),
       },
       {
         'rank': 7,
+        'title-ar':'مؤشر أداء الخدمات اللوجستية (2023)',
         'title': 'Logistics Performance Index (2023)',
         'logo': 'assets/competitiveness/solo.png',
         'borderColor': Colors.blue,
       },
       {
         'rank': 10,
+        'title-ar':'مؤشر الإرهاب العالمي (2023)',
         'title': 'Global Soft Power Index (2023)',
         'logo': 'assets/competitiveness/soloo.png',
         'borderColor': Colors.blue,
       },
       {
         'rank': 76,
+        'title-ar':'مؤشر الإرهاب العالمي (2023)',
         'title': 'Global Terrorism Index (2023)',
         'logo': 'assets/competitiveness/solo.png',
         'borderColor': Color(0xFF844F36),
       },
       {
         'rank': 10,
+        'title-ar':'الكتاب السنوي للتنافسية العالمية (2023)',
         'title': 'The World Competitiveness Yearbook (2023)',
         'logo': 'assets/competitiveness/soloo.png',
         'borderColor': Colors.blue,
       },
       {
         'rank': 71,
+        'title-ar':'تقرير الفجوة بين الجنسين العالمية (2023)',
         'title': 'Global Gender Gap Report (2023)',
         'logo': 'assets/competitiveness/solo.png',
         'borderColor': Colors.blue,
       },
       {
         'rank': 29,
+        'title-ar':'مؤشر الأداء الصناعي التنافسي (2023)',
         'title': 'Competitive Industrial Performance Index (2023)',
         'logo': 'assets/competitiveness/soloo.png',
         'borderColor': Color(0xFF844F36),
       },
     ];
 
+    Widget rankDivider=Container(
+      margin: EdgeInsets.all(5),
+      width: 1,
+      height: 40,
+      color: Colors.grey,
+    );
+
     return Column(
       children: [
         SizedBox(height: 16),
         Text(
-          '(22) Competitive Reports',
+          context.translate(
+            '(22) Competitive Reports',
+            'التقارير التنافسية (22)',),
           style: TextStyle(fontSize: 16, fontWeight: FontWeight.w600),
         ),
         SizedBox(height: 12),
@@ -102,7 +125,9 @@ class Competitiveness extends StatelessWidget {
                 child: InkWell(
                   onTap: () {
                     // Navigate to detail page with arguments
-                    context.push('/reportDetail', extra: report);
+                    context.push('/reportDetail', extra:{
+                      'title':context.translate(report['title'],report['title-ar']),
+                    });
                   },
                   child: Container(
                     decoration: BoxDecoration(
@@ -126,10 +151,11 @@ class Competitiveness extends StatelessWidget {
                             ),
                           ],
                         ),
-                        const SizedBox(width: 12),
+                        const SizedBox(width: 8),
+                        rankDivider,
                         Expanded(
                           child: Text(
-                            report['title'],
+                            context.translate(report['title'],report['title-ar']),
                             style: const TextStyle(fontSize: 14, fontWeight: FontWeight.w500),
                           ),
                         ),

lib/presentation/Screens/Bottom Navigation Pages/Country_Profile/country_profile.dart

@@ -1,7 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_gen/gen_l10n/app_localizations.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
-import 'package:shared_preferences/shared_preferences.dart';
 import 'package:go_router/go_router.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 import 'package:uae_stat/config/theme/theme_provider.dart';
@@ -9,18 +8,191 @@ import 'package:uae_stat/domain/use_cases/language.dart';
 import 'package:uae_stat/infrastructure/services/img_asset_paths/icons/misc_icon_asset_path.dart';
 import 'package:uae_stat/presentation/routes/drawer_routes/custom_drawer_routes.dart';
 import 'package:fl_chart/fl_chart.dart';
+import 'package:external_repos/external_repos.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
+import 'package:flutter_svg/svg.dart';
+import 'package:hooks_riverpod/hooks_riverpod.dart';
 
-final localeProvider = StateProvider<Locale>((ref) => const Locale('en'));
+// final localeProvider = StateProvider<Locale>((ref) => const Locale('en'));
 
-class CountryProfilePage extends ConsumerStatefulWidget {
-  const CountryProfilePage({Key? key}) : super(key: key);
+// class CountryProfilePage extends ConsumerStatefulWidget {
+//   const CountryProfilePage({Key? key}) : super(key: key);
+//
+//   @override
+//   ConsumerState<CountryProfilePage> createState() => _CountryProfilePageState();
+// }
+//
+// class _CountryProfilePageState extends ConsumerState<CountryProfilePage> {
+//   final TextEditingController _searchController = TextEditingController();
+//
+//   final List<Map<String, String>> _allCountries = [
+//     {"name": "Afghanistan", "flag": "🇦🇫",'code':'AF'},
+//     {"name": "Albania", "flag": "🇦🇱",'code':'AL'},
+//     {"name": "Algeria", "flag": "🇩🇿",'code':'DZ'},
+//     {"name": "American Samoa", "flag": "🇦🇸",'code':'AS'},
+//     {"name": "Andorra", "flag": "🇦🇩",'code':'AD'},
+//     {"name": "Angola", "flag": "🇦🇴",'code':'AO'},
+//     {"name": "Anguilla", "flag": "🇦🇮",'code':'AI'},
+//     {"name": "Antigua And Barbuda", "flag": "🇦🇬",'code':'AG'},
+//     {"name": "Argentina", "flag": "🇦🇷",'code':'AR'},
+//     {"name": "Armenia", "flag": "🇦🇲",'code':'AM'},
+//     {"name": "Aruba", "flag": "🇦🇼",'code':'AW'},
+//     {"name": "Australia", "flag": "🇦🇺",'code':'AU'},
+//     {"name": "Austria", "flag": "🇦🇹",'code':'AT'},
+//     {"name": "Azerbaijan", "flag": "🇦🇿",'code':'AZ'},
+//     {"name": "Bahamas", "flag": "🇧🇸",'code':'BS'},
+//     {"name": "Bahrain", "flag": "🇧🇭",'code':'BH'},
+//     {"name": "Bangladesh", "flag": "🇧🇩",'code':'BD'},
+//   ];
+//
+//   String _searchTerm = '';
+//
+//   void filterData(String value) {
+//     setState(() => _searchTerm = value);
+//   }
+//
+//   @override
+//   Widget build(BuildContext context) {
+//     final locale = AppLocalizations.of(context)!;
+//     final filtered = _allCountries
+//         .where((c) => c['name']!.toLowerCase().contains(_searchTerm.toLowerCase()))
+//         .toList();
+//
+//     double myheight = MediaQuery.of(context).size.height;
+//     double mywidth = MediaQuery.of(context).size.width;
+//
+//     return PopScope(
+//       canPop: false,
+//       onPopInvokedWithResult: (didPop, result) {
+//         if (didPop) return;
+//         context.go('/myhomepage');
+//       },
+//       child: BaseScaffold(
+//         title: Text(
+//           context.translate(
+//             'Country Profile',
+//             'ملف الدولة',
+//           ),
+//           style: TextStyle(
+//               fontFamily: context.translate(
+//                 'Roboto',
+//                 'NotoKufi',
+//               )
+//           ),
+//         ),
+//         body: Column(
+//           children: [
+//             Padding(
+//               padding: const EdgeInsets.symmetric(horizontal: 12.0, vertical: 12.0),
+//               child: Container(
+//                 decoration: BoxDecoration(
+//                   color: Colors.white,
+//                   borderRadius: BorderRadius.circular(30.0),
+//                   border: Border.all(width: 1, color: Color(0xFFAA8E83)),
+//                 ),
+//                 child: TextField(
+//                   controller: _searchController,
+//                   onChanged: (value) {
+//                     filterData(value);
+//                   },
+//                   decoration: InputDecoration(
+//                     hintText: AppLocalizations.of(context)!.searchCountry,
+//                     hintStyle: TextStyle(
+//                       color: Color(0xFFAA8E83),
+//                       fontFamily: context.translate('Roboto', 'NotoKufi'),
+//                       fontSize: 14,
+//                       height: 1.8,
+//                     ),
+//                     prefixIconConstraints: BoxConstraints(
+//                       maxWidth: 42,
+//                       maxHeight: 42,
+//                     ),
+//                     prefixIcon: Container(
+//                       padding: EdgeInsets.only(right: 5, left: 5),
+//                       alignment: Alignment.center,
+//                       child: SvgPicture.asset(
+//                         MiscIconAssetPath.Search,
+//                         semanticsLabel: 'Search',
+//                         colorFilter: ColorFilter.mode(Color(0xFFAA8E83), BlendMode.srcIn),
+//                         height: 18,
+//                         width: 18,
+//                       ),
+//                     ),
+//                     suffixIcon: _searchController.text.isNotEmpty
+//                         ? IconButton(
+//                       icon: Icon(
+//                         Icons.clear,
+//                         color: Color(0xFFAA8E83),
+//                         size: 18,
+//                       ),
+//                       onPressed: () {
+//                         _searchController.clear();
+//                         filterData('');
+//                       },
+//                     )
+//                         : null,
+//                     border: InputBorder.none,
+//                     contentPadding: EdgeInsets.symmetric(vertical: 9, horizontal: 18.0),
+//                   ),
+//                 ),
+//               ),
+//             ),
+//
+//             // Updated section for "No country found"
+//             Expanded(
+//               child: filtered.isEmpty
+//                   ? Center(
+//                 child: Text(
+//                   'No country found',
+//                   style: TextStyle(
+//                     fontSize: 16,
+//                     color: Colors.grey,
+//                     fontWeight: FontWeight.w500,
+//                   ),
+//                 ),
+//               )
+//                   : ListView.builder(
+//                 itemCount: filtered.length,
+//                 itemBuilder: (context, index) {
+//                   final country = filtered[index];
+//                   return ListTile(
+//                     leading: Text(
+//                       country['flag']!,
+//                       style: const TextStyle(fontSize: 24),
+//                     ),
+//                     title: Text(country['name']!),
+//                     onTap: () {
+//                       context.push('/country-profile-detail', extra: {
+//                         'countryName': country['name'] as String,
+//                         'flag': country['code'] as String,
+//                       });
+//                     },
+//                   );
+//                 },
+//               ),
+//             ),
+//           ],
+//         ),
+//       ),
+//     );
+//   }
+// }
+
+class ListCountriesRoute extends HookConsumerWidget {
+  const ListCountriesRoute({super.key});
 
   @override
-  ConsumerState<CountryProfilePage> createState() => _CountryProfilePageState();
-}
+  Widget build(BuildContext context, WidgetRef ref) {
+    final screenWidth = MediaQuery.of(context).size.width;
+    final _searchController = useTextEditingController();
+    final searchTerm = useState('');
 
-class _CountryProfilePageState extends ConsumerState<CountryProfilePage> {
-  final TextEditingController _searchController = TextEditingController();
+    final filteredCountries = ISOCountry.values.where((country) {
+      final query = searchTerm.value.trim().toLowerCase();
+      if (query.isEmpty) return true; // 🔥 show all if search is empty
+      return country.nameEN.toLowerCase().contains(query) ||
+          country.nameAR.toLowerCase().contains(query);
+    }).toList();
 
   final List<Map<String, String>> _allCountries = [
     {"name": "Afghanistan", "flag": "🇦🇫"},
@@ -140,44 +312,118 @@ class _CountryProfilePageState extends ConsumerState<CountryProfilePage> {
                   ),
                 ),
               ),
-            ),
-
-            // Updated section for "No country found"
-            Expanded(
-              child: filtered.isEmpty
-                  ? Center(
-                child: Text(
-                  'No country found',
-                  style: TextStyle(
-                    fontSize: 16,
-                    color: Colors.grey,
-                    fontWeight: FontWeight.w500,
+              child: SearchBar(
+                constraints: BoxConstraints(
+                  maxWidth: MediaQuery.of(context).size.width*0.9,
+                  maxHeight: 50,
+                ),
+                elevation: WidgetStatePropertyAll(0),
+                backgroundColor: WidgetStatePropertyAll(Colors.white),
+                controller: _searchController,
+                hintText: AppLocalizations.of(context)!.searchCountry,
+                hintStyle: WidgetStateProperty.all(
+                  TextStyle(
+                    color: Color(0xFFAA8E83),
+                    fontFamily: context.translate('Roboto', 'NotoKufi'),
+                    fontSize: 14,
+                    height: 1.8,
                   ),
                 ),
-              )
-                  : ListView.builder(
-                itemCount: filtered.length,
-                itemBuilder: (context, index) {
-                  final country = filtered[index];
-                  return ListTile(
-                    leading: Text(
-                      country['flag']!,
-                      style: const TextStyle(fontSize: 24),
-                    ),
-                    title: Text(country['name']!),
-                    onTap: () {
-                      context.push('/country-profile-detail', extra: {
-                        'countryName': country['name'] as String,
-                        'flag': country['flag'] as String,
-                      });
-                    },
-                  );
+                leading: Container(
+                  padding: EdgeInsets.only(right: 5, left: 5),
+                  alignment: Alignment.center,
+                  constraints: BoxConstraints(
+                    maxWidth: 42,
+                    maxHeight: 42,
+                  ),
+                  child: SvgPicture.asset(
+                    MiscIconAssetPath.Search,
+                    semanticsLabel: 'Search',
+                    colorFilter: ColorFilter.mode(Color(0xFFAA8E83), BlendMode.srcIn),
+                    height: 18,
+                    width: 18,
+                  ),
+                ),
+                onChanged: (value){
+                  searchTerm.value=value;
                 },
               ),
             ),
-          ],
+          ),
+          Expanded(
+            child: ValueListenableBuilder(
+              valueListenable: _searchController,
+              builder: (context, value, child){
+                if (filteredCountries.isEmpty) {
+                  return Center(
+                    child: Text(
+                      context.translate(
+                        'No countries match your search term.',
+                        'لا توجد بلدان تتطابق مع مصطلح البحث الخاص بك.',
+                      ),
+                    ),
+                  );
+                }
+                return ListView.builder(
+                  itemCount: filteredCountries.length,
+                  itemBuilder: (context, index)=> _CountryListTile(
+                    key: ValueKey(filteredCountries[index].alpha2),
+                    countryCode: filteredCountries[index].alpha2,), );
+              },),
+          )
+        ],
+      ), title: Text('Country Profile'),
+    );
+    return body;
+  }
+}
+
+class _CountryListTile extends ConsumerWidget {
+  const _CountryListTile({
+    required super.key,
+    required this.countryCode,
+  });
+
+  final String countryCode;
+
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    final country = ISOCountry.fromAlpha2(countryCode);
+    final flag = Image.asset(
+      country.flagImgPath,
+      fit: BoxFit.contain,
+      height: 18,
+      width: 18 * (3 / 2),
+      cacheHeight: 32,
+      cacheWidth: 48,
+    );
+    return ListTile(
+        leading: flag,
+        contentPadding: const EdgeInsets.symmetric(
+          horizontal: 24,
+          vertical: 0,
         ),
-      ),
+        dense: true,
+        minTileHeight: 40,
+        title: Text(
+          context.translate(
+            country.nameEN,
+            country.nameAR,
+          ),
+          style: TextStyle(
+            fontFamily: context.translate(
+              'Roboto',
+              'NotoKufi',
+            ),
+            fontSize: 14,
+            fontWeight: FontWeight.w400,
+          ),
+        ),
+        onTap: () => context.push('/country-profile-detail', extra: {
+          'countryName':    country.nameEN,
+          'flag': country.alpha2,
+        })
     );
   }
 }
+