Why aren't images appearing inside of SwiftUI's Picker?

Question

I'm trying to create a picker to select a ShoppingCategory from a menu. However, when displaying the menu, none of the images show up besides the selected image. The user can still click on the empty cells, but no images are displayed.

Here's the view code:

    @State private var category: ShoppingCategory? = nil
    var body: some View {
                Picker("Category", selection: $category) {
                    Image(systemName: "slash.circle")
                        .tag(ShoppingCategory?(nil))
                    ForEach(ShoppingCategory.allCases, id: \.self) { category in
                        category.systemImage
                            .resizable()
                            .frame(width: 32)
                            .tag(ShoppingCategory?(category))
                    }
                }
                .pickerStyle(.menu)
    }

And here's the ShoppingCategory enum:

enum ShoppingCategory: Int, CaseIterable, Codable {
    case groceries
    case pet
    case restauraunt
    case furniture
    case clothes
    case makeup
    case household
    case toys
    case tech
    case games
    
    var systemImageName: String {
        switch self {
        case .groceries: "carrot"
        case .pet: "pawprint"
        case .restauraunt: "fork.knife"
        case .furniture: "chair.lounge"
        case .clothes: "hanger"
        case .makeup: "sparkles"
        case .household: "house"
        case .toys: "teddybear"
        case .tech: "desktopcomputer"
        case .games: "gamecontroller"
        }
    }

    var systemImage: Image {
        Image(systemName: systemImageName)
    }
}

Here's what it displays when clicking on the menu:

I tried putting the options in a regular Menu view, but the same thing happened:

                Menu {
                    Button {
                        self.category = nil
                    } label: {
                        Image(systemName: "slash.circle")
                            .resizable()
                            .frame(width: 32)
                    }
                    ForEach(ShoppingCategory.allCases, id: \.self) { category in
                        Button {
                            self.category = category
                        } label: {
                            category.systemImage
                                .resizable()
                                .frame(width: 32)
                        }
                    }
                } label: {
                    if let category {
                        category.systemImage
                    } else {
                        Image(systemName: "slash.circle")
                    }
                }

Here's the result: