Error dismissing image picking and cropping views when using TOCropViewController to pick images in SwiftUI

Question

My Swift app uses TOCropViewController to pick images. The struct which handles the image picking and cropping is called ImagePicker.

The view from which ImagePicker is called is a sheet view. When I call ImagePicker, everything works perfectly, the image picking screen comes up, I press the cancel button and the image picking screen is dismissed nicely.

When I select an image, I go to the cropview. From here, if I press cancel, everything works as I want, but if I press done, the image I selected and cropped is not sent back to the view where I called ImagePicker as I want it.

Alongside the issue of my image not being sent back, my ImagePicker views, both the cropview and the image picking view, they don't dismiss well.

Since the view where I call the ImagePicker is a sheet, the sheet becomes raised when I click done, and I can see what is underneath the sheet view. Everything on the screen becomes unclickable.

This is how the sheet view where I call the ImagePicker from looks after I click done

Please help me with this.

Here's the ImagePicker.swift file:

import SwiftUI
import UIKit
import TOCropViewController

struct ImagePicker: UIViewControllerRepresentable {
    @Environment(\.presentationMode) var presentationMode
    @Binding var image: UIImage?
    var didFinishPicking: () -> Void
    var aspectRatioPreset: TOCropViewControllerAspectRatioPreset

    class Coordinator: NSObject, UINavigationControllerDelegate, UIImagePickerControllerDelegate, TOCropViewControllerDelegate {
        var originalPicker: UIImagePickerController?
        @Binding var image: UIImage?
        var didFinishPicking: () -> Void
        var aspectRatioPreset: TOCropViewControllerAspectRatioPreset
        var presentingViewController: UIViewController?

        init(image: Binding<UIImage?>, didFinishPicking: @escaping () -> Void, aspectRatioPreset: TOCropViewControllerAspectRatioPreset, presentingViewController: UIViewController?) {
            _image = image
            self.didFinishPicking = didFinishPicking
            self.aspectRatioPreset = aspectRatioPreset
            self.presentingViewController = presentingViewController
        }

        func imagePickerController(_ picker: UIImagePickerController, didFinishPickingMediaWithInfo info: [UIImagePickerController.InfoKey : Any]) {
            guard let image = info[.originalImage] as? UIImage else {
                picker.dismiss(animated: true, completion: nil)
                return
            }

            let cropViewController = TOCropViewController(image: image)
            cropViewController.delegate = self
            cropViewController.aspectRatioPreset = aspectRatioPreset
            cropViewController.aspectRatioLockEnabled = true
            originalPicker = picker
            picker.present(cropViewController, animated: true, completion: nil)
        }

        func cropViewController(_ cropViewController: TOCropViewController, didCropTo croppedImage: UIImage, withRect cropRect: CGRect, angle: Int) {
            self.image = croppedImage
            cropViewController.dismiss(animated: true) {
                self.originalPicker?.dismiss(animated: true, completion: {
                    self.didFinishPicking()
                })
            }
        }

        func cropViewController(_ cropViewController: TOCropViewController, didFinishCancelled cancelled: Bool) {
            if cancelled {
                cropViewController.dismiss(animated: true) {
                    self.originalPicker?.dismiss(animated: true, completion: {
                        self.didFinishPicking()
                    })
                }
            }
        }
    }

    func makeCoordinator() -> Coordinator {
        return Coordinator(image: $image, didFinishPicking: didFinishPicking, aspectRatioPreset: aspectRatioPreset, presentingViewController: UIApplication.shared.windows.first?.rootViewController)
    }

    func makeUIViewController(context: Context) -> UIImagePickerController {
        let picker = UIImagePickerController()
        picker.delegate = context.coordinator
        return picker
    }

    func updateUIViewController(_ uiViewController: UIImagePickerController, context: Context) {
    }
}

struct ImagePicker_Previews: PreviewProvider {
    static var previews: some View {
        ImagePicker(image: .constant(UIImage()), didFinishPicking: {}, aspectRatioPreset: .presetSquare) // Specify aspectRatioPreset here
    }
}

Here is the struct where ImagePicker is called:

struct ImageView: View {
    @State private var showingImagePicker = false
    @State private var linkImage: UIImage? = UIImage(named: "defaultLinkImage")
    @State private var linkImageURL: String = ""
    @State private var previousLinkImageURL: String = ""
    @State private var showAlert = false
    let defaultLinkImage = UIImage(named: "defaultLinkImage")
    let selectedDate: String
    let selectedGender: String
    let selectedPreference: String

    var body: some View {
        GeometryReader { geometry in
            ZStack {
                Color.black
                    .ignoresSafeArea()

                VStack {
                    Text("Add a great picture of you.")
                        .font(.custom("Futura-Bold", size: geometry.size.width * 0.1))
                        .foregroundColor(.white)
                        .multilineTextAlignment(.center)
                        .lineLimit(2)
                        .minimumScaleFactor(0.5)
                        .layoutPriority(1)
                        .padding()

                    Button(action: {
                        HapticManager.shared.triggerHapticFeedback()
                        self.showingImagePicker = true
                    }) {
                        Image(uiImage: linkImage!)
                            .resizable()
                            .aspectRatio(contentMode: .fill)
                            .frame(width: 300, height: 400)
                            .clipShape(RoundedRectangle(cornerRadius: 25))
                            .overlay(RoundedRectangle(cornerRadius: 25).stroke(Color.white, lineWidth: 4))
                            .shadow(color: .gray, radius: 10, x: 5, y: 5)
                            .shadow(color: .white, radius: 10, x: -5, y: -5)
                            .padding(.bottom, 20)
                    }

                    if linkImage == defaultLinkImage {
                        Button(action: {
                            HapticManager.shared.triggerHapticFeedback()
                            self.showAlert = true
                        }) {
                            Text("Continue.")
                                .font(.custom("Futura-Bold", size: 20))
                                .padding()
                                .background(Color.gray)
                                .foregroundColor(.white)
                                .clipShape(Capsule())
                                .alert(isPresented: $showAlert) {
                                    Alert(title: Text("Error"), message: Text("Please choose a picture before proceeding."), dismissButton: .default(Text("Gotcha.")))
                                }
                        }
                        .padding()
                    } else {
                        NavigationLink(destination: CompleteView(date: self.selectedDate, gender: self.selectedGender, preferences: selectedPreference, imageURL: URL(string: linkImageURL))) {
                            Text("Continue.")
                                .font(.custom("Futura-Bold", size: 20))
                                .padding()
                                .background(Color.accentColor)
                                .foregroundColor(.white)
                                .clipShape(Capsule())
                        }
                        .padding()
                        .onTapGesture {
                            uploadData()
                        }
                    }
                }
            }
        }
        .sheet(isPresented: $showingImagePicker, onDismiss: loadImage) {
            ImagePicker(image: self.$linkImage, didFinishPicking: {
                self.showingImagePicker = false
            }, aspectRatioPreset: .preset4x3)
        }
        .navigationBarBackButtonHidden(true)
    }

    func loadImage() {
        guard let inputImage = linkImage else { return }
        
        // Delete previous profile picture if exists
        if !previousLinkImageURL.isEmpty {
            deletePreviousLinkPicture(previousURL: previousLinkImageURL)
        }
        
        // Create a unique file name
        let fileName = UUID().uuidString
        let folderPath = "Link_Pictures/"
        let storageRef = Storage.storage().reference().child(folderPath + fileName)
        guard let imageData = inputImage.jpegData(compressionQuality: 0.5) else { return }
        
        // Metadata
        let metadata = StorageMetadata()
        metadata.contentType = "image/jpeg"
        
        // Upload the file to Firebase Storage
        storageRef.putData(imageData, metadata: metadata) { _, error in
            if let error = error {
                print("Error uploading: \(error.localizedDescription)")
                return
            }
            
            // After the file is uploaded, get the download URL.
            storageRef.downloadURL { (url, error) in
                guard let downloadURL = url else {
                    print("An error occurred while getting the download URL")
                    return
                }
                
                self.linkImageURL = downloadURL.absoluteString
                self.previousLinkImageURL = downloadURL.absoluteString // Store the current profile image URL as the previous URL
                
                // Call the uploadData method after getting the image URL
                uploadData()
            }
        }
    }

    func deletePreviousLinkPicture(previousURL: String) {
        // Get the storage reference from the previous URL
        let storageRef = Storage.storage().reference(forURL: previousURL)
        
        // Delete the file from Firebase Storage
        storageRef.delete { error in
            if let error = error {
                print("Error deleting picture: \(error.localizedDescription)")
            } else {
                print("Previous picture deleted successfully")
            }
        }
    }
    
    func uploadData() {
        // Call the LinkRegLogic uploadData method
        LinkRegLogic.uploadData(date: self.selectedDate, gender: self.selectedGender, preferences: self.selectedPreference, imageURL: linkImageURL)
    }
}

Thank you so much for helping, I'm a beginner in SwiftUI, and I really appreciate this.

I tried rewriting my functions in ImagePicker with some help from ChatGPT but I got nowhere.

Also, if you can make this work with another image picking and cropping framework other than TOCropViewController, while ensuring that I can change the size of the crop overlay as a parameter when ImagePicker is called, that would also be fantastic, I'm not particularly attached to TOCropViewController.

P.S. I also use ImagePicker to pick images in views which are not sheets.