import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:ride/constant/colors.dart';
import 'package:ride/constant/style.dart';
import 'package:ride/controller/home/map_page_controller.dart';

import '../../widgets/elevated_btn.dart';

GetBuilder<MapController> cancelRidePage() {
  Get.put(MapController());
  final List<String> reasons = [
    "I don't need a ride anymore".tr,
    "I was just trying the application".tr,
    "No driver accepted my request".tr,
    "I added the wrong pick-up/drop-off location".tr,
    "I don't have a reason".tr,
    "Other".tr,
  ];
  return GetBuilder<MapController>(
    builder: (controller) => controller.isCancelRidePageShown
        ? Positioned(
            left: 60,
            top: 40,
            right: 60,
            // bottom: 100,
            child: Container(
              decoration: BoxDecoration(
                color: AppColor.secondaryColor,
                boxShadow: [
                  const BoxShadow(
                      color: AppColor.accentColor,
                      offset: Offset(2, 2),
                      blurRadius: 5),
                  BoxShadow(
                      color: AppColor.accentColor.withOpacity(.4),
                      offset: const Offset(-2, -2),
                      blurRadius: 5)
                ],
                borderRadius: const BorderRadius.all(Radius.circular(15)),
              ),
              height: Get.height * .7,
              width: Get.width * .7,
              child: Column(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Padding(
                    padding: const EdgeInsets.symmetric(horizontal: 10),
                    child: Text(
                      'Can we know why you want to cancel Ride ?'.tr,
                      style: AppStyle.title,
                      textAlign: TextAlign.center,
                    ),
                  ),
                  SizedBox(
                    height: 380,
                    width: 300,
                    child: ListView.builder(
                      itemCount: reasons.length,
                      itemBuilder: (context, index) {
                        return ListTile(
                          title: InkWell(
                              onTap: () {
                                controller.selectReason(
                                  index,
                                  reasons[index].toString(),
                                );
                              },
                              child: Text(reasons[index])),
                          leading: Radio(
                            value: index,
                            groupValue: controller.selectedReason,
                            onChanged: (int? value) {
                              // print(value);
                              // print(reasons[index]);
                              controller.selectReason(
                                value!,
                                reasons[index].toString(),
                              );
                            },
                          ),
                        );
                      },
                    ),
                  ),
                  MyElevatedButton(
                    title: 'Cancel Ride'.tr,
                    onPressed: () {
                      controller.cancelRide();
                    },
                  ),
                ],
              ),
            ),
          )
        : const SizedBox(),
  );
}