Fastestvpn_JetpackCompose/app/src/main/java/com/vpn/fastestvpnservice/screensTV/AccountScreenTV.kt

package com.vpn.fastestvpnservice.screensTV

import android.app.Activity
import android.content.Intent
import android.os.Handler
import android.os.Looper
import android.util.Log
import android.widget.Toast
import androidx.activity.compose.BackHandler
import androidx.compose.foundation.ExperimentalFoundationApi
import androidx.compose.foundation.Image
import androidx.compose.foundation.LocalOverscrollConfiguration
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.focusable
import androidx.compose.foundation.gestures.detectTapGestures
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.BoxScope
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.ColumnScope
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.verticalScroll
import androidx.compose.material3.AlertDialog
import androidx.compose.material3.Button
import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.CircularProgressIndicator
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.CompositionLocalProvider
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.getValue
import androidx.compose.runtime.livedata.observeAsState
import androidx.compose.runtime.mutableFloatStateOf
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.alpha
import androidx.compose.ui.draw.clip
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusRequester
import androidx.compose.ui.focus.onFocusChanged
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.ColorFilter
import androidx.compose.ui.graphics.painter.Painter
import androidx.compose.ui.graphics.toArgb
import androidx.compose.ui.input.key.Key
import androidx.compose.ui.input.key.KeyEventType
import androidx.compose.ui.input.key.key
import androidx.compose.ui.input.key.onKeyEvent
import androidx.compose.ui.input.key.type
import androidx.compose.ui.input.pointer.pointerInput
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.platform.LocalView
import androidx.compose.ui.res.colorResource
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.unit.TextUnit
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import androidx.compose.ui.window.DialogProperties
import androidx.lifecycle.viewmodel.compose.viewModel
import androidx.navigation.NavHostController
import com.vpn.fastestvpnservice.R
import com.vpn.fastestvpnservice.helpers.BasePreferenceHelper
import com.vpn.fastestvpnservice.navigation.isAccountScreenPressed
import com.vpn.fastestvpnservice.navigation.isFirstItemPressed
import com.vpn.fastestvpnservice.navigation.isFourthItemFocused
import com.vpn.fastestvpnservice.navigation.isFourthItemPressed
import com.vpn.fastestvpnservice.screens.bottomNavBarScreens.LogoutDialog
import com.vpn.fastestvpnservice.screens.bottomNavBarScreens.act
import com.vpn.fastestvpnservice.sealedClass.Screen
import com.vpn.fastestvpnservice.utils.VPNConnectionsUtil
import com.vpn.fastestvpnservice.utils.isTablet
import com.vpn.fastestvpnservice.viewmodels.AccountViewModel
import com.vpn.fastestvpnservice.viewmodels.HomeViewModel
import com.vpn.fastestvpnservice.widgets.SimpleAppWidget
import de.blinkt.openvpn.core.App
import kotlinx.coroutines.delay

