Completed the Enhancement CR

lib/views/dashboard/fragments/home_fragment.dart

@@ -8,12 +8,14 @@ import 'package:mc_common_app/models/appointments_models/appointment_list_model.
 import 'package:mc_common_app/utils/enums.dart';
 import 'package:mc_common_app/utils/navigator.dart';
 import 'package:mc_common_app/view_models/ad_view_model.dart';
+import 'package:mc_common_app/view_models/appointments_view_model.dart';
 import 'package:mc_common_app/view_models/dashboard_view_model_provider.dart';
 import 'package:mc_common_app/views/advertisement/components/ads_list_widget.dart';
 import 'package:mc_common_app/views/appointments/widgets/common_appointment_slider_widget.dart';
 import 'package:mc_common_app/widgets/common_widgets/app_bar.dart';
 import 'package:mc_common_app/widgets/common_widgets/view_all_widget.dart';
 import 'package:mc_common_app/widgets/extensions/extensions_widget.dart';
+import 'package:mc_common_app/widgets/shimmer/home_shimmer_widgets.dart';
 import 'package:provider/provider.dart';
 
 class HomeFragment extends StatelessWidget {
@@ -59,15 +61,25 @@ class HomeFragment extends StatelessWidget {
                       context.read<DashboardVMProvider>().onNavbarTapped(1);
                     },
                   ).horPaddingMain(),
