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


/// A form widget containing all personal information fields.
///
/// Includes read-only fields for full name and email,
/// and editable fields for phone and address.
/// Uses only design system tokens for colors, typography, and spacing.
class PersonalInfoForm extends StatelessWidget {
  /// The staff member's full name (read-only).
  final String fullName;

  /// The staff member's email (read-only).
  final String email;

  /// Controller for the phone number field.
  final TextEditingController phoneController;

  /// Controller for the address field.
  final TextEditingController addressController;

  /// Whether the form fields are enabled for editing.
  final bool enabled;

  /// Creates a [PersonalInfoForm].
  const PersonalInfoForm({
    super.key,
    required this.fullName,
    required this.email,
    required this.phoneController,
    required this.addressController,
    this.enabled = true,
  });

  @override
  Widget build(BuildContext context) {
    final TranslationsStaffOnboardingPersonalInfoEn i18n = t.staff.onboarding.personal_info;

    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: <Widget>[
        _FieldLabel(text: i18n.full_name_label),
        const SizedBox(height: UiConstants.space2),
        _ReadOnlyField(value: fullName),
        const SizedBox(height: UiConstants.space4),

        _FieldLabel(text: i18n.email_label),
        const SizedBox(height: UiConstants.space2),
        _ReadOnlyField(value: email),
        const SizedBox(height: UiConstants.space4),

        _FieldLabel(text: i18n.phone_label),
        const SizedBox(height: UiConstants.space2),
        _EditableField(
          controller: phoneController,
          hint: i18n.phone_hint,
          enabled: enabled,
        ),
        const SizedBox(height: UiConstants.space4),

        _FieldLabel(text: i18n.locations_label),
        const SizedBox(height: UiConstants.space2),
        _EditableField(
          controller: addressController,
          hint: i18n.locations_hint,
          enabled: enabled,
        ),
      ],
    );
  }
}

/// A label widget for form fields.
/// A label widget for form fields.
class _FieldLabel extends StatelessWidget {
  final String text;

  const _FieldLabel({required this.text});

  @override
  Widget build(BuildContext context) {
    return Text(
      text,
      style: UiTypography.body2m.copyWith(color: UiColors.textPrimary),
    );
  }
}

/// A read-only field widget for displaying non-editable information.
/// A read-only field widget for displaying non-editable information.
class _ReadOnlyField extends StatelessWidget {
  final String value;

  const _ReadOnlyField({required this.value});

  @override
  Widget build(BuildContext context) {
    return Container(
      width: double.infinity,
      padding: const EdgeInsets.symmetric(
        horizontal: UiConstants.space3,
        vertical: UiConstants.space3,
      ),
      decoration: BoxDecoration(
        color: UiColors.bgSecondary,
        borderRadius: BorderRadius.circular(UiConstants.radiusMdValue),
        border: Border.all(color: UiColors.border),
      ),
      child: Text(
        value,
        style: UiTypography.body2r.copyWith(color: UiColors.textPrimary),
      ),
    );
  }
}

/// An editable text field widget.
/// An editable text field widget.
class _EditableField extends StatelessWidget {
  final TextEditingController controller;
  final String hint;
  final bool enabled;

  const _EditableField({
    required this.controller,
    required this.hint,
    this.enabled = true,
  });

  @override
  Widget build(BuildContext context) {
    return TextField(
      controller: controller,
      enabled: enabled,
      style: UiTypography.body2r.copyWith(color: UiColors.textPrimary),
      decoration: InputDecoration(
        hintText: hint,
        hintStyle: UiTypography.body2r.copyWith(color: UiColors.textSecondary),
        contentPadding: const EdgeInsets.symmetric(
          horizontal: UiConstants.space3,
          vertical: UiConstants.space3,
        ),
        border: OutlineInputBorder(
          borderRadius: BorderRadius.circular(UiConstants.radiusMdValue),
          borderSide: const BorderSide(color: UiColors.border),
        ),
        enabledBorder: OutlineInputBorder(
          borderRadius: BorderRadius.circular(UiConstants.radiusMdValue),
          borderSide: const BorderSide(color: UiColors.border),
        ),
        focusedBorder: OutlineInputBorder(
          borderRadius: BorderRadius.circular(UiConstants.radiusMdValue),
          borderSide: const BorderSide(color: UiColors.primary),
        ),
        fillColor: UiColors.bgPopup,
        filled: true,
      ),
    );
  }
}
