social-app/apps/lib/features/calendar/presentation/widgets/bottom_dock.dart

import 'package:flutter/material.dart';
import 'package:lucide_icons/lucide_icons.dart';
import '../../../../core/theme/design_tokens.dart';

enum DockTab { todo, calendar }

class BottomDock extends StatelessWidget {
  final DockTab activeTab;
  final VoidCallback? onTodoTap;
  final VoidCallback? onCalendarTap;
  final VoidCallback? onHomeTap;

  const BottomDock({
    super.key,
    required this.activeTab,
    this.onTodoTap,
    this.onCalendarTap,
    this.onHomeTap,
  });

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 72,
      padding: const EdgeInsets.only(
        left: AppSpacing.xl,
        right: AppSpacing.xl,
        top: AppSpacing.md,
        bottom: AppSpacing.sm,
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [_buildToggle(), _buildHomeBtn()],
      ),
    );
  }

  Widget _buildToggle() {
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 5, vertical: 4),
      decoration: BoxDecoration(
        color: AppColors.todoToggleBg,
        borderRadius: BorderRadius.circular(AppRadius.xxl),
        border: Border.all(color: AppColors.todoToggleBorder),
        boxShadow: [
          BoxShadow(
            color: AppColors.slate200.withValues(alpha: 0.45),
            blurRadius: AppRadius.sm,
            offset: const Offset(0, AppSpacing.xs / 2),
          ),
        ],
      ),
      child: Row(
        mainAxisSize: MainAxisSize.min,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          _buildToggleItem(
            icon: LucideIcons.listTodo,
            isActive: activeTab == DockTab.todo,
            onTap: onTodoTap,
          ),
          const SizedBox(width: 4),
          _buildToggleItem(
            icon: LucideIcons.calendar,
            isActive: activeTab == DockTab.calendar,
            onTap: onCalendarTap,
          ),
        ],
      ),
    );
  }

  Widget _buildToggleItem({
    required IconData icon,
    required bool isActive,
    VoidCallback? onTap,
  }) {
    return Material(
      color: Colors.transparent,
      child: InkWell(
        onTap: onTap,
        borderRadius: BorderRadius.circular(AppRadius.xl),
        child: AnimatedContainer(
          duration: const Duration(milliseconds: 140),
          curve: Curves.easeOut,
          width: 44,
          height: 44,
          decoration: BoxDecoration(
            color: isActive ? AppColors.todoToggleActiveBg : Colors.transparent,
            borderRadius: BorderRadius.circular(AppRadius.xl),
            border: Border.all(
              color: isActive
                  ? AppColors.todoToggleActiveBorder
                  : Colors.transparent,
            ),
          ),
          child: Icon(
            icon,
            size: 20,
            color: isActive ? AppColors.blue600 : AppColors.slate700,
          ),
        ),
      ),
    );
  }

  Widget _buildHomeBtn() {
    return Material(
      color: Colors.transparent,
      child: InkWell(
        key: const ValueKey('bottom_dock_home_button'),
        onTap: onHomeTap,
        borderRadius: BorderRadius.circular(AppRadius.xl),
        child: Container(
          width: 44,
          height: 44,
          decoration: BoxDecoration(
            color: AppColors.todoToggleBg,
            borderRadius: BorderRadius.circular(AppRadius.xl),
            border: Border.all(color: AppColors.todoToggleBorder),
            boxShadow: [
              BoxShadow(
                color: AppColors.slate200.withValues(alpha: 0.42),
                blurRadius: AppRadius.sm,
                offset: const Offset(0, AppSpacing.xs / 2),
              ),
            ],
          ),
          child: const Icon(
            LucideIcons.home,
            size: 20,
            color: AppColors.slate700,
          ),
        ),
      ),
    );
  }
}