-                  CommonAppointmentSliderWidget(
+                  Consumer<AppointmentsVM>(
-                          onAppointmentClick: (AppointmentListModel value) => navigateWithName(
+                    builder: (BuildContext context, AppointmentsVM appointmentVM, Widget? child) {
-                                context,
+                      // Show shimmer when loading
-                                AppRoutes.appointmentDetailList,
+                      if (appointmentVM.state == ViewState.busy) {
-                                arguments: value,
+                        return const AppointmentSliderShimmer();
-                              )).toWhiteContainer(width: double.infinity, backgroundColor: Colors.transparent).margin(
+                      }
+                      // Show actual data when idle
+                      return CommonAppointmentSliderWidget(
+                        onAppointmentClick: (AppointmentListModel value) => navigateWithName(
+                          context,
+                          AppRoutes.appointmentDetailList,
+                          arguments: value,
+                        ),
+                      ).toWhiteContainer(width: double.infinity, backgroundColor: Colors.transparent).margin(
                         left: 21,
                         right: 21,
-                      ),
+                      );
+                    },
+                  ),
                   24.height,
                   ViewAllWidget(
                     title: LocaleKeys.myBranches.tr(),
@@ -83,65 +95,76 @@ class HomeFragment extends StatelessWidget {
               ),
               Consumer(
                 builder: (BuildContext context, AdVM adVM, Widget? child) {
+                  // Show shimmer when loading
                   if (adVM.state == ViewState.busy) {
-                    return const Padding(
+                    return Padding(
-                      padding: EdgeInsets.all(30),
+                      padding: const EdgeInsets.only(top: 15),
-                      child: Center(child: CircularProgressIndicator()),
+                      child: Column(
-                    );
+                        children: [
-                  } else {
+                          ViewAllWidget(
-                    return Column(
+                            title: LocaleKeys.my_active_Ads.tr().toUpperCase(),
-                      children: [
+                            subTitle: LocaleKeys.view_all.tr(),
-                        if (adVM.myActiveAdsForHome.isNotEmpty) ...[
+                            onSubtitleTapped: () {},
-                          Column(
+                          ).horPaddingMain(),
-                            children: [
+                          14.height,
-                              15.height,
+                          const AdsListShimmer(itemCount: 2),
-                              ViewAllWidget(
-                                title: LocaleKeys.my_active_Ads.tr().toUpperCase(),
-                                subTitle: LocaleKeys.view_all.tr(),
-                                onSubtitleTapped: () {
-                                  context.read<DashboardVMProvider>().onNavbarTapped(3);
-                                  context.read<AdVM>().updateIsExploreAds(true);
-                                  context.read<AdVM>().applyFilterOnExploreAds(vehicleBrandId: 0); // allAds
-                                },
-                              ).horPaddingMain(),
-                              AdsListWidget(
-                                isDraftAds: false,
-                                shouldShowAdStatus: true,
-                                isAdsFragment: false,
-                                adsList: adVM.myActiveAdsForHome,
-                                scrollPhysics: const NeverScrollableScrollPhysics(),
-                                hasMoreData: adVM.isExploreAdsTapped ? adVM.hasMoreDataForExploreAds : adVM.hasMoreDataForMyAds,
-                              ),
-                            ],
-                          )
                         ],
-                        if (adVM.exploreAds.isNotEmpty) ...[
+                      ),
-                          Column(
-                            children: [
-                              15.height,
-                              ViewAllWidget(
-                                title: LocaleKeys.myRecommendedAds.tr().toUpperCase(),
-                                subTitle: LocaleKeys.view_all.tr(),
-                                onSubtitleTapped: () {
-                                  context.read<DashboardVMProvider>().onNavbarTapped(3);
-                                  context.read<AdVM>().updateIsExploreAds(true);
-                                  context.read<AdVM>().applyFilterOnExploreAds(vehicleBrandId: 0); // allAds
-                                },
-                              ).horPaddingMain(),
-                              AdsListWidget(
-                                isDraftAds: false,
-                                shouldShowAdStatus: false,
-                                adsList: adVM.exploreAds.length >= 3 ? adVM.exploreAds.take(3).toList() : adVM.exploreAds,
-                                isAdsFragment: false,
-                                scrollPhysics: const NeverScrollableScrollPhysics(),
-                                hasMoreData: adVM.isExploreAdsTapped ? adVM.hasMoreDataForExploreAds : adVM.hasMoreDataForMyAds,
-                              ),
-                            ],
-                          )
-                        ]
-                      ],
                     );
                   }
+                  // Show actual data when idle
+                  return Column(
+                    children: [
+                      if (adVM.myActiveAdsForHome.isNotEmpty) ...[
+                        Column(
+                          children: [
+                            15.height,
+                            ViewAllWidget(
+                              title: LocaleKeys.my_active_Ads.tr().toUpperCase(),
+                              subTitle: LocaleKeys.view_all.tr(),
+                              onSubtitleTapped: () {
+                                context.read<DashboardVMProvider>().onNavbarTapped(3);
+                                context.read<AdVM>().updateIsExploreAds(true);
+                                context.read<AdVM>().applyFilterOnExploreAds(vehicleBrandId: 0); // allAds
+                              },
+                            ).horPaddingMain(),
+                            AdsListWidget(
+                              isDraftAds: false,
+                              shouldShowAdStatus: true,
+                              isAdsFragment: false,
+                              adsList: adVM.myActiveAdsForHome,
+                              scrollPhysics: const NeverScrollableScrollPhysics(),
+                              hasMoreData: adVM.isExploreAdsTapped ? adVM.hasMoreDataForExploreAds : adVM.hasMoreDataForMyAds,
+                            ),
+                          ],
+                        )
+                      ],
+                      if (adVM.exploreAds.isNotEmpty) ...[
+                        Column(
+                          children: [
+                            15.height,
+                            ViewAllWidget(
+                              title: LocaleKeys.myRecommendedAds.tr().toUpperCase(),
+                              subTitle: LocaleKeys.view_all.tr(),
+                              onSubtitleTapped: () {
+                                context.read<DashboardVMProvider>().onNavbarTapped(3);
+                                context.read<AdVM>().updateIsExploreAds(true);
+                                context.read<AdVM>().applyFilterOnExploreAds(vehicleBrandId: 0); // allAds
+                              },
+                            ).horPaddingMain(),
+                            AdsListWidget(
+                              isDraftAds: false,
+                              shouldShowAdStatus: false,
+                              adsList: adVM.exploreAds.length >= 3 ? adVM.exploreAds.take(3).toList() : adVM.exploreAds,
+                              isAdsFragment: false,
+                              scrollPhysics: const NeverScrollableScrollPhysics(),
+                              hasMoreData: adVM.isExploreAdsTapped ? adVM.hasMoreDataForExploreAds : adVM.hasMoreDataForMyAds,
+                            ),
+                          ],
+                        )
+                      ]
+                    ],
+                  );
                 },
               ).toContainer(backgroundColor: const Color(0xFFF8F8F8), padding: EdgeInsets.zero, margin: EdgeInsets.zero),
               21.height,