import 'package:flutter/material.dart';
import '../common/settings.dart';


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

  @override
  State<Profile> createState() => _ProfileState();
}

class _ProfileState extends State<Profile> {

  // Section Header with title + subtitle
  Widget _buildSectionHeader(String title, String subtitle) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              title,
              style: fontTextStyle(12, const Color(0XFF232527), FontWeight.w600),
            ),
            const SizedBox(height: 4),
            Text(
              subtitle,
              style: fontTextStyle(10, const Color(0XFF646464), FontWeight.w400),
            ),
          ],
        ),
        if (title != "My Transactions")
          Image.asset(
            'images/arrow-right.png',
            fit: BoxFit.cover,
            width:
            16, // Match the diameter of the CircleAvatar
            height: 16,
          ),
      ],
    );
  }


  // List Tile with arrow
  Widget _buildListTile(String title) {
    return ListTile(
      dense: true,
      contentPadding: EdgeInsets.zero,
      title: Text(title,
          style:fontTextStyle(10, Color(0XFF646464), FontWeight.w400)),
      trailing:Image.asset(
        'images/arrow-right.png',
        fit: BoxFit.cover,
        width:
        16, // Match the diameter of the CircleAvatar
        height: 16,
      ),
      onTap: () {},
    );
  }

  @override
  Widget build(BuildContext context) {
    return  Scaffold(
      backgroundColor: Colors.white,
      appBar: AppSettings.supplierAppBarWithActionsText('Profile',context),
      body: Padding(
        padding: EdgeInsets.all(24),
        child: Container(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisAlignment: MainAxisAlignment.start,
            children: [
              SizedBox(height:MediaQuery.of(context).size.height * .008,),
              Padding( padding: EdgeInsets.all(0),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: [
                    Row(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      mainAxisAlignment: MainAxisAlignment.start,
                      children: [
                        AppSettings.loginType.toString().toLowerCase()=='user'?
                        GestureDetector(
                          onTap: () {
                            /*Navigator.push(
                            context,
                            new MaterialPageRoute(
                                builder: (__) => new ImageZoomPage(
                                    imageName: 'Profile',
                                    imageDetails: AppSettings.profilePictureUrl)));*/
                          },
                          child: Stack(
                            alignment: Alignment.center, // Centers the stack's children
                            children: [

                              // CircleAvatar background
                              ClipOval(
                                child: Container(
                                  height: 56, // Ensure the container's height is the same as the profile image
                                  width: 56,

                                  decoration: BoxDecoration(
                                      color: Colors.transparent,
                                      shape: BoxShape.circle, // Makes the container circular
                                      image: DecorationImage(
                                          image: (AppSettings.profilePictureUrl !=
                                              '' &&
                                              AppSettings.profilePictureUrl !=
                                                  'null')
                                              ? NetworkImage(AppSettings.profilePictureUrl)
                                          as ImageProvider
                                              : AssetImage(
                                              "images/profile_pic.png"), // picked file
                                          fit: BoxFit.cover)),
                                ),
                              ),
                              // Positioned image on top of CircleAvatar
                            ],
                          ),

                        ):
                        ClipOval(
                          child: Container(
                            height: 56, // Ensure the container's height is the same as the profile image
                            width: 56,

                            decoration: BoxDecoration(
                                color: Colors.transparent,
                                shape: BoxShape.circle, // Makes the container circular
                                image: DecorationImage(
                                    image: (AssetImage(
                                        "images/profile_pic.png")), // picked file
                                    fit: BoxFit.contain)),
                          ),
                        ),
                        SizedBox(width:MediaQuery.of(context).size.width * .032,),
                        Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          mainAxisAlignment: MainAxisAlignment.start,
                          children: [
                            Text(
                              AppSettings.userName,
                              style: fontTextStyle(14,Color(0XFF343637),FontWeight.w500),
                            ),
                            Row(
                              children: [
                                Text(
                                  '+91 ${AppSettings.phoneNumber}',
                                  style: fontTextStyle(10,Color(0XFF646566),FontWeight.w400),
                                ),
                                SizedBox(width:MediaQuery.of(context).size.width * .032,),
                                Visibility(
                                  visible:AppSettings.loginType.toString().toLowerCase()=='user',
                                  child:   Text(
                                    AppSettings.email,
                                    style: fontTextStyle(10,Color(0XFF646566),FontWeight.w400),
                                  ),),

                              ],
                            ),
                            SizedBox(height:MediaQuery.of(context).size.height * .004,),
                            /*GestureDetector(
                              onTap: (){
                                Navigator.push(
                                  context,
                                  MaterialPageRoute(builder: (context) => UpdateProfile()),
                                );
                              },
                              child: Text('Edit',style: fontTextStyle(14,Color(0XFF1D7AFC),FontWeight.w600),),
                            )*/
                          ],
                        )
                      ],
                    ),
                  ],
                ),),
              SizedBox(height:MediaQuery.of(context).size.height * .008,),
              Divider(
                height: 24,                 // space around divider
                color: Color(0XFFC3C4C4),  // divider color
                thickness: 2,              // 👈 increase thickness here
              ),
              Expanded(child: ListView(
                padding: const EdgeInsets.symmetric(horizontal: 0, vertical: 24),
                children: [

                  // My Accounts Section
                  _buildSectionHeader("My Accounts", "Favorites & Suppliers"),
                  const Divider(thickness: 1, height: 24, color: Color(0xFFC3C4C4)),

                  // My Transactions (Expandable)
                  ExpansionTile(
                    tilePadding: EdgeInsets.zero,
                    childrenPadding: EdgeInsets.zero,
                    title: _buildSectionHeader(
                      "My Transactions",
                      "View all Payments, Credit accounts & Refunds",
                    ),
                    children: [
                      _buildListTile("My Payments"),
                      _buildListTile("Credit Accounts"),
                      _buildListTile("Modes of Payment"),
                      _buildListTile("Refunds"),
                    ],
                    trailing: Image.asset(
                      'images/arrow-right.png',
                      fit: BoxFit.cover,
                      width:
                      16, // Match the diameter of the CircleAvatar
                      height: 16,
                    ),
                    // 👇 This removes that unwanted grey line
                    shape: const Border(), // no top/bottom border
                    collapsedShape: const Border(), // even when collapsed
                  ),
                  const Divider(thickness: 1, height: 24, color: Color(0xFFC3C4C4)),

                  // Addresses
                  _buildSectionHeader("Addresses", "Share, Edit and Add New Addresses"),
                  const Divider(thickness: 1, height: 24, color: Color(0xFFC3C4C4)),

                  _buildSectionHeader("Account Statements", "Get statements for reimbursement or book keeping!"),
                  const Divider(thickness: 1, height: 24, color: Color(0xFFC3C4C4)),

                  _buildSectionHeader("Settings", "Manage Account Settings"),

                  Divider(
                    height: 48,                 // space around divider
                    color: Color(0XFFC3C4C4),  // divider color
                    thickness: 2,              // 👈 increase thickness here
                  ),
                ],
              ),)



            ],
          ),
        ),
      )
    );
  }
}