How to show array values in different forms?

Question

I need to implement such form

I get json data from server:

"category_attributes": [
    [
        {
            "name": "IPhone",
            "terms": [
                {
                    "name": "iPhone 11"
                },
                {
                    "name": "iPhone 12"
                }
            ],
        },
        {
            "name": "Memory",
            "terms": [
                {
                    "name": "1024"
                },
                {
                    "name": "128"
                }
            ]
        }
    ]
]

struct EachCategory: Decodable, Hashable {
    let name: String
    let category_attributes: [[CategoriesAttributes]]
}

struct CategoriesAttributes: Decodable, Hashable {
    let name: String
    let terms: [CateroriesTerms]
}

struct CateroriesTerms: Decodable, Hashable {
    let name: String
}

I need to show first object's values of terms array inside buttons, and memory in dropdown list. I can only show all array values in buttons https://imgur.com/a/ZPydwmE How can I show only first object in buttons, and other objects in different form?

VStack(alignment: .leading) {
                ForEach(viewModel.categoryAttributes, id: \.self) { category in
                    ForEach(category, id: \.self) { attribute in
                    Text(attribute.name)
                    HStack {
                    ForEach(attribute.terms, id: \.self) { term in
                    Button {
                        print("Phone model is selected")
                    } label: {
                        Text("\(term.name)")
                            .padding()
                            .foregroundColor(Color.textFieldGrayColor)
                    }.background(Color.grayButton)
                            .cornerRadius(10)
                            .frame(height: 50)
                    }
                    }
                }
                }
            }