suggestion

[codedeman]

import Foundation

// MARK: - Root Response
struct ResponseModel: Codable {
    let msg: String
    let code: Int
    let data: DataModel
}

// MARK: - Data
struct DataModel: Codable {
    let prioryList: [User]
    let mostFollowedUsersList: [User]
    
    enum CodingKeys: String, CodingKey {
        case prioryList = "priory_list"
        case mostFollowedUsersList = "most_followed_users_list"
    }
}

// MARK: - User
struct User: Codable {
    let userID: String
    let userAvatar: String
    let userName: String
    let numberOfFollower: Int
    let mutualFollower: [MutualFollower]
    
    enum CodingKeys: String, CodingKey {
        case userID = "user_id"
        case userAvatar = "user_avatar"
        case userName = "user_name"
        case numberOfFollower = "number_of_follower"
        case mutualFollower = "mutual_follower"
    }
}

// MARK: - MutualFollower
struct MutualFollower: Codable {
    let id: Int
    let avatar: String
    let chatID: String
    let displayName: String
    let subSystem: [Int]
    let company: String
    let position: String
    let categoryCd: String
    let reporters: [String] // Adjust type if needed
    let warningDetails: [String] // Adjust type if needed
    let suspenderDetails: [String] // Adjust type if needed
    let isSuggested: Bool
    
    enum CodingKeys: String, CodingKey {
        case id, avatar
        case chatID = "chatId"
        case displayName, subSystem, company, position
        case categoryCd = "categoryCd"
        case reporters, warningDetails, suspenderDetails, isSuggested
    }
}

import SwiftUI

struct UserCardView: View {
    let user: User

    var body: some View {
        VStack(spacing: 10) {
            // Close button at the top right
            HStack {
                Spacer()
                Button(action: {
                    // Action for close button
                }) {
                    Image(systemName: "xmark")
                        .foregroundColor(.white)
                }
            }
            .padding(.top, 10)
            .padding(.trailing, 10)

            // Profile image
            Image(user.userAvatar)
                .resizable()
                .scaledToFill()
                .frame(width: 60, height: 60)
                .clipShape(Circle())

            // User name and verification check
            HStack(spacing: 5) {
                Text(user.userName)
                    .foregroundColor(.white)
                    .font(.headline)
                Image(systemName: user.isVerified ? "checkmark.seal.fill" : "xmark.circle")
                    .foregroundColor(user.isVerified ? .blue : .orange)
            }

            // Follow button
            Button(action: {
                // Action for follow button
            }) {
                Text("Follow")
                    .fontWeight(.bold)
                    .padding(.horizontal, 24)
                    .padding(.vertical, 8)
                    .background(Color.white)
                    .foregroundColor(.black)
                    .clipShape(Capsule())
            }

            // Mutual followers info
            Text("\(user.numberOfFollower) others follow")
                .foregroundColor(.gray)
                .font(.caption)
            
            Spacer()
        }
        .padding()
        .background(Color.blue)
        .cornerRadius(10)
        .frame(width: 140)
    }
}

struct ContentView: View {
    // Assuming you have a DataModel instance available
    let dataModel: DataModel

    var body: some View {
        ScrollView(.horizontal, showsIndicators: false) {
            HStack(spacing: 16) {
                ForEach(dataModel.prioryList, id: \.userID) { user in
                    UserCardView(user: user)
                }
            }
            .padding()
        }
        .background(Color.black) // Set the background color as needed
    }
}