import 'package:flutter/material.dart';

import '../utils/Colors.dart';
import 'GlassSurface.dart';

typedef NavEntry = ({IconData icon, String label, VoidCallback onTap});

/// The floating tab bar: a cluster of round frosted buttons, icons only.
/// The open tab rises out of the row as a solid white disc. It switches tabs
/// in place; nothing here pushes a page.
class FloatingNav extends StatelessWidget {
  final List<NavEntry> entries;

  final int selected;

  const FloatingNav({
    super.key,
    required this.entries,
    required this.selected,
  });

  static const double _size = 58;

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      top: false,
      child: Padding(
        padding: const EdgeInsets.fromLTRB(16, 0, 16, 16),
        child: Center(
          child: Container(
            decoration: const BoxDecoration(
              borderRadius: BorderRadius.all(Radius.circular(_size)),
              boxShadow: [
                BoxShadow(
                  color: Color(0x1F1A1F1C),
                  blurRadius: 30,
                  offset: Offset(0, 12),
                ),
              ],
            ),
            child: GlassSurface(
              radius: const BorderRadius.all(Radius.circular(_size)),
              tint: colorGlass,
              padding: const EdgeInsets.all(5),
              child: Row(
                mainAxisSize: MainAxisSize.min,
                children: [
                  for (int index = 0; index < entries.length; index++) ...[
                    if (index > 0) const SizedBox(width: 4),
                    _button(entries[index], index == selected),
                  ],
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }

  Widget _button(NavEntry entry, bool active) {
    return Semantics(
      button: true,
      selected: active,
      label: entry.label,
      child: Tooltip(
        message: entry.label,
        child: GestureDetector(
          onTap: entry.onTap,
          behavior: HitTestBehavior.opaque,
          child: AnimatedContainer(
            duration: const Duration(milliseconds: 220),
            curve: Curves.easeOutCubic,
            width: _size,
            height: _size,
            alignment: Alignment.center,
            decoration: BoxDecoration(
              shape: BoxShape.circle,
              color: active ? colorWhite : colorWhite.withValues(alpha: 0.35),
              border: Border.all(
                color: colorWhite.withValues(alpha: active ? 1 : 0.6),
                width: 1,
              ),
              boxShadow: active
                  ? const [
                      BoxShadow(
                        color: Color(0x261A1F1C),
                        blurRadius: 16,
                        offset: Offset(0, 6),
                      ),
                    ]
                  : const [],
            ),
            child: Icon(entry.icon,
                size: 22, color: active ? colorInk : colorInkSoft),
          ),
        ),
      ),
    );
  }
}