//
//  ShapePickerView.swift
//  Reflect (iOS)
//
//  Created by Trey Tartt on 4/2/22.
//

import SwiftUI

struct ShapePickerView: View {
    @AppStorage(UserDefaultsStore.Keys.theme.rawValue, store: GroupUserDefaults.groupDefaults) private var theme: Theme = .system
    @State var shapeRefreshToggleThing: Bool = false
    @AppStorage(UserDefaultsStore.Keys.moodTint.rawValue, store: GroupUserDefaults.groupDefaults) private var moodTint: MoodTints = .Default
    @AppStorage(UserDefaultsStore.Keys.shape.rawValue, store: GroupUserDefaults.groupDefaults) private var shape: BGShape = .circle

    private var textColor: Color { theme.currentTheme.labelColor }

    var body: some View {
        ZStack {
            theme.currentTheme.secondaryBGColor
            
           
            
            VStack(alignment:.leading) {
                VStack {
                    HStack {
                        Spacer()
                        Text(shapeRefreshToggleThing.description.localizedLowercase)
                            .hidden()
                        Image(systemName: "arrow.triangle.2.circlepath.circle")
                            .resizable()
                            .frame(width: 20, height: 20, alignment: .trailing)
                            .foregroundColor(Color(UIColor.systemGray))
                            .accessibilityIdentifier(AccessibilityID.Customize.shapeRefresh)
                            .onTapGesture {
                                shapeRefreshToggleThing.toggle()
                            }
                            .accessibilityAddTraits(.isButton)
                            .accessibilityLabel(String(localized: "Refresh shapes"))
                    }
                }
                
                HStack {
                    ForEach(BGShape.allCases, id: \.rawValue) { ashape in
                        ashape.view(withText: Text("20"),
                                    bgColor: moodTint.color(forMood: Mood.allValues.randomElement()!), textColor: textColor)
                        .frame(height: 50)
                        .frame(minWidth: 0, maxWidth: .infinity)
                        .accessibilityIdentifier(AccessibilityID.Customize.shapeOption(String(describing: ashape)))
                        .onTapGesture {
                            let impactMed = UIImpactFeedbackGenerator(style: .heavy)
                            impactMed.impactOccurred()
                            shape = ashape
                            AnalyticsManager.shared.track(.moodShapeChanged(shapeId: shape.rawValue))
                        }
                        .accessibilityAddTraits(.isButton)
                        .accessibilityLabel(String(localized: "Select \(String(describing: ashape)) shape"))
                        .contentShape(Rectangle())
                        .background(
                            RoundedRectangle(cornerRadius: 10, style: .continuous)
                                .fill(shape == ashape ? theme.currentTheme.bgColor : .clear)
                                .padding(-5)
                        )
                    }
                }
            }
            .padding()
        }
        .fixedSize(horizontal: false, vertical: true)
        .cornerRadius(Constants.viewsCornerRaidus, corners: [.topLeft, .topRight, .bottomLeft, .bottomRight])
    }
}

struct ShapePickerView_Previews: PreviewProvider {
    static var previews: some View {
        ShapePickerView()
    }
}