import SwiftUI
import KeyboardShortcuts

struct HistoryShortcutTipView: View {
    var body: some View {
        VStack(alignment: .leading, spacing: ProatSpacing.s) {
            HStack(spacing: ProatSpacing.s) {
                Image(systemName: "command.circle")
                    .font(.system(size: 20))
                    .foregroundColor(.proatTeal)
                    .frame(width: 24, height: 24)

                VStack(alignment: .leading, spacing: 2) {
                    Text("Snelle toegang")
                        .font(ProatFont.sectie)
                        .foregroundColor(.proatText1)
                    Text("Open de historie vanaf elke plek met een globale sneltoets")
                        .font(ProatFont.klein)
                        .foregroundColor(.proatText2)
                }
            }

            Rectangle().fill(Color.proatBorder).frame(height: 1)
                .padding(.vertical, 4)

            HStack(spacing: ProatSpacing.s) {
                Text("Historievenster openen")
                    .font(ProatFont.klein)
                    .fontWeight(.medium)
                    .foregroundColor(.proatText2)

                KeyboardShortcuts.Recorder(for: .openHistoryWindow)
                    .controlSize(.small)

                Spacer()
            }
        }
        .frame(maxWidth: .infinity, alignment: .leading)
        .proatCard(padding: ProatSpacing.m)
    }
}
