import 'package:design_system/design_system.dart';
import 'package:flutter/material.dart';
import 'package:krow_domain/krow_domain.dart';

/// A header widget for the shift details page displaying the role, client name, and address.
class ShiftDetailsHeader extends StatelessWidget {
  /// The shift entity containing the header information.
  final Shift shift;

  /// Creates a [ShiftDetailsHeader].
  const ShiftDetailsHeader({
    super.key,
    required this.shift,
  });

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.all(UiConstants.space5),
      child: IntrinsicHeight(
        child: Row(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          spacing: UiConstants.space4,
          children: [
            Container(
              width: 114,
              decoration: BoxDecoration(
                color: UiColors.primary.withAlpha(20),
                borderRadius: BorderRadius.circular(
                  UiConstants.radiusBase,
                ),
                border: Border.all(color: UiColors.primary),
              ),
              child: const Center(
                child: Icon(
                  UiIcons.briefcase,
                  color: UiColors.primary,
                  size: 24,
                ),
              ),
            ),
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                mainAxisAlignment: MainAxisAlignment.center,
                spacing: UiConstants.space3,
                children: [
                  Text(
                    shift.title,
                    style: UiTypography.headline1b.textPrimary,
                  ),
                  Column(
                    spacing: UiConstants.space1,
                    children: [
                      // Client name
                      Row(
                        spacing: UiConstants.space1,
                        children: [
                          const Icon(
                            UiIcons.building,
                            size: 16,
                            color: UiColors.textSecondary,
                          ),
                          Expanded(
                            child: Text(
                              shift.clientName,
                              style: UiTypography.body1m.textSecondary,
                            ),
                          ),
                        ],
                      ),
                      
                      // Location address (if available)
                      Row(
                        spacing: UiConstants.space1,
                        children: [
                          const Icon(
                            UiIcons.mapPin,
                            size: 16,
                            color: UiColors.textSecondary,
                          ),
                          Expanded(
                            child: Text(
                              shift.locationAddress,
                              style: UiTypography.body2r.textSecondary,
                            ),
                          ),
                        ],
                      ),
                    ],
                  ),
                
                ],
              ),
            ),
          ],
        ),
      ),
    );
  }
}
