package chat.simplex.app.views

import androidx.compose.foundation.*
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.text.BasicTextField
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.material.*
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.outlined.ArrowBackIosNew
import androidx.compose.material.icons.outlined.ArrowForwardIos
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusRequester
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.SolidColor
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.input.KeyboardCapitalization
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import chat.simplex.app.R
import chat.simplex.app.SimplexService
import chat.simplex.app.model.ChatModel
import chat.simplex.app.model.Profile
import chat.simplex.app.ui.theme.*
import chat.simplex.app.views.helpers.AppBarTitle
import chat.simplex.app.views.helpers.withApi
import chat.simplex.app.views.onboarding.OnboardingStage
import chat.simplex.app.views.onboarding.ReadableText
import com.google.accompanist.insets.navigationBarsWithImePadding
import kotlinx.coroutines.delay

fun isValidDisplayName(name: String) : Boolean {
  return (name.firstOrNull { it.isWhitespace() }) == null
}

@Composable
fun CreateProfilePanel(chatModel: ChatModel, close: () -> Unit) {
  val displayName = remember { mutableStateOf("") }
  val fullName = remember { mutableStateOf("") }
  val focusRequester = remember { FocusRequester() }

  Surface(Modifier.background(MaterialTheme.colors.onBackground)) {
    Column(
      modifier = Modifier.fillMaxSize().verticalScroll(rememberScrollState())
    ) {
      AppBarTitle(stringResource(R.string.create_profile), false)
      ReadableText(R.string.your_profile_is_stored_on_your_device)
      ReadableText(R.string.profile_is_only_shared_with_your_contacts)
      Spacer(Modifier.height(10.dp))
      Text(
        stringResource(R.string.display_name),
        style = MaterialTheme.typography.h6,
        modifier = Modifier.padding(bottom = 3.dp)
      )
      ProfileNameField(displayName, focusRequester)
      val errorText = if (!isValidDisplayName(displayName.value)) stringResource(R.string.display_name_cannot_contain_whitespace) else ""
      Text(
        errorText,
        fontSize = 15.sp,
        color = MaterialTheme.colors.error
      )
      Spacer(Modifier.height(3.dp))
      Text(
        stringResource(R.string.full_name_optional__prompt),
        style = MaterialTheme.typography.h6,
        modifier = Modifier.padding(bottom = 5.dp)
      )
      ProfileNameField(fullName)
      Spacer(Modifier.fillMaxHeight().weight(1f))
      Row {
        if (chatModel.users.isEmpty()) {
          SimpleButton(
            text = stringResource(R.string.about_simplex),
            icon = Icons.Outlined.ArrowBackIosNew
          ) { chatModel.onboardingStage.value = OnboardingStage.Step1_SimpleXInfo }
        }

        Spacer(Modifier.fillMaxWidth().weight(1f))

        val enabled = displayName.value.isNotEmpty() && isValidDisplayName(displayName.value)
        val createModifier: Modifier
        val createColor: Color
        if (enabled) {
          createModifier = Modifier.clickable { createProfile(chatModel, displayName.value, fullName.value, close) }.padding(8.dp)
          createColor = MaterialTheme.colors.primary
        } else {
          createModifier = Modifier.padding(8.dp)
          createColor = HighOrLowlight
        }
        Surface(shape = RoundedCornerShape(20.dp)) {
          Row(verticalAlignment = Alignment.CenterVertically, modifier = createModifier) {
            Text(stringResource(R.string.create_profile_button), style = MaterialTheme.typography.caption, color = createColor)
            Icon(Icons.Outlined.ArrowForwardIos, stringResource(R.string.create_profile_button), tint = createColor)
          }
        }
      }

      LaunchedEffect(Unit) {
        delay(300)
        focusRequester.requestFocus()
      }
    }
  }
}

fun createProfile(chatModel: ChatModel, displayName: String, fullName: String, close: () -> Unit) {
  withApi {
    val user = chatModel.controller.apiCreateActiveUser(
      Profile(displayName, fullName, null)
    ) ?: return@withApi
    chatModel.currentUser.value = user
    if (chatModel.users.isEmpty()) {
      chatModel.controller.startChat(user)
      chatModel.onboardingStage.value = OnboardingStage.Step3_SetNotificationsMode
    } else {
      val users = chatModel.controller.listUsers()
      chatModel.users.clear()
      chatModel.users.addAll(users)
      chatModel.controller.getUserChatData()
      close()
    }
  }
}

@Composable
fun ProfileNameField(name: MutableState<String>, focusRequester: FocusRequester? = null) {
  val modifier = Modifier
    .fillMaxWidth()
    .background(MaterialTheme.colors.secondary)
    .height(40.dp)
    .clip(RoundedCornerShape(5.dp))
    .padding(8.dp)
    .navigationBarsWithImePadding()
  BasicTextField(
    value = name.value,
    onValueChange = { name.value = it },
    modifier = if (focusRequester == null) modifier else modifier.focusRequester(focusRequester),
    textStyle = MaterialTheme.typography.body1.copy(color = MaterialTheme.colors.onBackground),
    keyboardOptions = KeyboardOptions(
      capitalization = KeyboardCapitalization.None,
      autoCorrect = false
    ),
    singleLine = true,
    cursorBrush = SolidColor(HighOrLowlight)
  )
}