Bumble kloni (2-qism): Foydalanuvchi kartasi va qiziqishlar

import SwiftUI
import SwiftfulUI

struct BumbleCardView: View {
    var user: User = User.mock
    @State private var cardFrame: CGRect = .zero // Kartaning dinamik o'lchami

    var body: some View {
        ScrollView(.vertical, showsIndicators: false) {
            LazyVStack(spacing: 0) {
                headerCell // Asosiy katta rasm

                aboutMeSection
                myInterestsSection

                // Boshqa rasmlari:
                ForEach(user.images, id: \.self) { image in
                    ImageLoaderView(urlString: image)
                        .frame(height: cardFrame.height) // Har bir rasm ekran bilan bir xil bo'ladi
                }
            }
        }
        .scrollIndicators(.hidden)
        .background(Color.bumbleBackgroundYellow)
        .cornerRadius(32) // Chetlari aylana karta shaklida
        .readingFrame { frame in
            // ScrollView hajmini ushlab olamiz
            self.cardFrame = frame
        }
    }

    // Asosiy katta rasm va uning ustidagi yozuvlar
    private var headerCell: some View {
        ZStack(alignment: .bottomLeading) {
            ImageLoaderView(urlString: user.image)

            VStack(alignment: .leading, spacing: 8) {
                Text("\(user.firstName), \(user.age)")
                    .font(.largeTitle)
                    .fontWeight(.semibold)

                // Kasbi va o'qish joyi...
            }
            .padding(24)
            .foregroundColor(.bumbleWhite)
            .frame(maxWidth: .infinity, alignment: .leading)
            .background(
                // Oq yozuv aniq ko'rinishi uchun orqa fon gradienti
                LinearGradient(
                    colors: [.clear, .bumbleBlack.opacity(0.6), .bumbleBlack.opacity(0.6)],
                    startPoint: .top,
                    endPoint: .bottom
                )
            )
        }
        .frame(height: cardFrame.height) // Asosiy rasm ham butun ekranni egallaydi
    }
}

import SwiftUI

struct InterestPillView: View {
    var iconName: String? = "heart.fill"
    var emoji: String? = "🏃"
    var text: String = "Running"

    var body: some View {
        HStack(spacing: 4) {
            if let iconName {
                Image(systemName: iconName)
            } else if let emoji {
                Text(emoji)
            }

            Text(text)
        }
        .font(.callout)
        .fontWeight(.medium)
        .padding(.vertical, 6)
        .padding(.horizontal, 12)
        .foregroundColor(.bumbleBlack)
        .background(Color.bumbleLightYellow)
        .cornerRadius(32)
    }
}