import SwiftUI

struct SettingsView: View {
    
    @State private var toggle: Bool = true

    var body: some View {
        NavigationView {
            Form {
                List {
                    Section(header: Text("General")) {
                        HStack {
                            ZStack {
                                RoundedRectangle(cornerRadius: 6)
                                    .frame(width: 40, height: 40)
                                    .foregroundColor(.indigo4)
                                Image(systemName: "moon.fill")
                                    .frame(width: 30, height: 30)
                                    .foregroundColor(.indigo10)
                            }
                                
                            Text("Dark Mode")
                            Toggle(isOn: $toggle, label: {
                                    Text("")
                            })
                        }
                        
                        HStack {
                            ZStack {
                                RoundedRectangle(cornerRadius: 5)
                                    .frame(width: 40, height: 40)
                                    .foregroundColor(.orange4)
                                Image(systemName: "app.dashed")
                                    .frame(width: 30, height: 30)
                                    .foregroundColor(.orange10)
                            }
                            
                            LabeledContent("App Version", value: "16.2")
                            
                        }
                        
                        HStack {
                            ZStack {
                                RoundedRectangle(cornerRadius: 5)
                                    .frame(width: 40, height: 40)
                                    .foregroundColor(.purple4)
                                Image(systemName: "bell.badge.fill")
                                    .frame(width: 30, height: 30)
                                    .foregroundColor(.purple10)
                            }
                            Text("Notifications")
                            NavigationLink(destination: ContentView()) {}
                            
                        }
                        
                        HStack {
                            ZStack {
                                RoundedRectangle(cornerRadius: 5)
                                    .frame(width: 40, height: 40)
                                    .foregroundColor(.grass4)
                                Image(systemName: "globe")
                                    .frame(width: 30, height: 30)
                                    .foregroundColor(.grass10)
                            }
                            
                            Picker(selection: .constant(1), label: Text("Language")) {
                                Text("English").tag(1)
                                Text("Spanish").tag(2)
                                Text("French").tag(3)
                            }
                        }
                        
                        
                    }
                    .listRowSeparator(.hidden)
                    .listRowBackground(Color.gray2)

                    
                    
                    Section(header: Text("Data")) {
                        HStack {
                            ZStack {
                                RoundedRectangle(cornerRadius: 5)
                                    .frame(width: 40, height: 40)
                                    .foregroundColor(.amber4)
                                Image(systemName: "icloud.fill")
                                    .frame(width: 30, height: 30)
                                    .foregroundColor(.amber10)
                            }
                            Text("iCloud Sync")
                            Toggle(isOn: $toggle, label: {
                                    Text("")
                            })
                        }
                        
                        HStack {
                            ZStack {
                                RoundedRectangle(cornerRadius: 5)
                                    .frame(width: 40, height: 40)
                                    .foregroundColor(.teal4)
                                Image(systemName: "icloud.fill")
                                    .frame(width: 30, height: 30)
                                    .foregroundColor(.teal10)
                            }
                            Text("Export Data")
                            NavigationLink(destination: ContentView()) {}
                        }
                    }
                    .listRowSeparator(.hidden)
                    .listRowBackground(Color.gray2)
                }

                

            }
            .navigationTitle("Settings")
            .scrollContentBackground(.hidden)

            
            
        }
        
        
    }
}

struct SettingsView_Previews: PreviewProvider {
    static var previews: some View {
        SettingsView()
    }
}