How to fetch Contact Profile Picture in the relationships in SwiftUI?

Question

I have successfully fetched all contacts and now I want to add a new feature that goes beyond the capabilities of the Apple Contacts app. However, I have also successfully fetched the CNContactRelationsKey.

Here is the SwiftUI code:

ContactInfoTableView: View {
let contact: CNContact


var relationships: [CNLabeledValue<CNContactRelation>] {
    contact.contactRelations
}


var body: some View {
    VStack(alignment: .leading) {
        List {
            
            
            if !relationships.isEmpty {
                Section(header: Text("Relationships")) {
                    ForEach(relationships, id: \.self) { relation in
                        HStack {
                            if let label = relation.label {
                                let localizedLabel = CNLabeledValue<NSString>.localizedString(forLabel: label)
                                Text(localizedLabel)
                            }
                            
                            Image(systemName: "person.crop.circle")
                                .resizable()
                                .frame(width: 24, height: 24)
                                .padding(.leading)
                                .foregroundColor(.gray)
                            
                            Text(relation.value.name)
                        }
                    }
                }
            }
           
        }
    }
}

}

In the above code, it currently shows the Person SF Symbol Image for each contact. I need to fetch the profile picture from the relationships group, likely you can use the CNContactThumbnailImageDataKey to allow you can fetch the image data from the contact app, but how to display profile picture in the relationships group with the Image fetched data.

Screenshot