@OptIn(ExperimentalMaterial3Api::class, ExperimentalFoundationApi::class)
@Composable
fun AccountTV(navHostController: NavHostController,
            settingsNavHostController: NavHostController)
{
    var isLoggedOut by remember { mutableStateOf(false) }
    var isDelete by remember { mutableStateOf(false) }
    val context = LocalContext.current
    val basePreferenceHelper = BasePreferenceHelper(context)
    val accountViewModel: AccountViewModel = viewModel()
    val focusRequester1 = remember { FocusRequester() }

    BackHandler {
//        Toast.makeText(
//            context, "BackHandler Account TV - ${isFourthItemFocused.value}", Toast.LENGTH_SHORT
//        ).show()
        if (isFourthItemFocused.value) {
            navHostController.popBackStack()
            isFirstItemPressed.value = true
//            customNavigation(navHostController, BottomBarScreen.Home)
        } else {
            isFourthItemPressed.value = true
        }
    }

    CompositionLocalProvider(
        LocalOverscrollConfiguration provides null
    ) {
        Box(modifier = Modifier
            .background(colorResource(id = R.color.background_color_gray))
            .fillMaxSize()
            .padding(vertical = 10.dp)
            .padding(bottom = 0.dp)
            .verticalScroll(rememberScrollState())
//        contentAlignment = Alignment.Center

        ) {
            val view = LocalView.current
            val window = (view.context as Activity).window
            window.statusBarColor = Color.Transparent.toArgb()
            window.navigationBarColor = Color.Transparent.toArgb()

            if (isAccountScreenPressed.value) {
                LaunchedEffect(key1 = Unit) {
                    focusRequester1.requestFocus()
                }
                isAccountScreenPressed.value = false
            }

            Column(
                verticalArrangement = Arrangement.Top,
                horizontalAlignment = Alignment.Start,
                modifier = Modifier
                    .padding(start = 16.dp, end = 24.dp)
                    .fillMaxSize()
            ) {
                Spacer(modifier = Modifier.height(50.dp))
                AddTextAccountTV(
                    text = "Account",
                    size = 28.sp,
                    color = MaterialTheme.colorScheme.inversePrimary
                )
//                Spacer(modifier = Modifier.height(15.dp))
//                AddRowAccountTV("Email: ", basePreferenceHelper.getUser()?.userinfo?.email ?: "")
//                AddRowAccountTV("Product: ", basePreferenceHelper.getProduct()?.productName ?: "")
//                AddRowAccountTV("Account Status: ", basePreferenceHelper.getProduct()?.status ?: "")

//                Surface(
//                    modifier = Modifier
//                        .padding(top = 23.5.dp, bottom = 0.dp)
//                        .height(1.dp)
//                        .fillMaxWidth(),
//                    color = colorResource(id = R.color.gray_icon)
//                ) {}

                Spacer(modifier = Modifier.height(22.dp))

                AddRowAccountIconTV(
                    icon = painterResource(id = R.drawable.subscription3x),
                    text = "Upgrade Subscription",
                    onClick = {
                        navHostController.navigate(
                            Screen.Subscription.route
                        )
                    },
                    focusRequester1
                )
                AddRowAccountIconTV(
                    icon = painterResource(id = R.drawable.fav3x),
                    text = "Favorite Servers",
                    onClick = {
                        navHostController.navigate(
                            Screen.FavoriteServers.route
                        )
                    }
                )
                AddRowAccountIconTV(
                    icon = painterResource(id = R.drawable.lock3x),
                    text = "Change Password",
                    onClick = {
                        navHostController.navigate(
                            Screen.ChangePassword.route
                        )
                    }
                )
                AddRowAccountIconTV(
                    icon = painterResource(id = R.drawable.delete3x),
                    text = "Delete Account",
                    onClick = {
                        isDelete = true
                        Log.d("islogoutClicked?", "isDelete Yes")
                    }
                )
                AddRowAccountIconTV(
                    icon = painterResource(id = R.drawable.logout3x),
                    text = "Logout",
                    onClick = {
                        isLoggedOut = true
                        Log.d("islogoutClicked?", "Yes")
                    },
                    isLastRow = true
                )
            }

            if (isLoggedOut) {
                Log.d("islogoutClicked", "isLoggedOut$isLoggedOut")

                AlertDialog(
                    onDismissRequest = { isLoggedOut = false },
                    properties = DialogProperties(),
                    modifier = Modifier
                        .fillMaxWidth()
                        .height(228.dp)
                ) {
                    LogoutDialog("Logout Account",
                        "Are you sure to logout the account?",
                        onCancel = {
                            isLoggedOut = false
                        },
                        settingsNavHostController,
                        isLoggedOut,
                        isDelete,
                        basePreferenceHelper,
                        accountViewModel
                    )
                }
            }

            if (isDelete) {
                Log.d("islogoutClicked", "isDelete$isDelete")

                AlertDialog(
                    onDismissRequest = { isDelete = false },
                    properties = DialogProperties(),
                    modifier = Modifier
                        .fillMaxWidth()
                        .height(228.dp)
                ) {
                    LogoutDialog("Delete Account",
                        "Are you sure to delete the account?",
                        onCancel = { isDelete = false },
                        settingsNavHostController,
                        isLoggedOut,
                        isDelete,
                        basePreferenceHelper,
                        accountViewModel
                    )
                }
            }

            if (accountViewModel.liveDataLogoutStatus.value == true) {
                var progress by remember { mutableFloatStateOf(0.1F) }

                LaunchedEffect(key1 = Unit) {
                    for (i in 1..100) {
                        progress = i.toFloat()/100F
                        delay(100)
                    }
                }

                CircularProgressIndicator(
                    progress = { progress },
                    modifier = Modifier
                        .align(Alignment.Center)
                        .size(50.dp),
                    color = colorResource(id = R.color.yellow_text),
                    strokeWidth = 5.dp,
                )
            }

            val logoutResponse = accountViewModel.liveDataLogout.observeAsState().value
            logoutResponse?.let {
                Log.d("test_button_log", "logout api response")
                accountViewModel.setLogoutStatus(false)
                if (it) {
                    Log.d("test_api_response","Logout live: $logoutResponse")
                    basePreferenceHelper.setLoggedInState(false)
                    basePreferenceHelper.clearAllData()
                    settingsNavHostController.popBackStack()
                    settingsNavHostController.navigate(Screen.Started.route)

                    val widgetIntent = Intent(context, SimpleAppWidget::class.java)
                    widgetIntent.action = SimpleAppWidget.ACTION_LOGOUT
                    context.sendBroadcast(widgetIntent)
                }
                else {
                    Log.d("test_api_response","Logout false: $logoutResponse")
                    accountViewModel.mutableLiveDataLogoutStatus.value = false
                    Toast.makeText(context, logoutResponse.toString(), Toast.LENGTH_SHORT).show()
                }
                accountViewModel.mutableLiveDataLogout.value = null
            }

            val deleteResponse = accountViewModel.liveDataDelete.observeAsState().value
            deleteResponse?.let {
                accountViewModel.setLogoutStatus(false)
                if (it.status) {
                    Log.d("test_api_response","Delete live: ${deleteResponse.status}")
                    basePreferenceHelper.setLoggedInState(false)
                    basePreferenceHelper.clearAllData()
                    settingsNavHostController.popBackStack()
                    settingsNavHostController.navigate(Screen.Started.route)
                }
                else {
                    Log.d("test_api_response","Delete false: ${deleteResponse.status}")
                    accountViewModel.mutableLiveDataDeleteStatus.value = false
                    Toast.makeText(context, deleteResponse.status.toString(), Toast.LENGTH_SHORT).show()
                }
                accountViewModel.mutableLiveDataDelete.value = null
            }
        }
    }
}
@Composable
fun ColumnScope.AddTextAccountTV(text: String, size: TextUnit, color: Color) {
    Text(
        text = text,
        color = color,
        style = MaterialTheme.typography.headlineLarge
    )
}

