//
//  RecipeInstructionSection.swift
//  Nextcloud Cookbook iOS Client
//
//  Created by Vincent Meilinger on 01.03.24.
//

import Foundation
import SwiftUI

// MARK: - RecipeView Instructions Section

struct RecipeInstructionSection: View {
    @Bindable var recipe: Recipe
    @Binding var editMode: Bool
    @Binding var presentInstructionEditView: Bool
    
    
    var body: some View {

        VStack(alignment: .leading) {
            HStack {
                SecondaryLabel(text: LocalizedStringKey("Instructions"))
                Spacer()
            }
            ForEach(recipe.instructions.indices, id: \.self) { ix in
                RecipeInstructionListItem(instruction: $recipe.instructions[ix], index: ix+1)
            }
            if editMode {
                Button {
                    presentInstructionEditView.toggle()
                } label: {
                    Text("Edit")
                }
                .buttonStyle(.borderedProminent)
            }
        }
        .padding()
    }
}

// MARK: - Preview

fileprivate struct RecipeInstructionListItem: View {
    @Binding var instruction: String
    @State var index: Int
    @State var isSelected: Bool = false
    
    var body: some View {
        HStack(alignment: .top) {
            Text("\(index)")
                .monospaced()
            Text(instruction)
        }.padding(4)
        .foregroundStyle(isSelected ? Color.secondary : Color.primary)
        .onTapGesture {
            isSelected.toggle()
        }
        .animation(.easeInOut, value: isSelected)
    }
}

struct RecipeInstructionSection_Previews: PreviewProvider {
    static var previews: some View {
        // Create a mock recipe
        @State var mockRecipe = createRecipe()
        
        // Create mock state variables for the @Binding properties
        @State var mockEditMode = true
        @State var mockPresentInstructionEditView = false
        
        // Provide the mock data to the view
        RecipeInstructionSection(
            recipe: mockRecipe,
            editMode: $mockEditMode,
            presentInstructionEditView: $mockPresentInstructionEditView
        )
        .previewDisplayName("Instructions - Edit Mode")
        
        RecipeInstructionSection(
            recipe: mockRecipe,
            editMode: $mockEditMode,
            presentInstructionEditView: $mockPresentInstructionEditView
        )
        .previewDisplayName("Instructions - Read Only")
        .environment(\.editMode, .constant(.inactive))
    }
    
    static func createRecipe() -> Recipe {
        let recipe = Recipe()
        recipe.name = "Mock Recipe"
        recipe.instructions = [
            "Step 1: Gather all ingredients and equipment.",
            "Step 2: Preheat oven to 180°C (350°F) and prepare baking dish.",
            "Step 3: Combine dry ingredients in a large bowl and mix thoroughly.",
            "Step 4: In a separate bowl, whisk wet ingredients until smooth.",
            "Step 5: Gradually add wet ingredients to dry ingredients, mixing until just combined. Do not overmix.",
            "Step 6: Pour the mixture into the prepared baking dish and bake for 30-35 minutes, or until golden brown and a toothpick inserted into the center comes out clean.",
            "Step 7: Let cool before serving. Enjoy!"
        ]
        return recipe
    }
}