import 'package:flutter/material.dart';

import 'package:provider/provider.dart';

import 'package:pweb/controllers/auth/account_name.dart';
import 'package:pweb/pages/settings/profile/account/name/actions.dart';
import 'package:pweb/pages/settings/profile/account/name/text.dart';


class _AccountNameConstants {
  static const inputWidth = 200.0;
  static const actionsSpacing = 8.0;
  static const actionsWidth = kMinInteractiveDimension * 2;
  static const actionsSlotWidth = actionsWidth + actionsSpacing;
  static const errorSpacing = 4.0;
  static const borderWidth = 2.0;
}

class AccountName extends StatelessWidget {
  final String hintText;
  final String lastNameHint;

  const AccountName({
    super.key,
    required this.hintText,
    required this.lastNameHint,
  });

  @override
  Widget build(BuildContext context) {
    return _AccountNameBody(hintText: hintText, lastNameHint: lastNameHint);
  }
}

class _AccountNameBody extends StatelessWidget {
  const _AccountNameBody({required this.hintText, required this.lastNameHint});

  final String hintText;
  final String lastNameHint;

  @override
  Widget build(BuildContext context) {
    final state = context.watch<AccountNameController>();
    final theme = Theme.of(context);

    return Column(
      mainAxisSize: MainAxisSize.min,
      children: [
        Row(
          mainAxisSize: MainAxisSize.min,
          crossAxisAlignment: CrossAxisAlignment.center,
          children: [
            const SizedBox(width: _AccountNameConstants.actionsSlotWidth),
            AccountNameText(
              hintText: hintText,
              lastNameHint: lastNameHint,
              inputWidth: _AccountNameConstants.inputWidth,
              borderWidth: _AccountNameConstants.borderWidth,
            ),
            SizedBox(
              width: _AccountNameConstants.actionsSlotWidth,
              child: state.isEditing
                  ? const Padding(
                      padding: EdgeInsets.only(
                        left: _AccountNameConstants.actionsSpacing,
                      ),
                      child: AccountNameActions(),
                    )
                  : null,
            ),
          ],
        ),
        const SizedBox(height: _AccountNameConstants.errorSpacing),
        if (state.errorText.isNotEmpty)
          Text(
            state.errorText,
            style: theme.textTheme.bodySmall?.copyWith(
              color: theme.colorScheme.error,
            ),
          ),
      ],
    );
  }
}