How can I get Picker to return a VideoFormat var using a ForEach loop?

Question

I am trying to use a Picker to select a VideoFormat from Twilio's Video API via a ForEach loop. The loop is working– it lists all of the correctly formatted format strings.

Here's my view, SettingsView:

import SwiftUI

struct SettingsView: View {
    
    @EnvironmentObject var twilioState: TwilioState
        
    var body: some View {
        Form {
            Section(header: Text("Stream")) {
                HStack {
                    Text("Device")
                    Spacer()
                    Text("\(twilioState.captureDevice?.localizedName ?? "N/A")")
                }

This is where I run into trouble. I cannot seem to get the Picker to assign a value to my selection, $twilioState.videoFormat. I suspect it has something to do with id and VideoFormat not conforming to Hashable? I was considering changing the selection to an Int and using a range for ForEach, like 0..<twilioState.videoFormats.count.

                Picker("Select a Format", selection: $twilioState.videoFormat) {
                    if let videoFormats = twilioState.videoFormats {
                        ForEach(videoFormats, id: \.self) {
                            Text("\(twilioState.getVideoFormatString(videoFormat: $0))")
                                .tag($0)
                        }
                    }
                }
                .disabled(twilioState.videoFormats == nil)

The rest is a listing of twilioState.videoFormat as I try to figure out how to successfully implement the Picker.

                HStack {
                    Text("Format")
                    Spacer()
                    if let videoFormat = twilioState.videoFormat {
                        Text("\(twilioState.getVideoFormatString(videoFormat: videoFormat))")
                    } else {
                        Text("N/A")
                    }
                }
            }
        }
        .navigationBarTitle("Settings")
    }
}

And here's my state model, TwilioState:

import Foundation
import TwilioVideo
import Combine


class TwilioState: ObservableObject {

    let twilioService = TwilioService()
    private var cancellables = Set<AnyCancellable>()
    var camera: CameraSource?
    
    @Published var videoFormat: VideoFormat?
    @Published var videoFormats: [VideoFormat]?
    @Published var captureDevice: AVCaptureDevice?
    @Published var twilioError: TwilioError?
        
    init() {
        
        twilioService.setCaptureDevice(captureDevice: self.captureDevice)
            .sink { completion in
                switch completion {
                case let .failure(twilioError):
                    return self.twilioError = twilioError
                case .finished:
                    return print("Capture device set")
                }
            } receiveValue: { captureDevice in
                self.captureDevice = captureDevice
            }
            .store(in: &cancellables)

        twilioService.getVideoFormats(captureDevice: self.captureDevice!)
            .sink { completion in
                switch completion {
                case let .failure(twilioError):
                    return self.twilioError = twilioError
                case .finished: return print("Capture device formats set")
                }
            } receiveValue: { videoFormats in
                self.videoFormats = videoFormats
            }
            .store(in: &cancellables)
    }
    
    func getVideoFormatString(videoFormat: VideoFormat) -> String {
        return "\(videoFormat.dimensions.width) x \(videoFormat.dimensions.height) @ \(videoFormat.frameRate)"
    }
    
    deinit {
        // We are done with camera
        if let camera = self.camera {
            camera.stopCapture()
            self.camera = nil
        }
    }
}

In case it's helpful, this is the service function, getVideoFormats(), which is feeding values to @Published videoFormats in my model, TwilioState:

    func getVideoFormats(captureDevice: AVCaptureDevice) -> AnyPublisher<[VideoFormat], TwilioError> {
        return Just(captureDevice)
            .map { captureDevice -> [VideoFormat] in
                return CameraSource.supportedFormats(captureDevice: captureDevice)
                    .compactMap { $0 as? VideoFormat }
            }
            .setFailureType(to: TwilioError.self)
            .eraseToAnyPublisher()
    }

Answer 1

I solved this by casting the selection type into an optional using the tag modifier:

                Picker("Select a Format", selection: $twilioState.videoFormat) {
                    if let videoFormats = twilioState.videoFormats {
                        ForEach(videoFormats, id: \.self) { videoFormat in
                            Text("\(twilioState.getVideoFormatString(videoFormat: videoFormat))")
                                .tag(videoFormat as VideoFormat?)
                        }
                    }
                }

See this post for more: Picker for optional data type in SwiftUI?