feat: Baskets page's loading,loaded state done

assets/icons/ic_arrow_right.svg

@@ -0,0 +1,3 @@
+<svg width="9" height="15" viewBox="0 0 9 15" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0 0H2.97391L9 7.5L2.97391 15H0L6.02609 7.5L0 0Z" fill="black"/>
+</svg>

lib/core/constants/app_locale_keys.dart

@@ -9,4 +9,11 @@ abstract class AppLocaleKeys {
 
   static const String imageUrl =
       "https://xsznseejebbai1lj.public.blob.vercel-storage.com/homepage/hero/hero-1.webp";
+
+  static const String lorem = '''Lorem Ipsum is simply dummy text of the 
+      printing and typesetting industry. Lorem Ipsum 
+      has been the industry's standard dummy text ever
+      since the 1500s, when an unknown printer took a 
+      galley of type and scrambled it to make a type 
+      specimen book''';
 }

lib/core/theme/app_icons.dart

@@ -36,6 +36,7 @@ abstract class AppIcons {
   static const String icSearch = "$baseUrl/ic_search.svg";
   static const String icCheck= "$baseUrl/ic_check.svg";
   static const String icCheck1= "$baseUrl/ic_check1.svg";
+  static const String icArrowRight= "$baseUrl/ic_arrow_right.svg";
 
 
   ///.png icons

lib/feature/basket/basket.dart

@@ -3,3 +3,6 @@ export 'package:food_delivery_client/feature/basket/presentation/pages/basket_pa
 export 'package:food_delivery_client/feature/basket/presentation/pages/basket_page/widgets/w_basket_header.dart';
 export 'presentation/blocs/basket_bloc.dart';
 export 'package:food_delivery_client/feature/basket/presentation/pages/basket_page/widgets/w_basket_body.dart';
+export 'package:food_delivery_client/feature/basket/presentation/pages/basket_page/widgets/w_basket_carts.dart';
+export 'package:food_delivery_client/feature/basket/presentation/pages/basket_page/widgets/w_basket_loading.dart';
+export 'package:food_delivery_client/feature/basket/presentation/pages/basket_page/widgets/w_order_item.dart';

lib/feature/basket/presentation/blocs/basket_bloc.dart

@@ -15,6 +15,6 @@ class BasketBloc extends Bloc<BasketEvent, BasketState> {
   _onStarted(_Started event, Emitter<BasketState> emit) async {
     emit(state.copyWith(status: RequestStatus.loading));
     await Future.delayed(TimeDelayConst.duration3);
-    emit(state.copyWith(status: RequestStatus.loaded));
+    emit(state.copyWith(status: RequestStatus.loaded, orders: []));
   }
 }

lib/feature/basket/presentation/pages/basket_page/widgets/w_basket_body.dart

@@ -1,4 +1,4 @@
-import 'package:food_delivery_client/feature/basket/presentation/pages/basket_page/widgets/w_basket_loading.dart';
+
 
 import '../../../../../../food_delivery_client.dart';
 
@@ -9,14 +9,17 @@ class WBasketBody extends StatelessWidget {
   Widget build(BuildContext context) {
     return BlocBuilder<BasketBloc, BasketState>(
       builder: (context, state) {
+        log("qweqweqweqwe:${state.orders}");
+        log("qweqweqweqwe:${state.orders.isEmpty}");
+        log("qweqweqweqwe:${state.orders.isNotEmpty}");
+
+
         return Column(
           children: [
             WBasketHeader(),
-            OrderItem(),
+            if (state.status.isLoading()) WBasketLoading(),
-
-            if (state.status.isLoading()) Text("Loading"),
             if (state.status.isLoaded())
-              if (state.orders.isEmpty) WBasketEmpty(),
+              if (state.orders.isEmpty) WBasketEmpty() else WBasketCarts(),
           ],
         );
       },

lib/feature/basket/presentation/pages/basket_page/widgets/w_basket_carts.dart

@@ -0,0 +1,29 @@
+
+import '../../../../../../food_delivery_client.dart';
+
+class WBasketCarts extends StatelessWidget {
+  const WBasketCarts({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return BlocBuilder<BasketBloc, BasketState>(
+      builder: (context, state) {
+        return Expanded(
+          child: RefreshIndicator(
+            onRefresh: () async {
+              context.read<BasketBloc>().add(BasketEvent.started());
+              await Future.delayed(TimeDelayConst.duration3);
+            },
+            child: ListView.builder(
+              shrinkWrap: true,
+              itemCount: 10,
+              scrollDirection: Axis.vertical,
+              physics: const AlwaysScrollableScrollPhysics(),
+              itemBuilder: (context, index) => OrderItem(),
+            ),
+          ),
+        );
+      },
+    );
+  }
+}

lib/feature/basket/presentation/pages/basket_page/widgets/w_basket_loading.dart

@@ -1,3 +1,4 @@
+
 import '../../../../../../food_delivery_client.dart';
 
 class WBasketLoading extends StatelessWidget {
@@ -5,12 +6,21 @@ class WBasketLoading extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Column(children: []);
+    return Expanded(
+      child: ListView.builder(
+        shrinkWrap: true,
+        itemCount: 10,
+        scrollDirection: Axis.vertical,
+        physics: const NeverScrollableScrollPhysics(),
+        itemBuilder: (context, index) =>
+            Skeletonizer(enabled: true, child: OrderItemSkeletonizer()),
+      ),
+    );
   }
 }
 
-class OrderItem extends StatelessWidget {
+class OrderItemSkeletonizer extends StatelessWidget {
-  const OrderItem({super.key});
+  const OrderItemSkeletonizer({super.key});
 
   @override
   Widget build(BuildContext context) {
@@ -32,28 +42,34 @@ class OrderItem extends StatelessWidget {
                   ),
                 ),
                 16.horizontalSpace,
-                Column(
+                Expanded(
-                  crossAxisAlignment: CrossAxisAlignment.start,
+                  child: Column(
-                  children: [
+                    crossAxisAlignment: CrossAxisAlignment.start,
-                    Text("Begs & Megs", style: AppTextStyles.size16Medium),
+                    children: [
-                    Text(
+                      Text("Begs & Megs", style: AppTextStyles.size16Medium),
-                      "1 item",
+                      Text(
-                      style: AppTextStyles.size14Regular.copyWith(
+                        AppLocaleKeys.lorem,
-                        color: AppColors.c6B6B6B,
+                        maxLines: 1,
+                        overflow: TextOverflow.ellipsis,
+                        style: AppTextStyles.size14Regular.copyWith(
+                          color: AppColors.c6B6B6B,
+                        ),
                       ),
-                    ),
+                      Text(
-                    Text(
+                        "Deliver to San Franciscao Bay Area",
-                      "Deliver to San Franciscao Bay Area",
+                        style: AppTextStyles.size14Regular.copyWith(
-                      style: AppTextStyles.size14Regular.copyWith(
+                          color: AppColors.c6B6B6B,
-                        color: AppColors.c6B6B6B,
+                        ),
                       ),
-                    ),
+                    ],
-                  ],
+                  ),
+                ),
+                Icon(
+                  Icons.arrow_forward_ios_outlined,
+                  color: AppColors.cFFFFFF,
                 ),
-                const Spacer(),
-                Icon(Icons.arrow_forward_ios_outlined),
               ],
-            ).paddingSymmetric(vertical: 10, horizontal: 16),
+            ).paddingSymmetric(vertical: 10, horizontal: 18),
             10.verticalSpace,
             WDivider(indent: 120, endIndent: 20, height: 1),
           ],

lib/feature/basket/presentation/pages/basket_page/widgets/w_order_item.dart

@@ -0,0 +1,86 @@
+import '../../../../../../food_delivery_client.dart';
+
+class OrderItem extends StatelessWidget {
+  const OrderItem({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return InkWell(
+      onTap: () {},
+      child: Ink(
+        child: Column(
+          children: [
+            Row(
+              crossAxisAlignment: CrossAxisAlignment.center,
+              children: [
+                ClipRRect(
+                  borderRadius: AppUtils.kBorderRadius40,
+                  child: CachedNetworkImage(
+                    imageUrl: AppLocaleKeys.imageUrl,
+                    height: 70,
+                    width: 70,
+                    fit: BoxFit.cover,
+                  ),
+                ),
+                16.horizontalSpace,
+                Expanded(
+                  child: Column(
+                    crossAxisAlignment: CrossAxisAlignment.start,
+                    children: [
+                      Text(
+                        AppLocaleKeys.lorem,
+                        maxLines: 1,
+                        overflow: TextOverflow.ellipsis,
+                        style: AppTextStyles.size16Medium,
+                      ),
+                      Row(
+                        spacing: 5,
+                        mainAxisAlignment: MainAxisAlignment.start,
+                        mainAxisSize: MainAxisSize.min,
+                        children: [
+                          Expanded(
+                            child: Text(
+                              AppLocaleKeys.lorem,
+                              maxLines: 1,
+                              overflow: TextOverflow.ellipsis,
+                              style: AppTextStyles.size14Regular.copyWith(
+                                color: AppColors.c6B6B6B,
+                              ),
+                            ),
+                          ),
+                          Icon(Icons.circle, size: 5, color: AppColors.c6B6B6B),
+                          Expanded(
+                            child: Text(
+                              AppLocaleKeys.lorem,
+                              maxLines: 1,
+                              overflow: TextOverflow.ellipsis,
+                              style: AppTextStyles.size14Regular.copyWith(
+                                color: AppColors.c6B6B6B,
+                              ),
+                            ),
+                          ),
+                        ],
+                      ),
+                      Text(
+                        AppLocaleKeys.lorem,
+                        maxLines: 1,
+                        overflow: TextOverflow.ellipsis,
+                        style: AppTextStyles.size14Regular.copyWith(
+                          color: AppColors.c6B6B6B,
+                        ),
+                      ),
+                    ],
+                  ),
+                ),
+                10.horizontalSpace,
+                SvgPicture.asset(AppIcons.icArrowRight),
+              ],
+            ).paddingSymmetric(vertical: 10, horizontal: 18),
+            10.verticalSpace,
+            WDivider(indent: 120, endIndent: 20, height: 1),
+          ],
+        ),
+      ),
+    );
+  }
+}

lib/food_delivery_client.dart

@@ -21,3 +21,4 @@ export 'package:cached_network_image/cached_network_image.dart';
 export 'package:carousel_slider/carousel_slider.dart';
 export 'package:flutter_bounceable/flutter_bounceable.dart';
 export 'package:food_delivery_client/feature/on_boarding/presentation/pages/splash_page/splash_page.dart';
+export 'package:skeletonizer/skeletonizer.dart';

pubspec.lock

@@ -725,6 +725,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "3.0.0"
+  skeletonizer:
+    dependency: "direct main"
+    description:
+      name: skeletonizer
+      sha256: eebc03dc86b298e2d7f61e0ebce5713e9dbbc3e786f825909b4591756f196eb6
+      url: "https://pub.dev"
+    source: hosted
+    version: "2.1.0+1"
   sky_engine:
     dependency: transitive
     description: flutter

pubspec.yaml

@@ -42,6 +42,8 @@ dependencies:
   freezed: ^3.2.3
   freezed_annotation: ^3.1.0
 
+  #loading:
+  skeletonizer: ^2.1.0+1
 
 dev_dependencies:
   flutter_test: