import SwiftUI

struct SimpleGalleryScreen: View {
    @State private var selectedImage: IdentifiableImage? = nil
    
    let columns = [
        GridItem(.flexible()),
        GridItem(.flexible()),
        GridItem(.flexible())
    ]
    
    let images = [
        "h1", "h2", "h3",
        "t1", "t2", "t3",
        "tesla", "dt"
    ]
    
    var body: some View {
        NavigationView {
            VStack {
                Divider()
                    .padding(.bottom, 6)
                
                Group {
                    Text("You've given access to a select number of photos and videos.")
                        .font(.subheadline)
                        .foregroundColor(.gray)
                    + Text(" Manage selected photos.")
                        .font(.subheadline)
                        .foregroundColor(.blue)
                        .bold()
                }
                .frame(maxWidth: .infinity, alignment: .leading)
                .padding(.horizontal)

                ScrollView {
                    LazyVGrid(columns: columns, spacing: 10) {
                        ForEach(images, id: \.self) { imageName in
                            Image(imageName)
                                .resizable()
                                .aspectRatio(contentMode: .fill)
                                .frame(width: UIScreen.main.bounds.width / 3 - 10, height: UIScreen.main.bounds.width / 3 - 10)
                                .clipped()
                                .onTapGesture {
                                    selectedImage = IdentifiableImage(id: UUID(), name: imageName)
                                }
                        }
                    }
                    .padding()
                }
            }
            .navigationTitle("Gallery")
            .navigationBarTitleDisplayMode(.inline)
            .toolbar {
                ToolbarItem(placement: .navigationBarLeading) {
                    Button(action: {
                        // Action to go back
                    }) {
                        Image(systemName: "chevron.left")
                            .foregroundColor(.black)
                    }
                }
            }
            .sheet(item: $selectedImage) { image in
                ImageViewer(imageName: image.name)
            }
        }
    }
}

struct IdentifiableImage: Identifiable {
    var id: UUID
    var name: String
}

struct ImageViewer: View {
    let imageName: String
    
    var body: some View {
        NavigationView {
            VStack {
                Spacer()
                Image(imageName)
                    .resizable()
                    .scaledToFit()
                Spacer()
            }
            .navigationTitle("Image Viewer")
            .navigationBarTitleDisplayMode(.inline)
            .toolbar {
                ToolbarItem(placement: .navigationBarLeading) {
                    Button(action: {
                        // Action to dismiss
                    }) {
                        Image(systemName: "chevron.left")
                            .foregroundColor(.black)
                    }
                }
            }
        }
    }
}

#Preview {
    SimpleGalleryScreen()
}