feat: date range picker

lib/presentation/sales/pages/sales_page.dart

@@ -98,8 +98,8 @@ class _SalesPageState extends State<SalesPage> {
                         },
                         onDateRangeChanged: (start, end) {
                           setState(() {
-                            startDate = start;
-                            endDate = end;
+                            startDate = start ?? startDate;
+                            endDate = end ?? endDate;
                           });
 
                           context.read<OrderLoaderBloc>().add(

lib/presentation/sales/widgets/sales_title.dart

@@ -1,9 +1,9 @@
 import 'package:enaklo_pos/core/components/components.dart';
+import 'package:enaklo_pos/core/components/date_range_picker.dart';
 import 'package:enaklo_pos/core/constants/colors.dart';
 import 'package:enaklo_pos/core/extensions/build_context_ext.dart';
 import 'package:enaklo_pos/core/extensions/date_time_ext.dart';
 import 'package:enaklo_pos/presentation/sales/blocs/order_loader/order_loader_bloc.dart';
-import 'package:enaklo_pos/presentation/sales/dialog/filter_dialog.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 
@@ -12,7 +12,7 @@ class SalesTitle extends StatelessWidget {
   final DateTime startDate;
   final DateTime endDate;
   final Function(String) onChanged;
-  final void Function(DateTime start, DateTime end) onDateRangeChanged;
+  final void Function(DateTime? start, DateTime? end) onDateRangeChanged;
 
   const SalesTitle(
       {super.key,
@@ -119,13 +119,12 @@ class SalesTitle extends StatelessWidget {
                   ),
                   SpaceWidth(12),
                   GestureDetector(
-                    onTap: () => showDialog(
+                    onTap: () => DateRangePickerModal.show(
                       context: context,
-                      builder: (context) => SalesFilterDialog(
-                        startDate: startDate,
-                        endDate: endDate,
-                        onDateRangeChanged: onDateRangeChanged,
-                      ),
+                      initialStartDate: startDate,
+                      initialEndDate: endDate,
+                      primaryColor: AppColors.primary,
+                      onChanged: onDateRangeChanged,
                     ),
                     child: Container(
                       padding: const EdgeInsets.all(12),