import SwiftUI

struct DiagnosticsView: View {
    @EnvironmentObject private var userService: UserService

    @State private var displayExtra: Bool = false
    
    var body: some View {
        List {
            
            Section {
                if displayExtra {
                    
                    let externalWebAssetsBinding = Binding<Bool> {
                        userService.ignoreExternalWebAssets
                    } set: { newValue in
                        userService.ignoreExternalWebAssets = newValue
                    }

                    Toggle(isOn: externalWebAssetsBinding) {
                        SettingsRow(title: "Ignore External Web Assets",
                                    subtitle: "Ignore Riotact hosted CSS and JS for blocks within articles.")
                    }
                    .padding(.vertical, 13)
                    
                    let ignoreAppCSSBinding = Binding<Bool> {
                        userService.ignoreAppCSS
                    } set: { newValue in
                        userService.ignoreAppCSS = newValue
                    }

                    Toggle(isOn: ignoreAppCSSBinding) {
                        SettingsRow(title: "Ignore App CSS",
                                    subtitle: "Rely purely on external web assets for styling")
                    }
                    .padding(.vertical, 13)
                }
                
                let onboardingBinding = Binding<Bool> {
                    userService.hasSeenOnboarding
                } set: { newValue in
                    userService.hasSeenOnboarding = newValue
                }

                Toggle(isOn: onboardingBinding) {
                    SettingsRow(title: "Have Seen Onboarding",
                                subtitle: "Toggle to re-run the onboarding sequence.")
                }
                .padding(.vertical, 13)
            } footer: {
                Text(Bundle.versionNumber)
                    .textStyle(.caption1)
                    .onTapGesture(count: 2) {
                        withAnimation {
                            displayExtra.toggle()
                        }
                    }
            }
            .listRowBackground(ColorName.background.color)
            
        }
        .listStyle(.plain)
        .background(ColorName.background.color(variation: .primary).ignoresSafeArea())
    }
}

#if DEBUG
struct DiagnosticsView_Previews: PreviewProvider {
    static var previews: some View {
        DiagnosticsView()
            .environmentObject(UserService.preview)
    }
}
#endif
