How to display [Data] stored in SwiftData

Question

(I'm new to coding - so I appreciate any detail you can provide on your thought process and how I can troubleshoot/resolve issues like this in the future!)

I'm trying to allow a user to select multiple images via a PhotosPicker and then display those back to the user and persist them using SwiftData. Currently, my code allows the user to select their images and based on my testing code, I think it propagates the data back to my SwiftData class. I've added in an if conditional with a Text display to try to confirm that it persists. However, I can't figure out how to actually display the persisted images (stored as [Data]) back to the user. How can I convert my [Data] back to a displayable image? Or is there a better way altogether to do this when it comes to data integrity, coding quality, and performance?

SwiftData Class:

class Card { 
    @Attribute(.externalStorage) var imageData: [Data] = [Data]()

EditCardView where I'm trying to display [Data] from my model as images:

struct EditCardView: View {
    @Bindable var card: Card
    
    @State private var selectedItems = [PhotosPickerItem]()
    @State private var selectedImages = [Image]()
    @State private var selectedImagesData: [Data] = [Data]()
    
    var body: some View {
        VStack{
            PhotosPicker( "Select Images",
                          selection: $selectedItems,
                          matching: .images)
            
            ScrollView (.horizontal) {
                HStack {
                    if (card.imageData != []){
                        Text("TESTING - card.imageData is not an empty list")
                    } else{
                        ForEach(0..<selectedImages.count, id: \.self) { i in
                            selectedImages[i]
                                .resizable()
                                .scaledToFit()
                                .frame(width: 300, height: 300)
                        }
                    }
                }
            }
            .onAppear{
                selectedImagesData = card.imageData
            }
            .onChange(of: selectedItems) {
                Task {
                    selectedImages.removeAll()
                    
                    for item in selectedItems {
                        if let image = try? await item.loadTransferable(type: Image.self) {
                            selectedImages.append(image)
                        }
                    }
                    
                    for item in selectedItems {
                        if let image = try? await item.loadTransferable(type: Data.self) {
                            card.imageData.append(image)
                        }
                    }
                }
            }

I've tried a lot of different things, but since I'm new to coding I keep getting more and more confused. Any input, resources, or general guidance on how I should think about these problems is greatly appreciated!