import 'package:flutter/material.dart';

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

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


class AvatarTile extends StatefulWidget {
  final String? avatarUrl;
  final String title;
  final String description;
  final String errorText;

  const AvatarTile({
    super.key,
    required this.avatarUrl,
    required this.title,
    required this.description,
    required this.errorText,
  });

  @override
  State<AvatarTile> createState() => _AvatarTileState();
}

class _AvatarTileState extends State<AvatarTile> {
  static const double _avatarSize = 96.0;
  static const double _iconSize = 32.0;
  static const double _titleSpacing = 4.0;
  static const String _placeholderAsset = 'assets/images/avatar_placeholder.png';

  bool _isHovering = false;

  Future<void> _pickImage() async {
    final picker = ImagePicker();
    final file = await picker.pickImage(source: ImageSource.gallery);
    if (file != null) {
      debugPrint('Selected new avatar: ${file.path}');
    }
  }

  @override
  Widget build(BuildContext context) {
    final loc = AppLocalizations.of(context)!;
    final safeUrl =
        widget.avatarUrl?.trim().isNotEmpty == true ? widget.avatarUrl : null;
    final theme = Theme.of(context);

    return Column(
      children: [
        MouseRegion(
          onEnter: (_) => setState(() => _isHovering = true),
          onExit: (_) => setState(() => _isHovering = false),
          child: GestureDetector(
            onTap: _pickImage,
            child: Stack(
              alignment: Alignment.center,
              children: [
                ClipOval(
                  child: safeUrl != null
                      ? Image.network(
                          safeUrl,
                          width: _avatarSize,
                          height: _avatarSize,
                          fit: BoxFit.cover,
                          errorBuilder: (_, _, _) => _buildPlaceholder(),
                        )
                      : _buildPlaceholder(),
                ),
                if (_isHovering)
                  ClipOval(
                    child: Container(
                      width: _avatarSize,
                      height: _avatarSize,
                      color: theme.colorScheme.primary.withAlpha(90),
                      child: Icon(
                        Icons.camera_alt,
                        color: theme.colorScheme.onSecondary,
                        size: _iconSize,
                      ),
                    ),
                  ),
              ],
            ),
          ),
        ),
        SizedBox(height: _titleSpacing),
        Text(
          loc.avatarHint,
          style: theme.textTheme.bodySmall?.copyWith(
            color: theme.colorScheme.onSecondary,
          ),
        ),
      ],
    );
  }

  Widget _buildPlaceholder() {
    return Image.asset(
      _placeholderAsset,
      width: _avatarSize,
      height: _avatarSize,
      fit: BoxFit.cover,
    );
  }
}