import 'package:SEFER/views/widgets/elevated_btn.dart';
import 'package:SEFER/views/widgets/my_textField.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import '../../controller/rate/rate_app_controller.dart';

class RatingScreen extends StatelessWidget {
  // Initialize the RatingController using GetX for state management
  final RatingController ratingController = Get.put(RatingController());

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        // Display title "Rate Our App", with .tr for localization support
        title: Text("Rate Our App".tr),
      ),
      body: Center(
        child: Obx(() {
          // Observe changes in userRating; when updated, rebuild the UI accordingly
          return Padding(
            padding: const EdgeInsets.all(8.0),
            child: ListView(
              // mainAxisAlignment:
              //     MainAxisAlignment.center, // Center content vertically
              children: [
                ClipRRect(
                    borderRadius: BorderRadius.circular(15),
                    child: Image.asset('assets/images/logo.gif')),
                const SizedBox(height: 10),
                // Text prompt asking the user to rate the app, with localization support
                Text("How would you rate our app?".tr),
                const SizedBox(height: 10), // Vertical spacing between elements
                MyTextForm(
                  controller: ratingController.comment,
                  label: 'write comment here'.tr,
                  hint: 'write comment here'.tr,
                  type: TextInputType.name,
                ),
                // Build and display the row of rating stars
                _buildRatingStars(),

                const SizedBox(
                    height: 20), // Additional spacing before the button

                // Button to submit the selected rating
                MyElevatedButton(
                  onPressed: () {
                    // Calls submitRating() method in the controller with the current rating value
                    ratingController
                        .submitRating(ratingController.userRating.value);
                  },
                  // Button text "Submit Rating" with localization support
                  title: "Submit Rating".tr,
                ),
              ],
            ),
          );
        }),
      ),
    );
  }

  // Widget function to display a row of clickable star icons for rating
  Widget _buildRatingStars() {
    return Row(
      mainAxisAlignment:
          MainAxisAlignment.center, // Center-aligns stars horizontally
      children: List.generate(5, (index) {
        return IconButton(
          // Display a star icon, filled if selected, otherwise grey
          icon: Icon(
            Icons.star,
            color: index < ratingController.userRating.value
                ? Colors.orange // Orange for selected stars
                : Colors.grey, // Grey for unselected stars
          ),
          onPressed: () {
            // Update user rating in the controller when a star is clicked
            ratingController.userRating.value = index + 1;
          },
        );
      }),
    );
  }
}