social-app/apps/lib/shared/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) {
    final colorScheme = Theme.of(context).colorScheme;
    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(context, colorScheme),
          _buildHomeBtn(context, colorScheme),
        ],
      ),
    );
  }

  Widget _buildToggle(BuildContext context, ColorScheme colorScheme) {
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 5, vertical: 4),
      decoration: BoxDecoration(
        color: colorScheme.surfaceContainerLow,
        borderRadius: BorderRadius.circular(AppRadius.xxl),
        border: Border.all(color: colorScheme.outlineVariant),
        boxShadow: [
          BoxShadow(
            color: colorScheme.shadow.withValues(alpha: 0.12),
            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,
            colorScheme: colorScheme,
          ),
          const SizedBox(width: 4),
          _buildToggleItem(
            icon: LucideIcons.calendar,
            isActive: activeTab == DockTab.calendar,
            onTap: onCalendarTap,
            colorScheme: colorScheme,
          ),
        ],
      ),
    );
  }

  Widget _buildToggleItem({
    required IconData icon,
    required bool isActive,
    required ColorScheme colorScheme,
    VoidCallback? onTap,
  }) {
    return Material(
      color: colorScheme.surface.withValues(alpha: 0),
      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
                ? colorScheme.secondaryContainer
                : colorScheme.surface.withValues(alpha: 0),
            borderRadius: BorderRadius.circular(AppRadius.xl),
            border: Border.all(
              color: isActive
                  ? colorScheme.primary.withValues(alpha: 0.35)
                  : colorScheme.surface.withValues(alpha: 0),
            ),
          ),
          child: Icon(
            icon,
            size: 20,
            color: isActive
                ? colorScheme.primary
                : colorScheme.onSurfaceVariant,
          ),
        ),
      ),
    );
  }

  Widget _buildHomeBtn(BuildContext context, ColorScheme colorScheme) {
    return Material(
      color: colorScheme.surface.withValues(alpha: 0),
      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: colorScheme.surfaceContainerLow,
            borderRadius: BorderRadius.circular(AppRadius.xl),
            border: Border.all(color: colorScheme.outlineVariant),
            boxShadow: [
              BoxShadow(
                color: colorScheme.shadow.withValues(alpha: 0.12),
                blurRadius: AppRadius.sm,
                offset: const Offset(0, AppSpacing.xs / 2),
              ),
            ],
          ),
          child: Icon(
            LucideIcons.home,
            size: 20,
            color: colorScheme.onSurfaceVariant,
          ),
        ),
      ),
    );
  }
}