import AppKit
import SstData
import SstUI
import SwiftUI

struct NoteView: View {
    @EnvironmentObject private var model: AppModel
    @ObservedObject var note: NoteStore
    @State private var confirmingClear = false

    var body: some View {
        VStack(spacing: Layout.panelGap) {
            header
            ZStack {
                PaperBackground()
                if SnapshotMode.isActive {
                    // ImageRenderer cannot draw an NSView; the snapshot shows the text instead.
                    Text(note.text)
                        .textStyle(Typography.reading)
                        .foregroundStyle(Palette.inkPrimary)
                        .padding(Space.s5)
                        .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .topLeading)
                } else {
                    NoteEditor(text: $note.text, isEditable: !note.isReadOnly)
                }
            }
            footer
        }
        .confirmationDialog(Strings.clearNoteConfirm, isPresented: $confirmingClear) {
            Button(Strings.clear, role: .destructive) { note.text = "" }
        }
    }

    private var header: some View {
        HStack(spacing: Space.s4) {
            SilkLabel(Strings.note)
            Spacer()
            Text(Strings.characters(note.text.count))
                .textStyle(Typography.counterSmall)
                .foregroundStyle(Palette.inkSecondary)
            Button(Strings.copy) {
                NSPasteboard.general.clearContents()
                NSPasteboard.general.setString(note.text, forType: .string)
            }
            .buttonStyle(KeyButtonStyle())
            .disabled(note.text.isEmpty)
            Button(Strings.clear) { confirmingClear = true }
                .buttonStyle(KeyButtonStyle())
                .disabled(note.text.isEmpty)
        }
    }

    private var footer: some View {
        Text(note.isReadOnly ? Strings.noteUnreadable : Strings.noteHint(model.hotkeyBinding.displayName))
            .textStyle(Typography.label)
            .foregroundStyle(Palette.inkTertiary)
            .frame(maxWidth: .infinity, alignment: .leading)
    }
}