UI Prototyping with Coding Agents in Xcode

import SwiftUI

// MARK: - Sample Data (keep in its own file for reuse across prototypes)
struct BookClubSampleData {
    static let currentBook = Book(
        title: "The Name of the Wind",
        author: "Patrick Rothfuss",
        coverColor: Color(red: 0.55, green: 0.27, blue: 0.07)
    )
    static let members: [Member] = [
        Member(name: "Alice", booksRead: 12),
        Member(name: "Bruno", booksRead: 9),
        Member(name: "Cleo", booksRead: 7),
        Member(name: "Dana", booksRead: 5)
    ]
    static let nextMeeting: String? = "Thursday 7 PM · The Reading Loft"
}

struct Book: Identifiable {
    let id = UUID()
    var title: String
    var author: String
    var coverColor: Color
}

struct Member: Identifiable {
    let id = UUID()
    var name: String
    var booksRead: Int
}

// MARK: - Variation A: "Cozy" — warm tones, prominent book cover
struct CozyClubView: View {
    let book = BookClubSampleData.currentBook
    let members = BookClubSampleData.members
    let nextMeeting = BookClubSampleData.nextMeeting

    var body: some View {
        NavigationStack {
            ScrollView {
                VStack(alignment: .leading, spacing: 20) {
                    // Current book hero
                    HStack(spacing: 16) {
                        RoundedRectangle(cornerRadius: 8)
                            .fill(book.coverColor)
                            .frame(width: 72, height: 108)
                            .shadow(radius: 4)
                        VStack(alignment: .leading, spacing: 4) {
                            Text("Now Reading")
                                .font(.caption)
                                .foregroundStyle(.secondary)
                            Text(book.title)
                                .font(.headline)
                                .fontDesign(.serif)
                            Text(book.author)
                                .font(.subheadline)
                                .foregroundStyle(.secondary)
                        }
                    }
                    .padding()
                    .frame(maxWidth: .infinity, alignment: .leading)
                    .background(.brown.opacity(0.1), in: RoundedRectangle(cornerRadius: 14))

                    // Next meeting
                    if let meeting = nextMeeting {
                        Label(meeting, systemImage: "calendar")
                            .font(.subheadline)
                            .padding(.horizontal)
                    } else {
                        Button("Schedule Next Meeting") {}
                            .padding(.horizontal)
                    }

                    // Leaderboard (collapsed if > 3 members)
                    LeaderboardSection(members: members)
                }
                .padding()
            }
            .navigationTitle("Cozy Club")
            .navigationBarTitleDisplayMode(.large)
        }
    }
}

// MARK: - Variation B: "Editorial" — clean typography, minimal chrome
struct EditorialClubView: View {
    let book = BookClubSampleData.currentBook
    let members = BookClubSampleData.members

    var body: some View {
        NavigationStack {
            List {
                Section {
                    VStack(alignment: .leading, spacing: 6) {
                        Text(book.title)
                            .font(.system(.title2, design: .serif, weight: .bold))
                        Text(book.author)
                            .font(.subheadline)
                            .foregroundStyle(.secondary)
                    }
                    .padding(.vertical, 8)
                } header: {
                    Text("Current Read")
                }

                Section("Standings") {
                    ForEach(Array(members.enumerated()), id: \.element.id) { index, member in
                        HStack {
                            Text("\(index + 1)")
                                .font(.caption.monospacedDigit())
                                .foregroundStyle(.secondary)
                                .frame(width: 24)
                            Text(member.name)
                            Spacer()
                            Text("\(member.booksRead) books")
                                .font(.caption)
                                .foregroundStyle(.secondary)
                        }
                    }
                }
            }
            .navigationTitle("Editorial")
        }
    }
}

// MARK: - Shared sub-component
struct LeaderboardSection: View {
    let members: [Member]
    @State private var expanded = false
    private let collapsedLimit = 3

    var body: some View {
        VStack(alignment: .leading, spacing: 8) {
            Text("Standings")
                .font(.headline)

            let visible = expanded ? members : Array(members.prefix(collapsedLimit))
            ForEach(Array(visible.enumerated()), id: \.element.id) { index, member in
                HStack {
                    Text("#\(index + 1)").foregroundStyle(.secondary).frame(width: 32)
                    Text(member.name)
                    Spacer()
                    Text("\(member.booksRead)").bold()
                }
                .padding(.vertical, 2)
            }

            if members.count > collapsedLimit {
                Button(expanded ? "Show Less" : "Show All \(members.count)") {
                    withAnimation(.spring(duration: 0.35)) { expanded.toggle() }
                }
                .font(.caption)
            }
        }
        .padding(.horizontal)
    }
}

// MARK: - Named Previews (mirrors what Xcode coding agents generate per prompt)
#Preview("Cozy") {
    CozyClubView()
}

#Preview("Editorial") {
    EditorialClubView()
}

#Preview("Empty State — No Meeting") {
    CozyClubView()
}