import APIClient
import ComponentLibrary
import ComposableArchitecture
import Localization
import SwiftUI

public struct WorkspaceCell: View {
    let workspace: Workspace
    let onTap: () -> Void
    /// Callback fires after successful confirmation dialogue
    let onTrash: () -> Void
    
    @State private var showDeleteConfirmation: Bool = false
}

// MARK: - UI
extension WorkspaceCell {
    public var body: some View {
        Button(action: onTap, label: label)
            .buttonStyle(.plain)
            .alert(
                L10n.FeatureCreateClip.workspaceDeleteConfirmation,
                isPresented: $showDeleteConfirmation
            ) {
                Button(L10n.FeatureCreateClip.workspaceDelete, role: .destructive, action: onTrash)
                Button(L10n.FeatureCreateClip.cancel, role: .cancel) {}
            }
    }
    
    private func label() -> some View {
        HStack(spacing: 12) {
            Image(uiImage: defaultImage(for: workspace.id))
                .resizable()
                .aspectRatio(contentMode: .fill)
                .frame(width: 60, height: 50)
                .clipShape(.rect(cornerRadius: 8))
            
            VStack(alignment: .leading, spacing: 4) {
                Text(workspace.name)
                    .typographyV1(.workspaceTitle)
                    .foregroundColor(ChatConstants.Colors.Foreground.primary)
                    .frame(maxWidth: .infinity, alignment: .leading)
                
                HStack(spacing: 4) {
                    Text("\(workspace.clipCount) songs")
                        .typographyV1(.workspaceSubtitle)
                        .foregroundColor(ChatConstants.Colors.Foreground.secondary)
                    
                    if let tsString = workspace.lastUpdatedClip?.timeAgoDisplay(includeSuffix: false) {
                        Group {
                            Text("·")
                            Text(tsString)
                        }
                        .typographyV1(.workspaceSubtitle)
                        .foregroundColor(ChatConstants.Colors.Foreground.secondary)
                    }
                    
                    Spacer()
                }
            }
            
            Menu {
                Button(L10n.FeatureCreateClip.workspaceShare, systemImage: "arrowshape.turn.up.right.fill") {
                    // TODO: Implement share
                }
                Button(L10n.FeatureCreateClip.workspaceMoveToTrash, systemImage: "trash.fill", role: .destructive) {
                    showDeleteConfirmation = true
                }
            } label: {
                Image.Icon.moreHorizontal
                    .frame(width: 16, height: 4)
                    .foregroundColor(ChatConstants.Colors.Foreground.inactive)
                    .opacity(0.9)
                    .frame(width: 20, height: 20)
                    .padding(10)
                    .contentShape(.circle)
            }
            .buttonStyle(.plain)
            .padding(-10)
        }
        .contentShape(.rect)
    }
}

#Preview {
    GeometryReader { proxy in
        WorkspacesView(
            store: Store(initialState: OrpheusWorkspacesReducer.State()) {
                OrpheusWorkspacesReducer()
            } withDependencies: {
                $0.workspacesClient = .previewValue
            },
            size: proxy.size
        )
        .preferredColorScheme(.dark)
    }
}