/// Renders the Top Bar widget for the FocusFlow Flutter UI.
library;

import 'package:flutter/material.dart';

import '../theme/focus_flow_tokens.dart';

class TopBar extends StatelessWidget {
  const TopBar({required this.dateLabel, super.key});

  final String dateLabel;

  @override
  Widget build(BuildContext context) {
    return Row(
      children: [
        Text('Today', style: Theme.of(context).textTheme.headlineLarge),
        const SizedBox(width: 30),
        _IconButton(icon: Icons.calendar_today, onPressed: () {}),
        _IconButton(icon: Icons.chevron_left, onPressed: () {}),
        Padding(
          padding: const EdgeInsets.symmetric(horizontal: 12),
          child: Text(
            dateLabel,
            style: const TextStyle(
              color: FocusFlowTokens.textPrimary,
              fontSize: 17,
            ),
          ),
        ),
        _IconButton(icon: Icons.chevron_right, onPressed: () {}),
        const Spacer(),
        const _ModeToggle(),
        const SizedBox(width: 28),
        OutlinedButton.icon(
          onPressed: () {},
          style: OutlinedButton.styleFrom(
            foregroundColor: FocusFlowTokens.textPrimary,
            side: const BorderSide(color: FocusFlowTokens.subtleBorder),
            fixedSize: const Size(136, 48),
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(
                FocusFlowTokens.smallButtonRadius,
              ),
            ),
          ),
          icon: const Icon(Icons.wb_sunny_outlined),
          label: const Text('Settings'),
        ),
      ],
    );
  }
}

class _IconButton extends StatelessWidget {
  const _IconButton({required this.icon, required this.onPressed});

  final IconData icon;
  final VoidCallback onPressed;

  @override
  Widget build(BuildContext context) {
    return IconButton(
      onPressed: onPressed,
      color: FocusFlowTokens.textPrimary,
      icon: Icon(icon),
    );
  }
}

class _ModeToggle extends StatelessWidget {
  const _ModeToggle();

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 48,
      width: 220,
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(FocusFlowTokens.smallButtonRadius),
        border: Border.all(color: FocusFlowTokens.subtleBorder),
      ),
      child: Row(
        children: [
          Expanded(
            child: Container(
              alignment: Alignment.center,
              decoration: BoxDecoration(
                color: FocusFlowTokens.glassPanelStrong,
                borderRadius: BorderRadius.circular(
                  FocusFlowTokens.smallButtonRadius,
                ),
                border: Border.all(color: FocusFlowTokens.navBorder),
              ),
              child: const Text('Compact'),
            ),
          ),
          Expanded(
            child: TextButton(
              onPressed: () {},
              child: const Text(
                'Normal',
                style: TextStyle(color: FocusFlowTokens.textPrimary),
              ),
            ),
          ),
        ],
      ),
    );
  }
}