import 'package:flutter/material.dart';

import '../i18n/strings.g.dart';
import '../services/offer_thumbnail.dart' show offerThumbnailDataUri;
import 'avatar.dart';
import 'photo_pick.dart';
import 'seed_glyph.dart';
import 'theme.dart';

/// Lets the user choose a profile avatar: take/pick a photo (shrunk to a tiny
/// inline thumbnail), pick one of our seed illustrations, or remove it.
///
/// Returns the new avatar value (`data:` thumbnail or `tane:seed:<glyph>`),
/// an empty string to clear it, or null when cancelled.
Future<String?> showAvatarPicker(
  BuildContext context, {
  required String current,
}) {
  return showModalBottomSheet<String>(
    context: context,
    isScrollControlled: true,
    builder: (sheetContext) {
      final t = sheetContext.t;
      return SafeArea(
        child: Padding(
          padding: const EdgeInsets.fromLTRB(16, 12, 16, 16),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Text(t.avatar.title,
                  style: Theme.of(sheetContext).textTheme.titleMedium),
              const SizedBox(height: 8),
              ListTile(
                key: const Key('avatar.fromPhoto'),
                contentPadding: EdgeInsets.zero,
                leading: const Icon(Icons.add_a_photo_outlined,
                    color: seedGreen),
                title: Text(t.avatar.fromPhoto),
                onTap: () async {
                  final bytes = await pickPhoto(sheetContext);
                  if (bytes == null) return;
                  final uri = offerThumbnailDataUri(bytes, maxBytes: 24000);
                  if (sheetContext.mounted) {
                    Navigator.of(sheetContext).pop(uri ?? '');
                  }
                },
              ),
              const SizedBox(height: 6),
              Text(t.avatar.illustration,
                  style: const TextStyle(color: seedMuted, fontSize: 13)),
              const SizedBox(height: 10),
              Wrap(
                spacing: 14,
                runSpacing: 14,
                children: [
                  for (final name in avatarGlyphNames)
                    InkWell(
                      key: Key('avatar.glyph.$name'),
                      borderRadius: BorderRadius.circular(40),
                      onTap: () => Navigator.of(sheetContext)
                          .pop(avatarGlyphToken(name)),
                      child: CircleAvatar(
                        radius: 24,
                        backgroundColor: seedGreen,
                        child: SeedGlyph(avatarGlyphChar(name)!,
                            size: 26, color: Colors.white),
                      ),
                    ),
                ],
              ),
              if (current.isNotEmpty) ...[
                const SizedBox(height: 8),
                Align(
                  alignment: AlignmentDirectional.centerStart,
                  child: TextButton.icon(
                    key: const Key('avatar.remove'),
                    onPressed: () => Navigator.of(sheetContext).pop(''),
                    icon: const Icon(Icons.delete_outline, size: 18),
                    label: Text(t.avatar.remove),
                  ),
                ),
              ],
            ],
          ),
        ),
      );
    },
  );
}