import SwiftUI

struct MainView: View {
    @Environment(AppState.self) private var appState
    @Environment(\.horizontalSizeClass) private var sizeClass

    var body: some View {
        if let session = appState.session {
            if sizeClass == .regular {
                iPadMainView(session: session)
            } else {
                iPhoneMainView(session: session)
            }
        } else {
            ServerListView()
        }
    }
}

// MARK: - iPhone layout: TabView

private struct iPhoneMainView: View {
    let session: SessionState

    var body: some View {
        TabView {
            ChannelTreeView(session: session)
                .tabItem {
                    Label("Channels", systemImage: "list.bullet.indent")
                }
            ChatView(session: session)
                .tabItem {
                    Label("Chat", systemImage: "message")
                }
            ActivityLogView(session: session)
                .tabItem {
                    Label("Activity", systemImage: "bell")
                }
            SettingsView(session: session)
                .tabItem {
                    Label("Settings", systemImage: "gear")
                }
        }
        .overlay(alignment: .bottom) {
            VoiceControlsView(session: session)
                .padding(.bottom, 56) // above tab bar
        }
    }
}

// MARK: - iPad layout: NavigationSplitView

private struct iPadMainView: View {
    let session: SessionState
    @State private var columnVisibility = NavigationSplitViewVisibility.all

    var body: some View {
        NavigationSplitView(columnVisibility: $columnVisibility) {
            ChannelTreeView(session: session)
                .navigationTitle("Channels")
        } content: {
            UserListView(session: session)
                .navigationTitle("Users")
        } detail: {
            VStack(spacing: 0) {
                ChatView(session: session)
                VoiceControlsView(session: session)
            }
            .navigationTitle("Chat")
        }
    }
}