import 'package:absensi_sas/app/constant.dart';

import 'package:absensi_sas/screen/approval/widget/filter_bottom_sheet.dart';
import 'package:fluentui_system_icons/fluentui_system_icons.dart';
import 'package:flutter/material.dart';

import 'package:hooks_riverpod/hooks_riverpod.dart';

class ApprovalFilterWidget extends HookConsumerWidget {
  const ApprovalFilterWidget({super.key});
  @override
  Widget build(BuildContext context, WidgetRef ref) {
    return Container(
      margin: EdgeInsets.only(
          right: Constant.getActualXPhone(context: context, x: 16)),
      child: ElevatedButton(
        onPressed: () {
          showModalBottomSheet(
            backgroundColor: Colors.white,
            shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.only(
                    topLeft: Radius.circular(32),
                    topRight: Radius.circular(32))),
            context: context,
            isScrollControlled: true,
            enableDrag: true,
            useSafeArea: true,
            // useRootNavigator: true,
            builder: (context) {
              return FilterBottomSheet();
            },
          );
        },
        style: ButtonStyle(
            elevation: MaterialStatePropertyAll(0),
            shape: MaterialStatePropertyAll(RoundedRectangleBorder(
                side: BorderSide(
                  color: Colors.grey.shade300,
                ),
                borderRadius: BorderRadius.circular(16))),
            backgroundColor: MaterialStateProperty.resolveWith((states) {
              return Colors.white;
            }),
            overlayColor:
                MaterialStatePropertyAll(Constant.textOrange.withOpacity(0.48)),
            foregroundColor: MaterialStatePropertyAll(Colors.white),
            shadowColor: MaterialStatePropertyAll(Colors.white),
            surfaceTintColor: MaterialStatePropertyAll(Colors.white)),
        child: Row(
          children: [
            Icon(
              FluentIcons.options_24_filled,
              size: 20,
              color: Colors.black,
            ),
            SizedBox(
              width: 8,
            ),
            Text(
              "Filter",
              style: Constant.subtitle_600_14(context: context)
                  .copyWith(color: Colors.black),
            ),
          ],
        ),
      ),
    );
  }
}
