import 'package:firebase_auth/firebase_auth.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_rating_bar/flutter_rating_bar.dart';
import 'package:prosappco/src/authentication/authentication_repository.dart';
import 'package:prosappco/src/components/photo_view.dart';
import 'package:prosappco/src/models/scores_model.dart';
import 'package:prosappco/src/models/user_model.dart';
import 'package:prosappco/src/screens/profile.dart';
import 'package:prosappco/src/screens/prueba.dart';

class DrawerMenu extends StatefulWidget {
  @override
  State<DrawerMenu> createState() => _DrawerMenuState();
}

class _DrawerMenuState extends State<DrawerMenu> {
  final uid = AuthenticationRepository.instance.getCurrentUserUid();
  UserModel? user;
  ScoresModel? scoresModel;

  @override
  void initState() {
    super.initState();

    if (user == null) {
      UserModel.getUser(uid.toString()).then(
        (UserModel s) => setState(() => user = s),
      );
    }

    if (scoresModel == null) {
      ScoresModel.scoreTo(uid.toString(), false, false).then(
        (ScoresModel s) => setState(() => scoresModel = s),
      );
    }
  }

  @override
  Widget build(BuildContext context) {
    final User? currentUser = FirebaseAuth.instance.currentUser;

    return Drawer(
      child: Column(
        children: [
          Container(
            color: Colors.white,
            child: Column(
              children: [
                ListTile(
                  onTap: () {
                    Navigator.push(
                      context,
                      CupertinoPageRoute(
                        builder: (BuildContext context) {
                          return const ProfileScreen();
                        },
                      ),
                    );
                  },
                  title: Text(user?.name ?? '',
                      style: const TextStyle(fontWeight: FontWeight.bold)),
                  subtitle: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(
                        currentUser?.phoneNumber ?? '',
                        style: const TextStyle(fontSize: 12),
                      ),
                      Text(
                        user?.city ?? '',
                        style: const TextStyle(fontSize: 12),
                      ),
                    ],
                  ),
                  leading: ReferencePhoto(
                    ref: user?.photo,
                    size: 55,
                    sizeCircle: 60,
                  ),
                  trailing: const Icon(Icons.keyboard_arrow_right,
                      color: Colors.black),
                  contentPadding:
                      const EdgeInsets.symmetric(vertical: 20, horizontal: 16),
                ),
              ], //
            ),
          ),
          Container(
            decoration: BoxDecoration(
              boxShadow: [
                BoxShadow(
                  color: Colors.grey.withOpacity(0.3),
                  spreadRadius: 1,
                  blurRadius: 3,
                  offset: const Offset(0, 0), // changes position of shadow
                ),
              ],
            ),
            child: Divider(
              height: 0,
              color: Colors.grey[300],
            ),
          ),
          Expanded(
            child: Column(
              children: [
                ListTile(
                  onTap: () {},
                  leading: const Icon(
                    Icons.history,
                    color: Colors.black,
                  ),
                  title: const Text(
                    'Mis servicios',
                    style: TextStyle(fontSize: 15),
                  ),
                ),
                ListTile(
                  onTap: () {
                    Navigator.push(
                      context,
                      CupertinoPageRoute(
                        builder: (BuildContext context) {
                          return const ProfileScreen();
                        },
                      ),
                    );
                  },
                  leading: const Icon(
                    Icons.person_outline,
                    color: Colors.black,
                  ),
                  title: const Text(
                    'Mi perfil',
                    style: TextStyle(fontSize: 15),
                  ),
                ),
                ListTile(
                  onTap: () {},
                  leading: const Icon(
                    Icons.construction_outlined,
                    color: Colors.black,
                  ),
                  title: const Text(
                    'Configuración',
                    style: TextStyle(fontSize: 15),
                  ),
                ),
                ListTile(
                  onTap: () {},
                  leading: const Icon(
                    Icons.question_mark_rounded,
                    color: Colors.black,
                  ),
                  title: const Text(
                    'Soporte',
                    style: TextStyle(fontSize: 15),
                  ),
                ),
                ListTile(
                  onTap: () {},
                  leading: const Icon(
                    Icons.messenger_outline,
                    color: Colors.black,
                  ),
                  title: const Text(
                    'Mensajes',
                    style: TextStyle(fontSize: 15),
                  ),
                ),
                Builder(builder: (BuildContext context) {
                  return ListTile(
                    onTap: () {
                      if (ModalRoute.of(context)?.settings.name !=
                          '/servicio') {
                        Navigator.pushNamed(context, '/servicio');
                      } else {
                        Scaffold.of(context).openEndDrawer();
                      }
                    },
                    trailing: const Icon(
                      Icons.keyboard_arrow_right,
                      color: Colors.white,
                    ),
                    title: const Text(
                      'Solicitar servicio',
                      style: TextStyle(
                          color: Colors.white,
                          fontSize: 17,
                          fontWeight: FontWeight.bold),
                    ),
                    tileColor: const Color(0xFF2BA4EC),
                    contentPadding:
                        const EdgeInsets.symmetric(vertical: 5, horizontal: 16),
                  );
                }),
                Container(
                  decoration: BoxDecoration(
                    boxShadow: [
                      BoxShadow(
                        color: Colors.grey.withOpacity(0.5),
                        spreadRadius: 2,
                        blurRadius: 3,
                        offset:
                            const Offset(0, 2), // changes position of shadow
                      ),
                    ],
                  ),
                  child: Container(
                    color: const Color(0xFFD6F4FF),
                    child: ListTile(
                      tileColor: const Color(0xFFD6F4FF),
                      onTap: () {},
                      trailing: const Icon(Icons.keyboard_arrow_right,
                          color: Colors.black),
                      title: const Text(
                        'Reputación',
                        style: TextStyle(color: Colors.black),
                      ),
                      subtitle: Row(
                        children: [
                          RatingBar.builder(
                            initialRating: scoresModel?.average ?? 0,
                            minRating: 1,
                            direction: Axis.horizontal,
                            allowHalfRating: true,
                            itemCount: 5,
                            itemSize: 25,
                            maxRating: 5,
                            itemPadding:
                                const EdgeInsets.symmetric(horizontal: 0),
                            itemBuilder: (context, _) => const Icon(
                              Icons.star,
                              color: Color(0xFF2BA4EC),
                            ),
                            onRatingUpdate: (rating) {},
                            ignoreGestures: true,
                          ),
                          const SizedBox(width: 5),
                          Text(
                              '(${scoresModel?.total.toString()})  ${scoresModel?.average.toString()}'),
                        ],
                      ),
                    ),
                  ),
                ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Text(
                      'Prosapp',
                      style: TextStyle(fontSize: 10, color: Colors.grey[700]),
                    ),
                    Padding(
                      padding: const EdgeInsets.only(top: 7, left: 3, right: 3),
                      child: Text(
                        '®',
                        style: TextStyle(fontSize: 25, color: Colors.grey[700]),
                      ),
                    ),
                    Text(
                      'todos los derechos reservados',
                      style: TextStyle(fontSize: 10, color: Colors.grey[700]),
                    ),
                  ],
                ),
              ],
            ),
          ),
          Row(
            children: [
              const SizedBox(width: 10),
              ElevatedButton(
                onPressed: () {
                  AuthenticationRepository.instance.logout();
                },
                style: ElevatedButton.styleFrom(
                  backgroundColor: Colors.white,
                  shape: const CircleBorder(),
                  elevation: 3,
                  minimumSize: const Size(45, 45),
                ),
                child: const Icon(
                  Icons.logout_outlined,
                  color: Colors.red,
                  size: 35,
                ),
              ),
              const SizedBox(width: 5),
              ElevatedButton(
                onPressed: () {
                  if (user?.state == 'pendiente' || user?.state == null) {
                    Navigator.pushNamed(context, '/profesionalProfile');
                  } else if (user?.state == 'revision') {
                    Navigator.pushNamed(context, '/profesionalRevision');
                  } else if (user?.state == 'activo') {
                    Navigator.push(
                      context,
                      CupertinoPageRoute(
                        builder: (BuildContext context) {
                          return const PruebaScreen();
                        },
                      ),
                    );
                  }
                },
                style: ElevatedButton.styleFrom(
                  backgroundColor: const Color(0xFF2BA4EC),
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(50),
                  ),
                  elevation: 0,
                  minimumSize: const Size(200, 45),
                ),
                child: const Text(
                  'Modo profesional',
                  style: TextStyle(
                    color: Colors.white,
                    fontSize: 15,
                  ),
                ),
              ),
            ],
          ),
          const SizedBox(height: 10),
        ],
      ),
    );
  }
}