import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:Intaleq/constant/table_names.dart';

import '../../../constant/colors.dart';
import '../../../constant/style.dart';
import '../../../controller/functions/toast.dart';
import '../../../controller/home/map_passenger_controller.dart';
import '../../../main.dart';

GetBuilder<MapPassengerController> formSearchPlacesStart() {
  return GetBuilder<MapPassengerController>(
    builder: (controller) => Column(
      children: [
        Padding(
          padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
          child: Row(
            children: [
              Expanded(
                child: TextFormField(
                  controller: controller.placeStartController,
                  onChanged: (value) {
                    if (controller.placeStartController.text.length > 5) {
                      // Reduced character limit
                      controller.getPlacesStart();
                      controller.changeHeightStartPlaces();
                    } else if (controller.placeStartController.text.isEmpty) {
                      controller.clearPlacesStart();
                      controller.changeHeightPlaces(); // Collapse if empty
                    }
                  },
                  decoration: InputDecoration(
                    hintText: controller.hintTextStartPoint,
                    hintStyle:
                        AppStyle.subtitle.copyWith(color: Colors.grey[600]),
                    prefixIcon:
                        const Icon(Icons.search, color: AppColor.primaryColor),
                    suffixIcon: controller.placeStartController.text.isNotEmpty
                        ? IconButton(
                            icon: Icon(Icons.clear, color: Colors.grey[400]),
                            onPressed: () {
                              controller.placeStartController.clear();
                              controller.clearPlacesStart();
                              controller
                                  .changeHeightPlaces(); // Collapse on clear
                            },
                          )
                        : null,
                    contentPadding: const EdgeInsets.symmetric(
                        horizontal: 16.0, vertical: 10.0),
                    border: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(8.0),
                      borderSide: BorderSide.none,
                    ),
                    focusedBorder: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(8.0),
                      borderSide: BorderSide(color: AppColor.primaryColor),
                    ),
                    filled: true,
                    fillColor: Colors.grey[50],
                  ),
                ),
              ),
              const SizedBox(width: 8.0),
              IconButton(
                onPressed: () {
                  controller.startLocationFromMap = true;
                  controller.changeMainBottomMenuMap();
                  controller.changePickerShown();
                },
                icon: Icon(Icons.location_on_outlined,
                    color: AppColor.accentColor, size: 30),
                tooltip: 'Choose on Map',
              ),
            ],
          ),
        ),
        AnimatedContainer(
          duration: const Duration(milliseconds: 200),
          height: controller.placesStart.isNotEmpty ? controller.height : 0,
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(8.0),
          ),
          margin: const EdgeInsets.symmetric(horizontal: 16.0),
          child: ListView.separated(
            shrinkWrap: true,
            physics: const NeverScrollableScrollPhysics(),
            itemCount: controller.placesStart.length,
            separatorBuilder: (context, index) =>
                const Divider(height: 1, color: Colors.grey),
            itemBuilder: (BuildContext context, int index) {
              var res = controller.placesStart[index];
              return ListTile(
                leading: Image.network(res['icon'], width: 30, height: 30),
                title: Text(res['name'].toString(),
                    style: AppStyle.subtitle
                        .copyWith(fontWeight: FontWeight.w500)),
                subtitle: Text(res['vicinity'].toString(),
                    style: TextStyle(color: Colors.grey[600], fontSize: 12)),
                trailing: IconButton(
                  icon: const Icon(Icons.favorite_border, color: Colors.grey),
                  onPressed: () async {
                    await sql.insertMapLocation({
                      'latitude': res['geometry']['location']['lat'],
                      'longitude': res['geometry']['location']['lng'],
                      'name': res['name'].toString(),
                      'rate': res['rating'].toString(),
                    }, TableName.placesFavorite);
                    Toast.show(
                        context,
                        '${res['name']} ${'Saved Successfully'.tr}',
                        AppColor.primaryColor);
                  },
                ),
                onTap: () async {
                  controller.changeHeightPlaces();
                  await sql.insertMapLocation({
                    'latitude': res['geometry']['location']['lat'],
                    'longitude': res['geometry']['location']['lng'],
                    'name': res['name'].toString(),
                    'rate': res['rating'].toString(),
                    'createdAt': DateTime.now().toIso8601String(),
                  }, TableName.recentLocations);

                  controller.convertHintTextStartNewPlaces(index);
                  controller.currentLocationString = res['name'];
                  controller.placesStart = [];
                  controller.placeStartController.clear();
                },
              );
            },
          ),
        ),
      ],
    ),
  );
}