import SwiftUI

/// Visual indicator of record changes (added/disappeared) with navigation
struct RecordChangeIndicator: View {
    let addedCount: Int
    let disappearedCount: Int
    let totalCount: Int
    let displayName: String
    let onAddedTap: () -> Void
    let onDisappearedTap: () -> Void

    private var addedPercentage: Double {
        guard totalCount > 0 else { return 0 }
        return Double(addedCount) / Double(totalCount) * 100
    }

    private var disappearedPercentage: Double {
        guard totalCount > 0 else { return 0 }
        return Double(disappearedCount) / Double(totalCount) * 100
    }

    var body: some View {
        VStack(spacing: 12) {
            Text("Record Changes")
                .font(.headline.weight(.semibold))
                .frame(maxWidth: .infinity, alignment: .leading)

            HStack(spacing: 12) {
                changeButton(
                    title: "Added",
                    count: addedCount,
                    percentage: addedPercentage,
                    icon: "plus.circle.fill",
                    color: .healthyGreen,
                    action: onAddedTap
                )

                changeButton(
                    title: "Gone",
                    count: disappearedCount,
                    percentage: disappearedPercentage,
                    icon: "xmark.circle.fill",
                    color: .criticalRed,
                    action: onDisappearedTap
                )
            }

            if totalCount > 0 {
                progressBar
            }
        }
        .padding(16)
        .background(Color(.systemBackground).opacity(0.5), in: RoundedRectangle(cornerRadius: 12))
    }

    private func changeButton(
        title: String,
        count: Int,
        percentage: Double,
        icon: String,
        color: Color,
        action: @escaping () -> Void
    ) -> some View {
        Button(action: action) {
            VStack(alignment: .leading, spacing: 8) {
                HStack(spacing: 6) {
                    Image(systemName: icon)
                        .font(.system(size: 14, weight: .semibold))

                    Text(title)
                        .font(.subheadline.weight(.semibold))

                    Spacer()

                    Text("\(count)")
                        .font(.subheadline.weight(.semibold).monospacedDigit())
                }
                .foregroundStyle(color)

                if percentage > 0 {
                    HStack(spacing: 4) {
                        Text(String(format: "%.0f%%", percentage))
                            .font(.caption.weight(.medium))
                        Spacer()
                    }
                    .foregroundStyle(.secondary)
                }
            }
            .padding(12)
            .background(color.opacity(0.12), in: RoundedRectangle(cornerRadius: 8))
            .contentShape(Rectangle())
        }
        .buttonStyle(.plain)
        .opacity(count > 0 ? 1 : 0.5)
        .disabled(count == 0)
    }

    @ViewBuilder
    private var progressBar: some View {
        if addedCount > 0 || disappearedCount > 0 {
            GeometryReader { geometry in
                HStack(spacing: 0) {
                    if addedCount > 0 {
                        Color.healthyGreen
                            .frame(width: geometry.size.width * addedPercentage / 100)
                    }
                    if disappearedCount > 0 {
                        Color.criticalRed
                            .frame(width: geometry.size.width * disappearedPercentage / 100)
                    }
                }
                .cornerRadius(4)
            }
            .frame(height: 6)
            .background(Color(.systemBackground), in: RoundedRectangle(cornerRadius: 4))
        }
    }
}

#Preview {
    VStack(spacing: 20) {
        RecordChangeIndicator(
            addedCount: 45,
            disappearedCount: 12,
            totalCount: 500,
            displayName: "Steps",
            onAddedTap: { print("Added tapped") },
            onDisappearedTap: { print("Disappeared tapped") }
        )

        RecordChangeIndicator(
            addedCount: 0,
            disappearedCount: 8,
            totalCount: 200,
            displayName: "Heart Rate",
            onAddedTap: { print("Added tapped") },
            onDisappearedTap: { print("Disappeared tapped") }
        )

        RecordChangeIndicator(
            addedCount: 150,
            disappearedCount: 0,
            totalCount: 1000,
            displayName: "Sleep",
            onAddedTap: { print("Added tapped") },
            onDisappearedTap: { print("Disappeared tapped") }
        )
    }
    .padding()
}
