proxybuy-flutter/lib/widgets/customBottomSheet.dart

import 'package:flutter/material.dart';
import 'package:lba/extension/screenSize.dart';
import 'package:lba/res/colors.dart';
import 'package:lba/widgets/button.dart';
import 'package:lba/widgets/optionSelector.dart';

class CustomBottomSheet extends StatefulWidget {
  final List<String> options;

  const CustomBottomSheet({
    super.key,
    required this.options,
  });

  static void show(BuildContext context, List<String> options) {
    showModalBottomSheet(
      context: context,
      isScrollControlled: true,
      useRootNavigator: true,
      backgroundColor: Colors.transparent,
      builder: (context) => CustomBottomSheet(options: options),
    );
  }

  @override
  State<CustomBottomSheet> createState() => _CustomBottomSheetState();
}

class _CustomBottomSheetState extends State<CustomBottomSheet> {
  List<String> selectedOptions = [];

  void _onOptionToggled(String option) {
    setState(() {
      if (selectedOptions.contains(option)) {
        selectedOptions.remove(option);
      } else {
        selectedOptions.add(option);
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return DraggableScrollableSheet(
      expand: false,
      initialChildSize: 0.6,
      minChildSize: 0.4,
      maxChildSize: 0.9,
      builder: (context, scrollController) {
        return Container(
          width: MediaQuery.of(context).size.width,
          decoration: const BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.vertical(top: Radius.circular(16)),
          ),
          child: Column(
            children: [
              Container(
                width: 50,
                height: 4,
                margin: const EdgeInsets.only(top: 8, bottom: 12),
                decoration: BoxDecoration(
                  color: Colors.grey[400],
                  borderRadius: BorderRadius.circular(2),
                ),
              ),
              Expanded(
                child: nearbySort(scrollController),
              ),
              Padding(
                padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 16),
                child: Column(
                  children: [
                    Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                      children: [
                        SizedBox(width: 30,),
                        InkWell(
                          child: Text("Clear all",style: TextStyle(fontWeight: FontWeight.bold),),
                          onTap: () {
                            setState(() {
                              selectedOptions.clear();
                            });
                          },
                        ),
                    
                        const SizedBox(width: 50),
                        Expanded(
                          child: Button(
                            text: "Apply",
                            onPressed: () {
                              Navigator.pop(context);
                            },
                            color: LightAppColors.confirmButton),
                        ),
                      ],
                    ),
                    SizedBox(height: 15,)
                  ],
                ),
              ),
            ],
          ),
        );
      },
    );
  }

  Widget nearbySort(ScrollController scrollController) {
    
    final width = context.screenWidth;
    final height = context.screenHeight;

    return SingleChildScrollView(
      controller: scrollController,
      child: Container(
        margin: EdgeInsets.only(left: width/50,right: width/10),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.start,
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            const SizedBox(height: 15),
            Text(
              "Categories",
              style: TextStyle(
                color: LightAppColors.hint,
                fontSize: 17,
                fontWeight: FontWeight.bold,
              ),
            ),
            const SizedBox(height: 12),
            OptionSelector(
              options: widget.options,
              selectedOptions: selectedOptions,
              onOptionToggled: _onOptionToggled,
            ),
            const SizedBox(height: 15),
            Padding(
              padding: const EdgeInsets.only(top: 16),
              child: Text(
                "OrderType",
                style: TextStyle(
                  color: LightAppColors.hint,
                  fontSize: 17,
                  fontWeight: FontWeight.bold,
                ),
              ),
            ),
            const SizedBox(height: 12),
            OptionSelector(
              options: ["Delivery", "Pickup"],
              selectedOptions: selectedOptions,
              onOptionToggled: _onOptionToggled,
            ),
          ],
        ),
      ),
    );
  }
}