import SwiftUI

struct ContinueWatchingCard: View {
    let entry: WatchHistoryEntry
    let isFocused: Bool

    var body: some View {
        VStack(alignment: .leading, spacing: 10) {
            ZStack(alignment: .bottom) {
                if let iconURLString = entry.iconURL, let iconURL = URL(string: iconURLString) {
                    AsyncImage(url: iconURL) { phase in
                        switch phase {
                        case .empty:
                            placeholderView
                        case .success(let image):
                            image
                                .resizable()
                                .aspectRatio(contentMode: .fill)
                        case .failure:
                            placeholderView
                        @unknown default:
                            placeholderView
                        }
                    }
                } else {
                    placeholderView
                }

                // Progress bar overlay
                VStack(spacing: 0) {
                    Spacer()
                    GeometryReader { geometry in
                        ZStack(alignment: .leading) {
                            Rectangle()
                                .fill(Color.black.opacity(0.6))
                                .frame(height: 6)

                            Rectangle()
                                .fill(Color.red)
                                .frame(width: geometry.size.width * entry.progressPercent, height: 6)
                        }
                    }
                    .frame(height: 6)
                }
            }
            .frame(width: 300, height: 169)
            .clipShape(RoundedRectangle(cornerRadius: Constants.UI.vodCardCornerRadius))
            .overlay(
                RoundedRectangle(cornerRadius: Constants.UI.vodCardCornerRadius)
                    .stroke(isFocused ? Color.white : Color.clear, lineWidth: Constants.UI.focusBorderWidth)
            )

            Text(entry.name)
                .font(.callout)
                .fontWeight(.medium)
                .foregroundColor(.white)
                .lineLimit(2)
                .frame(width: 300, alignment: .leading)
                .multilineTextAlignment(.leading)

            Text("\(entry.formattedProgress) / \(entry.formattedDuration)")
                .font(.caption)
                .foregroundColor(.gray)
        }
        .scaleEffect(isFocused ? Constants.UI.focusScale : 1.0)
        .shadow(color: isFocused ? Color.white.opacity(0.3) : Color.black.opacity(0.5), radius: isFocused ? Constants.UI.focusShadowRadius : 5)
        .animation(.easeInOut(duration: Constants.UI.standardAnimationDuration), value: isFocused)
        .padding(15)
    }

    private var placeholderView: some View {
        ZStack {
            Color.gray.opacity(0.3)
            Image(systemName: entry.isMovie ? "film" : "tv")
                .font(.system(size: 50))
                .foregroundColor(.white.opacity(0.5))
        }
    }
}