@Composable
fun ColumnScope.AddRowAccountTV(title: String, subTitle: String) {
//    val configuration = LocalConfiguration.current
//    val isTablet = configuration.screenWidthDp > 840
    Row(
        modifier = Modifier
            .fillMaxWidth()
            .padding(top = 16.dp)
            .background(Color.Transparent)
            .height(if (isTablet()) 20.dp else 18.dp),
        horizontalArrangement = Arrangement.SpaceBetween,
        verticalAlignment = Alignment.CenterVertically
    ) {
        Surface(
            modifier = Modifier
                .padding(start = 0.dp)
                .align(Alignment.CenterVertically),
            color = Color.Transparent
        ) {
            Text(text = title,
                color = MaterialTheme.colorScheme.inversePrimary,
                style = MaterialTheme.typography.bodyLarge.copy(
                    fontSize = if (isTablet()) 15.sp else 14.sp
                ),
                maxLines = 1,
                modifier = Modifier
                    .padding(start = 10.dp, end = 0.dp)
                    .weight(1f)
            )
        }
//        Spacer(modifier = Modifier.weight(1f))

        Surface(
            modifier = Modifier
                .padding(start = 0.dp)
                .align(Alignment.CenterVertically),
            color = Color.Transparent
        ) {
            Text(text = subTitle,
                color = MaterialTheme.colorScheme.inversePrimary,
                style = MaterialTheme.typography.bodySmall.copy(
                    fontSize = if (isTablet()) 16.sp else 14.sp
                ),
                maxLines = 1,
                modifier = Modifier
                    .padding(start = 0.dp, end = 0.dp)
                    .weight(1f)
                    .alpha(0.6F)
            )
        }

    }
}

@Composable
fun ColumnScope.AddRowAccountIconFirstTV(
    icon: Painter,
    text: String,
    onClick : () -> Unit
) {

    Row(
        modifier = Modifier
            .fillMaxWidth()
            .padding(top = 0.dp)
            .clip(RoundedCornerShape(4.dp))
            .background(Color.White)
            .height(61.dp)
            .pointerInput(Unit) {
                detectTapGestures {
                    onClick()
                }
            },
        horizontalArrangement = Arrangement.Start,
        verticalAlignment = Alignment.CenterVertically
    ) {
        Surface(
            modifier = Modifier.padding(start = 20.dp),
            color = Color.Transparent
        ) {
            Image(
                painter = icon,
                contentDescription = "World",
                modifier = Modifier
                    .padding(start = 0.dp)
                    .size(24.dp)
                    .weight(1f),
                colorFilter = ColorFilter.tint(MaterialTheme.colorScheme.inversePrimary)
            )
        }
        Surface(
            modifier = Modifier.padding(start = 0.dp),
            color = Color.Transparent
        ) {
            Text(text = text,
                color = MaterialTheme.colorScheme.inversePrimary,
                style = MaterialTheme.typography.titleSmall,
                maxLines = 2,
                modifier = Modifier
                    .padding(start = 18.dp, end = 0.dp)
                    .weight(1f)
            )
        }
        Spacer(modifier = Modifier.weight(1f))
        Surface(
            modifier = Modifier
                .padding(end = 20.dp)
                .align(Alignment.CenterVertically),
            color = Color.Transparent
        ) {
            Image(
                painter = painterResource(id = R.drawable.frontarrow3x),
                contentDescription = "Front_Arrow",
                modifier = Modifier
                    .padding(start = 0.dp, end = 3.dp)
                    .size(10.dp, 18.dp)
                    .weight(1f),
                colorFilter = ColorFilter.tint(MaterialTheme.colorScheme.inversePrimary)
            )
        }


    }


}

