//
//  SettingsView.swift
//  punchnet
//
//  Created by 安礼成 on 2026/1/16.
//

import SwiftUI

struct SettingsView: View {
    @State private var columnVisibility: NavigationSplitViewVisibility = .all
    @State private var state = SettingsState()
    @State private var hovering = false
    @State private var selectedMenu: MenuItem = .accout

    enum MenuItem: String, CaseIterable {
        case accout = "账号"
        case network = "网络"
        case device = "设备"
        case system = "软件"
        case about = "关于"
    }
    
    var body: some View {
        NavigationSplitView(columnVisibility: $columnVisibility) {
            List(MenuItem.allCases, id: \.self, selection: $selectedMenu) { menu in
                HStack(alignment: .center) {
//                    Rectangle()
//                        .frame(width: 3, height: 25)
//                        .foregroundColor(self.selectedMenu == menu ? .black : .clear)
                    
                    Text(menu.rawValue)
                    
                    Spacer()
                }
//                .contentShape(Rectangle())
//                .onTapGesture {
//                    self.selectedMenu = menu
//                }
//                .onHover { inside in
//                    hovering = inside
//                    if inside {
//                        NSCursor.pointingHand.push()
//                    } else {
//                        NSCursor.pop()
//                    }
//                }
            }
            .listStyle(.sidebar)
            .frame(minWidth: 180, idealWidth: 200, maxWidth: 250)
            
        } detail: {
            VStack(alignment: .leading, spacing: 0) {
                Group {
                    switch self.selectedMenu {
                    case .accout:
                        SettingsAccountView(state: self.state)
                    case .network:
                        SettingsNetworkView(state: self.state)
                    case .device:
                        SettingsDeviceView()
                    case .system:
                        SettingsSystemView()
                    case .about:
                        SettingsAboutView()
                    }
                }
                Spacer()
            }
            .padding()
            .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .topLeading)
        }
    }
    
}

#Preview {
    SettingsView()
}