import 'package:flutter/material.dart';
import 'package:intl/intl.dart';
import 'package:niogu_app/core/constants/app_color.dart';
import 'package:niogu_app/core/constants/app_font_size.dart';
import 'package:niogu_app/core/components/modal_outlet_bottom.dart';
import 'package:niogu_app/core/utils/time_zone.dart';
import 'package:niogu_app/core/enums/user_role.dart';
import 'package:sizer/sizer.dart';

class InformationHeader extends StatelessWidget {
  final String? currentUserName;
  final String? currentOutletName;
  final UserRole? currentUserRole;

  const InformationHeader({
    super.key,
    this.currentUserName,
    this.currentOutletName,
    this.currentUserRole,
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.symmetric(horizontal: 4.w, vertical: 1.5.h),
      decoration: BoxDecoration(
        color: AppColor.primaryColor.withOpacity(0.05),
        border: Border(bottom: BorderSide(color: Colors.grey.shade200)),
      ),
      child: Row(
        children: [
          Container(
            padding: EdgeInsets.all(2.w),
            decoration: BoxDecoration(
              color: Colors.white,
              shape: BoxShape.circle,
              border: Border.all(color: Colors.grey.shade200),
            ),
            child: Icon(
              Icons.store_mall_directory_rounded,
              color: AppColor.primaryColor,
              size: 5.w,
            ),
          ),
          SizedBox(width: 3.w),

          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                InkWell(
                  onTap: currentUserRole == UserRole.admin
                      ? null
                      : () {
                          showModalBottomSheet(
                            context: context,
                            useRootNavigator: true,
                            isScrollControlled: true,
                            constraints: const BoxConstraints(
                              maxWidth: double.infinity,
                            ),
                            builder: (context) => const ModalOutletBottom(),
                          );
                        },
                  child: Row(
                    mainAxisSize: MainAxisSize.min,
                    children: [
                      Text(
                        currentOutletName ?? "Tidak ada outlet",
                        style: TextStyle(
                          fontWeight: FontWeight.bold,
                          fontSize: AppFontSize.small.sp,
                          color: AppColor.primaryColor,
                        ),
                      ),
                      if (currentUserRole == UserRole.owner)
                        Icon(
                          Icons.keyboard_arrow_down_rounded,
                          color: AppColor.primaryColor,
                          size: 5.w,
                        ),
                    ],
                  ),
                ),

                SizedBox(height: 0.2.h),
                Row(
                  children: [
                    Icon(Icons.person, color: Colors.grey, size: 3.w),
                    SizedBox(width: 1.w),
                    Text(
                      "Kasir: ${currentUserName ?? '-'}",
                      style: TextStyle(
                        fontSize: AppFontSize.small.sp,
                        color: Colors.grey[600],
                        fontWeight: FontWeight.w500,
                      ),
                    ),
                  ],
                ),
              ],
            ),
          ),

          Column(
            crossAxisAlignment: CrossAxisAlignment.end,
            children: [
              Text(
                DateFormat('dd MMMM yyyy').format(DateTime.now()),
                style: TextStyle(
                  fontSize: AppFontSize.small.sp,
                  fontWeight: FontWeight.bold,
                  color: Colors.grey[700],
                ),
              ),

              StreamBuilder(
                stream: Stream.periodic(const Duration(seconds: 1)),
                builder: (context, snapshot) {
                  return Text(
                    "${DateFormat('HH:mm:ss').format(DateTime.now())} ${TimeZone.getCurrentTimeZone()}",
                    style: TextStyle(
                      fontSize: AppFontSize.small.sp,
                      color: Colors.grey[600],
                    ),
                  );
                },
              ),
            ],
          ),
        ],
      ),
    );
  }
}