@Composable
fun ColumnScope.AddRowAccountIconTV(
    icon: Painter,
    text: String,
    onClick : () -> Unit,
    focusRequester1: FocusRequester = FocusRequester(),
    isLastRow: Boolean = false
) {
    var isRowFocused by remember { mutableStateOf(false) }
    val context = LocalContext.current
    Row(
        modifier = Modifier
            .fillMaxWidth()
            .padding(top = 5.dp)
            .background(if (isRowFocused) Color.LightGray else Color.White,
                shape = RoundedCornerShape(4.dp))
            .height(61.dp)
            .onKeyEvent {
                if (isLastRow) {
                    if (it.type == KeyEventType.KeyDown && it.key == Key.DirectionDown) {
//                        Toast
//                            .makeText(
//                                context, "KeyDown & DirectionDown Email", Toast.LENGTH_SHORT
//                            )
//                            .show()
//                        customNavigation(navHostController, BottomBarScreen.Help)
                        isFourthItemPressed.value = true
                        true
                    }
                    else if (it.type == KeyEventType.KeyUp && it.key == Key.DirectionUp) {
//                        Toast
//                            .makeText(
//                                context, "KeyUp & DirectionUp Email", Toast.LENGTH_SHORT
//                            )
//                            .show()
                        false
                    }
                    else {
                        false
                    }
                } else { false }
            }
            .focusRequester(focusRequester1)
            .onFocusChanged {
                isRowFocused = it.isFocused
            }
            .focusable()
            .clickable {
//                Toast.makeText(
//                    context, text, Toast.LENGTH_SHORT
//                ).show()
            }
//            .border(
//                1.dp, Color.Blue, RoundedCornerShape(40.dp)
//            )
//            .clip(RoundedCornerShape(40.dp))
//            .pointerInput(Unit) {
//                detectTapGestures {
//                    onClick()
//                }
//            }

        ,
        horizontalArrangement = Arrangement.Start,
        verticalAlignment = Alignment.CenterVertically
    ) {
        Surface(
            modifier = Modifier.padding(start = 20.dp),
            color = Color.Transparent
        ) {
            Image(
                painter = icon,
                contentDescription = "World",
                modifier = Modifier
                    .padding(start = 0.dp)
                    .size(24.dp)
                    .weight(1f),
                colorFilter = ColorFilter.tint(MaterialTheme.colorScheme.inversePrimary)
            )
        }
        Surface(
            modifier = Modifier.padding(start = 0.dp),
            color = Color.Transparent
        ) {
            Text(text = text,
                color = MaterialTheme.colorScheme.inversePrimary,
                style = MaterialTheme.typography.titleSmall,
                maxLines = 2,
                modifier = Modifier
                    .padding(start = 18.dp, end = 0.dp)
                    .weight(1f)
            )
        }
        Spacer(modifier = Modifier.weight(1f))
        Surface(
            modifier = Modifier
                .padding(end = 20.dp)
                .align(Alignment.CenterVertically),
            color = Color.Transparent
        ) {
            Image(
                painter = painterResource(id = R.drawable.frontarrow3x),
                contentDescription = "Front_Arrow",
                modifier = Modifier
                    .padding(start = 0.dp, end = 3.dp)
                    .size(10.dp, 18.dp)
                    .weight(1f),
                colorFilter = ColorFilter.tint(MaterialTheme.colorScheme.inversePrimary)
            )
        }


    }


}

