import 'package:flutter/material.dart';
import 'package:shimmer/shimmer.dart';
import 'package:sizer/sizer.dart';

class OnlineStoreOrderShimmer extends StatelessWidget {
  const OnlineStoreOrderShimmer({super.key});

  @override
  Widget build(BuildContext context) {
    return Shimmer.fromColors(
      baseColor: Colors.grey[300]!,
      highlightColor: Colors.grey[100]!,
      child: ListView.builder(
        shrinkWrap: true,
        physics: const NeverScrollableScrollPhysics(),
        padding: EdgeInsets.symmetric(horizontal: 5.w, vertical: 2.h),
        itemCount: 5,
        itemBuilder: (context, index) {
          return Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              if (index == 0) ...[
                Container(
                  width: 30.w,
                  height: 2.h,
                  margin: EdgeInsets.only(bottom: 2.h, left: 2.w),
                  decoration: BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.circular(1.w),
                  ),
                ),
              ],
              
              Padding(
                padding: EdgeInsets.symmetric(vertical: 1.5.h, horizontal: 2.w),
                child: Row(
                  children: [
                    Container(
                      width: 15.w,
                      height: 15.w,
                      decoration: BoxDecoration(
                        color: Colors.white,
                        borderRadius: BorderRadius.circular(2.5.w),
                      ),
                    ),
                    SizedBox(width: 4.w),
                    Expanded(
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Container(
                            width: 25.w,
                            height: 1.8.h,
                            color: Colors.white,
                          ),
                          SizedBox(height: 1.h),
                          Container(
                            width: 40.w,
                            height: 1.5.h,
                            color: Colors.white,
                          ),
                        ],
                      ),
                    ),
                    // Ikon Panah Navigasi
                    Icon(Icons.chevron_right, color: Colors.white, size: 5.w),
                  ],
                ),
              ),
            
              Divider(height: 1, color: Colors.grey[200]),
            ],
          );
        },
      ),
    );
  }
}