import 'package:flutter/material.dart';

import 'package:provider/provider.dart';

import 'package:pshared/provider/account.dart';

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

import 'package:pweb/generated/i18n/app_localizations.dart';


class ProfileSettingsPage extends StatelessWidget {
  const ProfileSettingsPage({super.key});

  static const _cardPadding = EdgeInsets.symmetric(
    vertical: 32,
    horizontal: 16,
  );
  static const _cardRadius = 16.0;
  static const _itemSpacing = 12.0;

  @override
  Widget build(BuildContext context) {
    final loc = AppLocalizations.of(context)!;
    final theme = Theme.of(context);
    final accountFirstName = context.select<AccountProvider, String?>(
      (provider) => provider.account?.name,
    );
    final accountLastName = context.select<AccountProvider, String?>(
      (provider) => provider.account?.lastName,
    );
    final accountAvatarUrl = context.select<AccountProvider, String?>(
      (provider) => provider.account?.avatarUrl,
    );

    return ChangeNotifierProxyProvider<AccountProvider, AccountNameController>(
      create: (_) => AccountNameController(
        initialFirstName: accountFirstName ?? '',
        initialLastName: accountLastName ?? '',
        errorMessage: loc.accountNameUpdateError,
      ),
      update: (_, accountProvider, controller) =>
          controller!..update(accountProvider),
      child: Align(
        alignment: Alignment.topCenter,
        child: Material(
          elevation: 4,
          borderRadius: BorderRadius.circular(_cardRadius),
          color: theme.colorScheme.onSecondary,
          child: Padding(
            padding: _cardPadding,
            child: Column(
              mainAxisSize: MainAxisSize.min,
              spacing: _itemSpacing,
              children: [
                AvatarTile(
                  avatarUrl: accountAvatarUrl,
                  title: loc.avatar,
                  description: loc.avatarHint,
                  errorText: loc.avatarUpdateError,
                ),
                AccountName(
                  hintText: loc.accountNameHint,
                  lastNameHint: loc.lastName,
                ),
                SizedBox(height: _itemSpacing),
                ProfileActionsSection(
                  nameLabel: loc.editName,
                  languageLabel: loc.language,
                  passwordLabel: loc.changePassword,
                  passwordSuccessText: loc.changePasswordSuccess,
                  passwordErrorText: loc.changePasswordError,
                  oldPasswordLabel: loc.oldPassword,
                  newPasswordLabel: loc.newPassword,
                  confirmPasswordLabel: loc.confirmPassword,
                  savePasswordLabel: loc.savePassword,
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}