import 'package:easycook_mobile/pages/account/edit_akun.dart';
import 'package:easycook_mobile/pages/account/favorit.dart';
import 'package:easycook_mobile/pages/account/ganti_password.dart';
import 'package:easycook_mobile/pages/account/preferensi.dart';
import 'package:easycook_mobile/pages/account/riwayat_masakan.dart';
import 'package:easycook_mobile/pages/auth/login.dart';
import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:easycook_mobile/theme.dart';
import 'package:shared_preferences/shared_preferences.dart';

class ProfilPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: PageProfil(),
    );
  }
}

class PageProfil extends StatefulWidget {
  PageProfil({
    super.key,
  });

  @override
  State<PageProfil> createState() => _PageProfilState();
}

class _PageProfilState extends State<PageProfil> {
  final Future<SharedPreferences> _prefs = SharedPreferences.getInstance();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        width: double.infinity,
        padding: EdgeInsets.only(top: 75, left: 16, right: 16, bottom: 27),
        decoration: BoxDecoration(
          image: DecorationImage(
            image: AssetImage('images/BG.png'),
            fit: BoxFit.fill,
          ),
        ),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            // Foto Profil
            SizedBox(
              width: 92,
              height: 92,
              child: Image.asset('images/account_icon.png'),
            ),
            // Nama
            Text(
              'Rika Kusumawati',
              style: GoogleFonts.montserrat().copyWith(
                fontSize: 14,
                fontWeight: FontWeight.bold,
              ),
            ),
            // Edit Akun
            InkWell(
              onTap: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(
                    builder: (context) => EditAkunPage(),
                  ),
                );
              },
              child: Container(
                padding: EdgeInsets.only(left: 14),
                height: 62,
                decoration: BoxDecoration(
                  border: Border.all(color: Colors.grey),
                  borderRadius: BorderRadius.circular(7),
                ),
                child: Row(
                  children: [
                    SvgPicture.asset('assets/icons/edit_akun.svg'),
                    SizedBox(
                      width: 23,
                    ),
                    Text(
                      'Edit Akun',
                      style: GoogleFonts.montserrat().copyWith(
                        fontSize: 14,
                        fontWeight: FontWeight.bold,
                        color: Colors.black,
                      ),
                    ),
                  ],
                ),
              ),
            ),
            // Riwayat Masakan
            InkWell(
              onTap: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(
                    builder: (context) => RiwayatMasakanPage(),
                  ),
                );
              },
              child: Container(
                padding: EdgeInsets.only(left: 14),
                height: 62,
                decoration: BoxDecoration(
                  border: Border.all(color: Colors.grey),
                  borderRadius: BorderRadius.circular(7),
                ),
                child: Row(
                  children: [
                    SvgPicture.asset('assets/icons/riwayat_masakan.svg'),
                    SizedBox(
                      width: 23,
                    ),
                    Text(
                      'Riwayat Masakan',
                      style: GoogleFonts.montserrat().copyWith(
                        fontSize: 14,
                        fontWeight: FontWeight.bold,
                        color: Colors.black,
                      ),
                    ),
                  ],
                ),
              ),
            ),
            // Preferensi
            InkWell(
              onTap: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(
                    builder: (context) => PreferensiAccountPage(),
                  ),
                );
              },
              child: Container(
                padding: EdgeInsets.only(left: 14),
                height: 62,
                decoration: BoxDecoration(
                  border: Border.all(color: Colors.grey),
                  borderRadius: BorderRadius.circular(7),
                ),
                child: Row(
                  children: [
                    SvgPicture.asset('assets/icons/preferensi.svg'),
                    SizedBox(
                      width: 23,
                    ),
                    Text(
                      'Preferensi',
                      style: GoogleFonts.montserrat().copyWith(
                        fontSize: 14,
                        fontWeight: FontWeight.bold,
                        color: Colors.black,
                      ),
                    ),
                  ],
                ),
              ),
            ),
            // Favorit
            InkWell(
              onTap: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(
                    builder: (context) => FavoritPage(),
                  ),
                );
              },
              child: Container(
                padding: EdgeInsets.only(left: 14),
                height: 62,
                decoration: BoxDecoration(
                  border: Border.all(color: Colors.grey),
                  borderRadius: BorderRadius.circular(7),
                ),
                child: Row(
                  children: [
                    SvgPicture.asset('assets/icons/favorit.svg'),
                    SizedBox(
                      width: 23,
                    ),
                    Text(
                      'Favorit',
                      style: GoogleFonts.montserrat().copyWith(
                        fontSize: 14,
                        fontWeight: FontWeight.bold,
                        color: Colors.black,
                      ),
                    ),
                  ],
                ),
              ),
            ),
            // Ganti Password
            InkWell(
              onTap: () {
                Navigator.push(
                    context,
                    MaterialPageRoute(
                        builder: (context) => GantiPasswordPage()));
              },
              child: Container(
                padding: EdgeInsets.only(left: 14),
                height: 62,
                decoration: BoxDecoration(
                  border: Border.all(color: Colors.grey),
                  borderRadius: BorderRadius.circular(7),
                ),
                child: Row(
                  children: [
                    SvgPicture.asset('assets/icons/ganti_password.svg'),
                    SizedBox(
                      width: 23,
                    ),
                    Text(
                      'Ganti Password',
                      style: GoogleFonts.montserrat().copyWith(
                        fontSize: 14,
                        fontWeight: FontWeight.bold,
                        color: Colors.black,
                      ),
                    ),
                  ],
                ),
              ),
            ),
            // Button
            OutlinedButton(
              onPressed: () async {
                final SharedPreferences? prefs = await _prefs;
                prefs?.clear();

                Navigator.pushReplacement(context,
                    MaterialPageRoute(builder: (context) => LoginPage()));
              },
              child: Text(
                'Keluar',
                style: GoogleFonts.montserrat().copyWith(
                  fontSize: 18,
                  fontWeight: FontWeight.bold,
                  color: orange,
                ),
              ),
              style: OutlinedButton.styleFrom(
                backgroundColor: Colors.white,
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(13),
                ),
                side: BorderSide(
                  color: orange,
                  width: 2,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}