import 'package:flutter/material.dart';
import 'package:lucide_icons/lucide_icons.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';

import '../data/local/database.dart';
import '../providers/api_client_provider.dart';

/// Small cloud-upload glyph shown next to a row whose id has a queued
/// offline write (Phase 4). Renders nothing when the queue is empty for
/// that id, so list views stay clean during normal online operation.
class PendingSyncBadge extends ConsumerWidget {
  final String domain;
  final int id;
  final double size;

  const PendingSyncBadge({
    super.key,
    required this.domain,
    required this.id,
    this.size = 14,
  });

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final pending = switch (domain) {
      kSyncDomainNotes => ref.watch(pendingNoteIdsProvider).asData?.value,
      kSyncDomainTasks => ref.watch(pendingTaskIdsProvider).asData?.value,
      kSyncDomainProjects =>
        ref.watch(pendingProjectIdsProvider).asData?.value,
      _ => null,
    };
    if (pending == null || !pending.contains(id)) {
      return const SizedBox.shrink();
    }
    final scheme = Theme.of(context).colorScheme;
    return Tooltip(
      message: 'Pending sync — will save when online',
      child: Padding(
        padding: const EdgeInsets.symmetric(horizontal: 4),
        child: Icon(
          LucideIcons.uploadCloud,
          size: size,
          color: scheme.onSurfaceVariant,
        ),
      ),
    );
  }
}