import 'package:english_learning/core/utils/styles/theme.dart';
import 'package:english_learning/core/widgets/custom_snackbar.dart';
import 'package:english_learning/core/widgets/global_button.dart';
import 'package:english_learning/features/auth/provider/user_provider.dart';
import 'package:english_learning/features/settings/modules/report_issue/widgets/report_issue_dialog.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

class ReportIssueScreen extends StatefulWidget {
  const ReportIssueScreen({super.key});

  @override
  State<ReportIssueScreen> createState() => _ReportIssueScreenState();
}

class _ReportIssueScreenState extends State<ReportIssueScreen> {
  final FocusNode _focusNode = FocusNode();
  final TextEditingController _controller = TextEditingController();
  bool _isLoading = false;

  @override
  void initState() {
    super.initState();
    _focusNode.addListener(() {
      setState(() {});
    });
  }

  @override
  void dispose() {
    _focusNode.dispose();
    _controller.dispose();
    super.dispose();
  }

  void _unfocusTextField() {
    _focusNode.unfocus();
  }

  Future<void> _submitReport() async {
    setState(() {
      _isLoading = true;
    });

    final userProvider = Provider.of<UserProvider>(context, listen: false);
    final success = await userProvider.reportIssue(_controller.text);

    setState(() {
      _isLoading = false;
    });

    if (success) {
      showDialog(
        context: context,
        builder: (BuildContext context) {
          return ReportIssueDialog(
            onSubmit: () {
              Navigator.of(context).pop(); // Close the dialog
              Navigator.of(context).pop(); // Go back to previous screen
            },
          );
        },
      );
    } else {
      CustomSnackBar.show(context,
          message: 'Failed to submit report. Please try again.', isError: true);
    }
  }

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: _unfocusTextField,
      child: Scaffold(
        appBar: AppBar(
          elevation: 0,
          iconTheme: const IconThemeData(color: AppColors.whiteColor),
          centerTitle: true,
          title: Text(
            'Report an Issue',
            style: AppTextStyles.whiteTextStyle.copyWith(
              fontSize: 16,
              fontWeight: FontWeight.w900,
            ),
          ),
          flexibleSpace: Container(
            decoration: BoxDecoration(
              gradient: AppColors.gradientTheme,
            ),
          ),
        ),
        body: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 16.0),
          child: Column(
            children: [
              const SizedBox(height: 24),
              Text(
                'In order to improve our service, kindly share your experience.',
                style: AppTextStyles.blackTextStyle.copyWith(
                  fontSize: 14,
                ),
              ),
              const SizedBox(height: 8),
              AnimatedContainer(
                duration: const Duration(milliseconds: 200),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(12),
                  boxShadow: [
                    BoxShadow(
                      color: _focusNode.hasFocus
                          ? AppColors.blueColor.withOpacity(0.3)
                          : Colors.transparent,
                      blurRadius: 8,
                      offset: const Offset(0, 4),
                    ),
                  ],
                ),
                child: TextField(
                  controller: _controller,
                  focusNode: _focusNode,
                  maxLines: 8,
                  style: AppTextStyles.blackTextStyle.copyWith(
                    fontSize: 14,
                  ),
                  cursorColor: AppColors.blackColor,
                  decoration: InputDecoration(
                    hintText: 'Type your message here',
                    hintStyle:
                        AppTextStyles.greyTextStyle.copyWith(fontSize: 14),
                    filled: true,
                    fillColor: _focusNode.hasFocus
                        ? AppColors.whiteColor
                        : AppColors.whiteColor,
                    contentPadding: const EdgeInsets.all(16),
                    border: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(12),
                      borderSide: BorderSide.none,
                    ),
                    focusedBorder: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(12),
                      borderSide: const BorderSide(
                        color: AppColors.blueColor,
                        width: 2,
                      ),
                    ),
                    enabledBorder: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(12),
                      borderSide: BorderSide(
                          color: AppColors.disableColor.withOpacity(0.5)),
                    ),
                  ),
                ),
              ),
              const SizedBox(height: 18),
              GlobalButton(
                text: 'Send',
                onPressed: _isLoading ? null : _submitReport,
              )
            ],
          ),
        ),
      ),
    );
  }
}