@Composable
fun BoxScope.LogoutDialogTV(
    title: String,
    desc: String,
    onCancel : () -> Unit,
    settingsNavHostController: NavHostController,
    isLogout: Boolean,
    isDelete: Boolean,
    basePreferenceHelper: BasePreferenceHelper,
    accountViewModel: AccountViewModel
) {
    val context = LocalContext.current
    val scope = rememberCoroutineScope()
    val homeViewModel: HomeViewModel = viewModel {
        HomeViewModel(context, scope)
    }
    Surface(
        color = colorResource(id = R.color.white),
        modifier = Modifier
            .background(Color.Transparent)
            .fillMaxWidth()
        ,
        shape = RoundedCornerShape(18.dp)
    ) {
        Column(
            verticalArrangement = Arrangement.Top,
            horizontalAlignment = Alignment.CenterHorizontally,
            modifier = Modifier
                .background(MaterialTheme.colorScheme.onBackground)
        ) {
            Log.d("islogoutClicked", "AlertDialog")

            Text(text = title,
                color = MaterialTheme.colorScheme.inversePrimary,
                style = MaterialTheme.typography.bodyMedium,
                modifier = Modifier.padding(top = 45.dp)
            )
            Text(text = desc,
                color = MaterialTheme.colorScheme.inversePrimary,
                style = MaterialTheme.typography.labelSmall,
                maxLines = 2,
                modifier = Modifier.padding(top = 26.dp)
            )
            Row (
                modifier = Modifier
                    .padding(top = 34.dp),
                horizontalArrangement = Arrangement.SpaceBetween,
                verticalAlignment = Alignment.Bottom
            ) {
                Button(
                    onClick = {
                        Log.d("test_button", "No")
                        onCancel()
//                                    navHostController.popBackStack()
//                                    navHostController.navigate(Screen.Login.route)
                    },
                    modifier = Modifier
                        .padding(
                            start = 15.dp, end = 5.dp,
                            bottom = 0.dp, top = 0.dp
                        )
                        .background(colorResource(id = R.color.transparent))
                        .weight(1F)
                        .height(52.dp),

                    shape = RoundedCornerShape(15.dp),
                    colors = ButtonDefaults.buttonColors(
                        contentColor = colorResource(id = R.color.white),
                        containerColor = colorResource(id = R.color.light_blue),
                    ),
                )
                {
                    Text(text = "No",
                        style = MaterialTheme.typography.labelLarge)
                    Log.d("test_button", "RowScope")
                }

                Button(
                    onClick = {
                        Log.d("test_button", "Logout Yes")

                        if (isLogout) {
                            Log.d("test_api_response","Logout click = $isLogout")

                            val connectState = homeViewModel.isConnect.value
                            if (connectState == App.CONNECTED || connectState == App.CONNECTING) {
                                Log.d("test_button_log", "connectState = $connectState, act = $act")
                                Handler(Looper.getMainLooper()).postDelayed({
                                    val wg = VPNConnectionsUtil(context, act ,homeViewModel)
                                    wg.stopVpn()
                                }, 400)
                            }

                            Log.d("test_button_log", "logout api")
                            accountViewModel.setLogoutStatus(true)
                            accountViewModel.logout()

                            onCancel()
                        }

                        if (isDelete) {
                            Log.d("test_api_response","Delete click = $isDelete")
                            accountViewModel.setLogoutStatus(true)
                            accountViewModel.deleteAccount()
                            onCancel()
                        }

                    },
                    modifier = Modifier
                        .padding(
                            start = 5.dp, end = 15.dp,
                            bottom = 0.dp, top = 0.dp
                        )
                        .background(colorResource(id = R.color.transparent))
                        .weight(1F)
                        .height(52.dp),
                    shape = RoundedCornerShape(15.dp),
                    colors = ButtonDefaults.buttonColors(
                        contentColor = colorResource(id = R.color.white),
                        containerColor = colorResource(id = R.color.red),
                    ),
//                                border = BorderStroke(2.dp,
//                                    colorResource(id = R.color.gray_icon))
                )
                {
                    Text(text = "Yes",
                        style = MaterialTheme.typography.labelLarge)
                    Log.d("test_button", "RowScope")

//                    val logoutResponse = accountViewModel.liveDataLogout.observeAsState().value
//                    if (logoutResponse == true) {
//                        accountViewModel.setLogoutStatus(false)
//                        Log.d("test_api_response","Logout live: $logoutResponse")
//                        basePreferenceHelper.setLoggedInState(false)
//                        settingsNavHostController.popBackStack()
//                        settingsNavHostController.navigate(Screen.Started.route)
//                    }
//                    else {
////                        accountViewModel.setLogoutStatus(false)
////                        onCancel()
//                    }
                }
            }
        }

    }
}