import SwiftUI

struct ChatsCreateScreenMain: View {
    @Environment(\.router) var router

    var body: some View {
        ZStack {
            // Background color
            Color.Material.Background.light
                .ignoresSafeArea()

            // Content
            VStack(spacing: 0) {
                // Header
                SharedNavigationBar(
                    leftButton: .init(
                        image: Image(systemName: "xmark"),
                        action: {
                            router.dismissScreen()
                        }
                    ),
                    centerText: .init(text: L10n.Chats.Create.Main.title)
                )

                // List
                List {
                    Text("test")
                    // ChatsCreateRowButton(
                    //     title: L10n.Chats.Create.Main.createGroup,
                    //     image: "person.2.fill",
                    //     action: {}
                    // )
                    // ChatsCreateRowButton(
                    //     title: L10n.Chats.Create.Main.createPrivateGroup,
                    //     image: "person.2.fill",
                    //     action: {}
                    // )
                    // ChatsCreateRowButton(
                    //     title: L10n.Chats.Create.Main.findGroup,
                    //     image: "magnifyingglass",
                    //     action: {}
                    // )

                    // for contacts list
                    // let rosters = store.state.rostersState.rosters.filter { !$0.locallyDeleted }
                    // if rosters.isEmpty {
                    //     ChatsCreateRowSeparator()
                    // }
                }
                .listStyle(.plain)

                Spacer()
            }
        }
    }
}

// private struct ChatsCreateRowButton: View {
//     var title: String
//     var image: String
//     var action: () -> Void
//
//     var body: some View {
//         VStack(alignment: .center, spacing: 0) {
//             Spacer()
//             HStack(alignment: .center, spacing: 16) {
//                 Image(systemName: image)
//                     .font(.head2)
//                     .foregroundColor(.Material.Elements.active)
//                     .padding(.leading, 16)
//                 Text(title)
//                     .font(.body1)
//                     .foregroundColor(.Material.Text.main)
//                 Spacer()
//             }
//             Spacer()
//             Rectangle()
//                 .frame(maxWidth: .infinity)
//                 .frame(height: 1)
//                 .foregroundColor(.Material.Background.dark)
//         }
//         .sharedListRow()
//         .frame(height: 48)
//         .onTapGesture {
//             action()
//         }
//     }
// }

private struct ChatsCreateRowSeparator: View {
    var body: some View {
        Text("aa")
    }
}

// import SwiftUI
//
// struct CreateConversationMainScreen: View {
//     @EnvironmentObject var store: AppStore
//
//     var body: some View {
//         ZStack {
//             // Background color
//             Color.Material.Background.light
//                 .ignoresSafeArea()
//
//             // Content
//             VStack(spacing: 0) {
//                 // Header
//                 CreateConversationHeader()
//
//                 // Chats list
//                 // if !store.state.chatsState.chats.isEmpty {
//                 //     List {
//                 //         ForEach(store.state.chatsState.chats) { chat in
//                 //             ChatsRow(chat: chat)
//                 //         }
//                 //     }
//                 //     .listStyle(.plain)
//                 //     .background(Color.Material.Background.light)
//                 // } else {
//                 //     Spacer()
//                 // }
//                 //
//                 // // Tab bar
//                 // SharedTabBar()
//             }
//         }
//     }
// }
//
// private struct CreateConversationHeader: View {
//     @EnvironmentObject var store: AppStore
//
//     var body: some View {
//         ZStack {
//             // bg
//             Color.Material.Background.dark
//                 .ignoresSafeArea()
//
//             HStack(spacing: 0) {
//                 Image(systemName: "arrow.left")
//                     .foregroundColor(.Material.Elements.active)
//                     .padding(.leading, 16)
//                     .tappablePadding(.symmetric(12)) {
//                         store.dispatch(.changeFlow(store.state.previousFlow))
//                     }
//                 Spacer()
//             }
//
//             // title
//             Text("New conversation")
//                 .font(.head2)
//                 .foregroundColor(Color.Material.Text.main)
//         }
//     }
// }
//

// Preview
// #if DEBUG
//     struct ChatsCreateMainScreen_Previews: PreviewProvider {
//         static var previews: some View {
//             ChatsCreateMainScreen(isPresented: .constant(true))
//                 .environmentObject(pStore)
//         }
//
//         static var pStore: AppStore {
//             let state = pState
//             return AppStore(initialState: state, reducer: AppState.reducer, middlewares: [])
//         }
//
//         static var pState: AppState {
//             var state = AppState()
//
//             state.rostersState.rosters = [
//                 .init(contactBareJid: "test@me.com", subscription: "both", ask: true, data: .init(groups: [], annotations: []))
//             ]
//
//             return state
//         }
//     }
// #endif