/// Renders the Required Banner widget for the FocusFlow Flutter UI.
library;

import 'package:flutter/material.dart';

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

/// Banner that highlights the next required task, if one exists.
class RequiredBanner extends StatelessWidget {
  /// Creates a required-task banner.
  const RequiredBanner({this.model, super.key});

  /// Optional required task model to render.
  final RequiredBannerModel? model;

  @override
  Widget build(BuildContext context) {
    final banner = model;
    if (banner == null) {
      return const SizedBox(height: 72);
    }
    return Container(
      height: 72,
      padding: const EdgeInsets.symmetric(horizontal: 18),
      decoration: BoxDecoration(
        color: FocusFlowTokens.glassPanel,
        borderRadius: BorderRadius.circular(FocusFlowTokens.bannerRadius),
        border: Border.all(
          color: FocusFlowTokens.navBorder.withValues(alpha: 0.55),
        ),
      ),
      child: Row(
        children: [
          Container(
            width: 48,
            height: 48,
            decoration: const BoxDecoration(
              shape: BoxShape.circle,
              color: FocusFlowTokens.glassPanelStrong,
            ),
            child: const Icon(
              Icons.auto_awesome,
              color: FocusFlowTokens.accentMagenta,
            ),
          ),
          const SizedBox(width: 26),
          RichText(
            text: TextSpan(
              style: const TextStyle(
                color: FocusFlowTokens.textPrimary,
                fontSize: 19,
                fontWeight: FontWeight.w700,
              ),
              children: [
                const TextSpan(text: 'Next required task:   '),
                TextSpan(
                  text: banner.title,
                  style: const TextStyle(color: FocusFlowTokens.accentMagenta),
                ),
                TextSpan(
                  text: '  at ${banner.timeText}',
                  style: const TextStyle(fontWeight: FontWeight.w500),
                ),
              ],
            ),
          ),
          const Spacer(),
          OutlinedButton(
            onPressed: () {},
            style: OutlinedButton.styleFrom(
              foregroundColor: FocusFlowTokens.textPrimary,
              side: BorderSide(
                color: FocusFlowTokens.navBorder.withValues(alpha: 0.55),
              ),
              fixedSize: const Size(176, 46),
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(
                  FocusFlowTokens.smallButtonRadius,
                ),
              ),
            ),
            child: const FittedBox(
              fit: BoxFit.scaleDown,
              child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [Text('Show upcoming'), Icon(Icons.chevron_right)],
              ),
            ),
          ),
        ],
      ),
    );
  }
}