package com.example.pmulabs.screensMobile

import android.annotation.SuppressLint
import androidx.compose.foundation.BorderStroke
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.offset
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.requiredHeight
import androidx.compose.foundation.layout.requiredSize
import androidx.compose.foundation.layout.requiredWidth
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.layout.wrapContentHeight
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.ArrowDropDown
import androidx.compose.material.icons.filled.ArrowDropUp
import androidx.compose.material3.AlertDialog
import androidx.compose.material3.Button
import androidx.compose.material3.ButtonColors
import androidx.compose.material3.CircularProgressIndicator
import androidx.compose.material3.DropdownMenu
import androidx.compose.material3.DropdownMenuItem
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.HorizontalDivider
import androidx.compose.material3.Icon
import androidx.compose.material3.OutlinedTextField
import androidx.compose.material3.Text
import androidx.compose.material3.TextFieldDefaults
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateListOf
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.clip
import androidx.compose.ui.geometry.Size
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.onGloballyPositioned
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.platform.LocalDensity
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import androidx.compose.ui.unit.toSize
import androidx.lifecycle.viewmodel.compose.viewModel
import androidx.navigation.NavController
import androidx.paging.LoadState
import androidx.paging.compose.collectAsLazyPagingItems
import com.example.pmulabs.R
import com.example.pmulabs.basecomponents.navigate.BottomBarScreen
import com.example.pmulabs.designElem.elem.ValidateEmail
import com.example.pmulabs.designElem.elem.isValidEmail
import com.example.pmulabs.room.models.Article
import com.example.pmulabs.room.models.Tag
import com.example.pmulabs.viewModels.AppViewModelProvider
import com.example.pmulabs.viewModels.ArticlePageScreenViewModel
import com.example.pmulabs.viewModels.ArticleScreenViewModel
import com.example.pmulabs.viewModels.CurrentUserViewModel
import com.example.pmulabs.viewModels.TagItemViewModel
import kotlinx.coroutines.launch
import java.util.Date

@SuppressLint("UnrememberedMutableState")
@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun ProfileScreen(navController: NavController, modifier: Modifier = Modifier,articleScreenViewModel: ArticleScreenViewModel= viewModel(factory = AppViewModelProvider.Factory),tagItemViewModel: TagItemViewModel= viewModel(factory = AppViewModelProvider.Factory),articlePageScreenViewModel: ArticlePageScreenViewModel= viewModel(factory = AppViewModelProvider.Factory), currentUserViewModel: CurrentUserViewModel = viewModel(factory = AppViewModelProvider.Factory)) {
    val context = LocalContext.current
    var getUser by remember { mutableStateOf(currentUserViewModel.user) }
    var openDialogUser by remember { mutableStateOf(false) }
    var email by remember { mutableStateOf(getUser?.email) }
    var password by remember { mutableStateOf(getUser?.password) }
    var nickname by remember { mutableStateOf(getUser?.nickname) }
    val getArticles = articleScreenViewModel.articles.collectAsLazyPagingItems()
    val getComms = articlePageScreenViewModel.comments.collectAsLazyPagingItems()
    val getTags = tagItemViewModel.tags.collectAsLazyPagingItems()
    val coroutineScope = rememberCoroutineScope()

    articlePageScreenViewModel.setTagList()

    val tags = mutableStateOf<List<Tag>>(articlePageScreenViewModel.tagList)

    //список названий тэгов
    var tagsNames = remember { mutableStateListOf<String>() }
    tags.value.forEach { teg ->
        if (!tagsNames.contains(teg.title)) {
            tagsNames.add(teg.title)
        }
    }

    var openDialog by remember { mutableStateOf(false) }
    var text by remember { mutableStateOf("") }
    var title by remember { mutableStateOf("") }
    var tagId by remember { mutableStateOf(0) }

    //переменные для dropdown
    var expanded by remember { mutableStateOf(false) }
    val suggestions = tagsNames
    var selectedText by remember { mutableStateOf("") }
    var textfieldSize by remember { mutableStateOf(Size.Zero) }
    val icon = if (expanded)
        Icons.Filled.ArrowDropUp
    else
        Icons.Filled.ArrowDropDown

    if (openDialog) {
        AlertDialog(
            onDismissRequest = {
                openDialog = false
                text = ""
                title = ""
            },
            content = {
                Column(
                    modifier = Modifier
                        .clip(RoundedCornerShape(16.dp))
                        .background(Color.White)
                        .padding(16.dp),
                ) {
                    Text(
                        text = "Add your article",
                        color = Color(0xff423a99),
                        style = TextStyle(
                            fontSize = 20.sp,
                        ),
                    )
                    Box() {
                        OutlinedTextField(
                            value = selectedText,
                            onValueChange = { selectedText = it },
                            modifier = Modifier
                                .fillMaxWidth()
                                .padding(10.dp)
                                .onGloballyPositioned { coordinates ->
                                    textfieldSize = coordinates.size.toSize()
                                },
                            label = { Text("Select Tag") },
                            colors = TextFieldDefaults.textFieldColors(
                                containerColor = Color.White,
                                focusedIndicatorColor = Color(0xff423a99),
                                focusedLabelColor = Color(0xff423a99),
                                unfocusedIndicatorColor = Color(0xff423a99),
                                unfocusedLabelColor = Color(0xff423a99)
                            ),
                            trailingIcon = {
                                Icon(icon, "List of tags",
                                    Modifier.clickable { expanded = !expanded })
                            }
                        )
                        DropdownMenu(
                            expanded = expanded,
                            onDismissRequest = { expanded = false },
                            modifier = Modifier
                                .width(with(LocalDensity.current) { textfieldSize.width.toDp() })
                        ) {
                            suggestions.forEach { label ->
                                DropdownMenuItem(
                                    text = { Text(text = label) },
                                    onClick = {
                                        selectedText = label
                                        coroutineScope.launch {
                                            tagId =
                                                articlePageScreenViewModel.getTagByName(selectedText).id!!
                                        }
                                    }
                                )
                            }
                        }
                    }
                    OutlinedTextField(
                        value = title,
                        onValueChange = {
                            title = it
                        },
                        colors = TextFieldDefaults.textFieldColors(
                            containerColor = Color.White,
                            focusedIndicatorColor = Color(0xff423a99),
                            focusedLabelColor = Color(0xff423a99),
                            unfocusedIndicatorColor = Color(0xff423a99),
                            unfocusedLabelColor = Color(0xff423a99)
                        ),
                        modifier = Modifier
                            .fillMaxWidth()
                            .wrapContentHeight()
                            .padding(10.dp),
                        label = { Text("Article Title") },
                        placeholder = { Text("Write title of article...") },
                        minLines = 3,
                        maxLines = 3,
                    )
                    OutlinedTextField(
                        value = text,
                        onValueChange = {
                            text = it
                        },
                        colors = TextFieldDefaults.textFieldColors(
                            containerColor = Color.White,
                            focusedIndicatorColor = Color(0xff423a99),
                            focusedLabelColor = Color(0xff423a99),
                            unfocusedIndicatorColor = Color(0xff423a99),
                            unfocusedLabelColor = Color(0xff423a99)
                        ),
                        modifier = Modifier
                            .fillMaxWidth()
                            .wrapContentHeight()
                            .padding(10.dp),
                        label = { Text("Article Text") },
                        placeholder = { Text("Write article text...") },
                        minLines = 3,
                        maxLines = 3,
                    )
                    Row(
                        modifier = Modifier.padding(all = 8.dp),
                        horizontalArrangement = Arrangement.Center
                    ) {
                        Button(
                            colors = ButtonColors(
                                containerColor = Color(0xff423a99),
                                disabledContainerColor = Color(0xff423a99),
                                contentColor = Color.White,
                                disabledContentColor = Color.White
                            ),
                            onClick = {
                                openDialog = false
                                if (title.isNotEmpty() && text.isNotEmpty() && tagId != null) {
                                    val newArticle = Article(
                                        null, title, text,
                                        Date().time, getUser?.id.toString().toInt(), tagId
                                    )
                                    coroutineScope.launch {
                                        articlePageScreenViewModel.insertArticle(newArticle)
                                    }
                                }
                            },
                            modifier = Modifier
                                .padding(start = 100.dp)
                                .fillMaxWidth(0.5f)
                                .height(40.dp)
                        ) {
                            Text(text = "Add", fontSize = 20.sp)
                        }
                    }
                }
            },
        )
    }

    if (openDialogUser) {
        AlertDialog(
            onDismissRequest = {
                openDialogUser = false
                email = getUser?.email.toString()
                password = getUser?.password.toString()
                nickname = getUser?.nickname.toString()
            },
            content = {
                Column(
                    modifier = Modifier
                        .clip(RoundedCornerShape(16.dp))
                        .background(Color.White)
                        .padding(16.dp),
                ) {
                    Text(
                        text = "Edit your data",
                        color = Color(0xff423a99),
                        style = TextStyle(
                            fontSize = 20.sp,
                        ),
                    )
                    email?.let { ValidateEmail(it, { email = it }) }
                    password?.let {
                        OutlinedTextField(
                            value = it,
                            onValueChange = {
                                password = it
                            },
                            colors = TextFieldDefaults.textFieldColors(
                                containerColor = Color.White,
                                focusedIndicatorColor = Color(0xff423a99),
                                focusedLabelColor = Color(0xff423a99),
                                unfocusedIndicatorColor = Color(0xff423a99),
                                unfocusedLabelColor = Color(0xff423a99)
                            ),
                            modifier = Modifier
                                .fillMaxWidth()
                                .wrapContentHeight()
                                .padding(10.dp),
                            label = { Text("Password") },
                            placeholder = { Text("Write password...") },
                            minLines = 1,
                            maxLines = 1,
                        )
                    }
                    nickname?.let {
                        OutlinedTextField(
                            value = it,
                            onValueChange = {
                                nickname = it
                            },
                            colors = TextFieldDefaults.textFieldColors(
                                containerColor = Color.White,
                                focusedIndicatorColor = Color(0xff423a99),
                                focusedLabelColor = Color(0xff423a99),
                                unfocusedIndicatorColor = Color(0xff423a99),
                                unfocusedLabelColor = Color(0xff423a99)
                            ),
                            modifier = Modifier
                                .fillMaxWidth()
                                .wrapContentHeight()
                                .padding(10.dp),
                            label = { Text("Nickname") },
                            placeholder = { Text("Write nickname...") },
                            minLines = 1,
                            maxLines = 1,
                        )
                    }
                    Row(
                        modifier = Modifier.padding(all = 8.dp),
                        horizontalArrangement = Arrangement.Center
                    ) {
                        Button(
                            colors = ButtonColors(
                                containerColor = Color(0xff423a99),
                                disabledContainerColor = Color(0xff423a99),
                                contentColor = Color.White,
                                disabledContentColor = Color.White
                            ),
                            onClick = {
                                openDialogUser = false
                                if (password?.isNotEmpty() == true && email?.isNotEmpty() == true && isValidEmail(
                                        email!!
                                    ) && nickname?.isNotEmpty() == true
                                ) {
                                    getUser?.password = password as String
                                    getUser?.email = email as String
                                    getUser?.nickname = nickname as String
                                    coroutineScope.launch {
                                        getUser?.let {
                                            articlePageScreenViewModel.updateUser(it)
                                        }
                                    }
                                }
                            },
                            modifier = Modifier
                                .padding(start = 100.dp)
                                .fillMaxWidth(0.5f)
                                .height(40.dp)
                        ) {
                            Text(text = "Edit", fontSize = 20.sp)
                        }
                    }
                }
            },
        )
    }


    LazyColumn(
        contentPadding = PaddingValues(top = 5.dp, bottom = 320.dp),
        modifier = modifier
            .requiredWidth(width = 412.dp)
            .requiredHeight(height = 915.dp)
            .background(color = Color.White)
    ) {
        item {
            Box(
                modifier = Modifier
                    .offset(
                        x = 106.dp,
                        y = 95.dp
                    )
                    .requiredWidth(width = 200.dp)
                    .requiredHeight(height = 310.dp)
            ) {
                Image(
                    painter = painterResource(id = R.drawable.ixbtcom_colored_logo1),
                    contentDescription = "Ellipse 8",
                    modifier = Modifier
                        .requiredSize(size = 200.dp)
                        .clip(shape = CircleShape)
                )
                Box(
                    modifier = Modifier
                        .align(alignment = Alignment.TopStart)
                        .offset(
                            x = 0.dp,
                            y = 215.dp
                        )
                        .requiredWidth(width = 200.dp)
                        .requiredHeight(height = 44.dp)
                ) {
                    Box(
                        modifier = Modifier
                            .requiredWidth(width = 200.dp)
                            .requiredHeight(height = 44.dp)
                            .clip(shape = RoundedCornerShape(15.dp))
                            .background(color = Color(0xffdbdbf1))
                    )
                    Text(
                        text = "${getUser?.nickname}",
                        color = Color(0xff423a99),
                        textAlign = TextAlign.Center,
                        style = TextStyle(
                            fontSize = 17.sp,
                            fontWeight = FontWeight.Bold
                        ),
                        modifier = Modifier
                            .requiredWidth(width = 200.dp)
                            .requiredHeight(height = 44.dp)
                            .wrapContentHeight(align = Alignment.CenterVertically)
                    )
                }
                Box(
                    modifier = Modifier
                        .align(alignment = Alignment.TopStart)
                        .offset(
                            x = 0.dp,
                            y = 266.dp
                        )
                        .requiredWidth(width = 200.dp)
                        .requiredHeight(height = 44.dp)
                ) {
                    Box(
                        modifier = Modifier
                            .requiredWidth(width = 200.dp)
                            .requiredHeight(height = 44.dp)
                            .clip(shape = RoundedCornerShape(15.dp))
                            .background(color = Color(0xffdbdbf1))
                    )
                    Text(
                        text = "${getUser?.email}",
                        color = Color(0xff423a99),
                        textAlign = TextAlign.Center,
                        style = TextStyle(
                            fontSize = 17.sp,
                            fontWeight = FontWeight.Bold
                        ),
                        modifier = Modifier
                            .requiredWidth(width = 200.dp)
                            .requiredHeight(height = 44.dp)
                            .wrapContentHeight(align = Alignment.CenterVertically)
                    )
                }
                Box(
                    modifier = Modifier
                        .align(alignment = Alignment.TopStart)
                        .offset(
                            x = 0.dp,
                            y = 317.dp
                        )
                        .requiredWidth(width = 200.dp)
                        .requiredHeight(height = 44.dp)
                ) {
                    Box(
                        modifier = Modifier
                            .requiredWidth(width = 200.dp)
                            .requiredHeight(height = 44.dp)
                            .clip(shape = RoundedCornerShape(15.dp))
                            .background(color = Color(0xff423a99))
                    )
                    Text(
                        text = "Add Article!",
                        color = Color(0xffdbdbf1),
                        textAlign = TextAlign.Center,
                        style = TextStyle(
                            fontSize = 17.sp,
                            fontWeight = FontWeight.Bold
                        ),
                        modifier = Modifier
                            .requiredWidth(width = 200.dp)
                            .requiredHeight(height = 44.dp)
                            .wrapContentHeight(align = Alignment.CenterVertically)
                            .clickable { openDialog = true })
                }
                Box(
                    modifier = Modifier
                        .align(alignment = Alignment.TopStart)
                        .offset(
                            x = 0.dp,
                            y = 368.dp
                        )
                        .requiredWidth(width = 200.dp)
                        .requiredHeight(height = 44.dp)
                ) {
                    Box(
                        modifier = Modifier
                            .requiredWidth(width = 200.dp)
                            .requiredHeight(height = 44.dp)
                            .clip(shape = RoundedCornerShape(15.dp))
                            .background(color = Color(0xff423a99))
                    )
                    Text(
                        text = "Edit my Data",
                        color = Color(0xffdbdbf1),
                        textAlign = TextAlign.Center,
                        style = TextStyle(
                            fontSize = 17.sp,
                            fontWeight = FontWeight.Bold
                        ),
                        modifier = Modifier
                            .requiredWidth(width = 200.dp)
                            .requiredHeight(height = 44.dp)
                            .wrapContentHeight(align = Alignment.CenterVertically)
                            .clickable { openDialogUser = true })
                }
            }
        }
        item {
            Box(
                modifier = Modifier
                    .offset(
                        x = 9.dp,
                        y = 220.dp
                    )
                    .requiredWidth(width = 393.dp)
                    .requiredHeight(height = 182.dp)
            ) {
                Box(
                    modifier = Modifier
                        .align(alignment = Alignment.TopStart)
                        .offset(
                            x = 0.dp,
                            y = 27.1240234375.dp
                        )
                        .requiredWidth(width = 393.dp)
                        .requiredHeight(height = 155.dp)
                ) {
                    Box(
                        modifier = Modifier
                            .requiredWidth(width = 393.dp)
                            .requiredHeight(height = 155.dp)
                            .clip(shape = RoundedCornerShape(5.dp))
                            .background(color = Color.White)
                            .border(
                                border = BorderStroke(3.dp, Color(0xffdbdbf1)),
                                shape = RoundedCornerShape(5.dp)
                            )
                    )

                    LazyColumn(
                        contentPadding = PaddingValues(
                            top = 28.dp,
                            bottom = 0.dp,
                            start = 10.dp,
                            end = 10.dp
                        ),
                        verticalArrangement = Arrangement.spacedBy(1.dp)
                    ) {
                        if (getComms.itemCount != 0) {
                            items(count = getComms.itemCount) { index ->
                                val comment = getComms[index]
                                if (comment?.userId == getUser?.id) {
                                    Spacer(modifier = Modifier.padding(5.dp))
                                    Text(
                                        text = "${comment?.text}",
                                        color = Color(0xff423a99),
                                        style = TextStyle(
                                            fontSize = 15.sp,
                                            fontWeight = FontWeight.Bold
                                        ),
                                        modifier = Modifier
                                            .align(alignment = Alignment.TopStart)
                                            .clickable {
                                                navController.navigate(
                                                    BottomBarScreen.ArticlePage.passId(
                                                        comment?.articleId.toString()
                                                    )
                                                )
                                            }
                                    )
                                    Spacer(modifier = Modifier.padding(5.dp))
                                    HorizontalDivider(
                                        thickness = 3.dp,
                                        modifier = Modifier
                                            .border(BorderStroke(3.dp, Color(0xffdbdbf1))),
                                        color = Color(0xffdbdbf1)
                                    )
                                }
                            }
                            getComms.apply {
                                when {
                                    loadState.refresh is LoadState.Loading -> {
                                        item {
                                            CircularProgressIndicator(
                                                modifier = Modifier.fillParentMaxSize(),
                                                color = Color(0xff423a99)
                                            )
                                        }
                                    }

                                    loadState.append is LoadState.Loading -> {
                                        item {
                                            CircularProgressIndicator(
                                                modifier = Modifier.fillParentMaxSize(),
                                                color = Color(0xff423a99)
                                            )
                                        }
                                    }

                                    loadState.refresh is LoadState.Error -> {
                                        val err = getComms.loadState.refresh as LoadState.Error
                                        item { Text(err.error.localizedMessage) }
                                    }

                                    loadState.append is LoadState.Error -> {
                                        val err = getComms.loadState.append as LoadState.Error
                                        item { Text(err.error.localizedMessage) }
                                    }
                                }
                            }
                        } else {
                            item {
                                Text(
                                    text = "Комментариев пока нет!",
                                    color = Color(0xff423a99),
                                    style = TextStyle(
                                        fontSize = 15.sp,
                                        fontWeight = FontWeight.Bold
                                    ),
                                    modifier = Modifier
                                        .align(alignment = Alignment.TopStart)
                                )
                            }
                        }

                    }

                }
                Box(
                    modifier = Modifier
                        .requiredWidth(width = 393.dp)
                        .requiredHeight(height = 54.dp)
                ) {
                    Box(
                        modifier = Modifier
                            .requiredWidth(width = 393.dp)
                            .requiredHeight(height = 54.dp)
                            .clip(shape = RoundedCornerShape(15.dp))
                            .background(color = Color(0xff423a99))
                    )
                    Text(
                        text = "Comments:",
                        color = Color.White,
                        style = TextStyle(
                            fontSize = 17.sp,
                            fontWeight = FontWeight.Bold
                        ),
                        modifier = Modifier
                            .align(alignment = Alignment.TopStart)
                            .offset(
                                x = 24.dp,
                                y = 0.dp
                            )
                            .requiredWidth(width = 210.dp)
                            .requiredHeight(height = 54.dp)
                            .wrapContentHeight(align = Alignment.CenterVertically)
                    )
                }
            }
        }
        item {
            Spacer(modifier = Modifier.padding(10.dp))
            Box(
                modifier = Modifier
                    .offset(
                        x = 9.dp,
                        y = 220.dp
                    )
                    .requiredWidth(width = 393.dp)
                    .requiredHeight(height = 182.dp)
            ) {
                Box(
                    modifier = Modifier
                        .align(alignment = Alignment.TopStart)
                        .offset(
                            x = 0.dp,
                            y = 27.1240234375.dp
                        )
                        .requiredWidth(width = 393.dp)
                        .requiredHeight(height = 155.dp)
                ) {
                    Box(
                        modifier = Modifier
                            .requiredWidth(width = 393.dp)
                            .requiredHeight(height = 155.dp)
                            .clip(shape = RoundedCornerShape(5.dp))
                            .background(color = Color.White)
                            .border(
                                border = BorderStroke(3.dp, Color(0xffdbdbf1)),
                                shape = RoundedCornerShape(5.dp)
                            )
                    )

                    LazyColumn(
                        contentPadding = PaddingValues(
                            top = 28.dp,
                            bottom = 0.dp,
                            start = 10.dp,
                            end = 10.dp
                        ),
                        verticalArrangement = Arrangement.spacedBy(1.dp)
                    ) {
                        if (getArticles.itemCount != 0) {
                            items(count = getArticles.itemCount) { index ->
                                val article = getArticles[index]
                                if (article?.userId == getUser?.id) {
                                    Spacer(modifier = Modifier.padding(5.dp))
                                    Text(
                                        text = "${article?.title}",
                                        color = Color(0xff423a99),
                                        style = TextStyle(
                                            fontSize = 15.sp,
                                            fontWeight = FontWeight.Bold
                                        ),
                                        modifier = Modifier
                                            .align(alignment = Alignment.TopStart)
                                            .clickable {
                                                navController.navigate(
                                                    BottomBarScreen.ArticlePage.passId(
                                                        article?.id.toString()
                                                    )
                                                )
                                            }
                                    )
                                    Spacer(modifier = Modifier.padding(5.dp))
                                    HorizontalDivider(
                                        thickness = 3.dp,
                                        modifier = Modifier
                                            .border(BorderStroke(3.dp, Color(0xffdbdbf1))),
                                        color = Color(0xffdbdbf1)
                                    )
                                }
                            }
                            getArticles.apply {
                                when {
                                    loadState.refresh is LoadState.Loading -> {
                                        item {
                                            CircularProgressIndicator(
                                                modifier = Modifier.fillParentMaxSize(),
                                                color = Color(0xff423a99)
                                            )
                                        }
                                    }

                                    loadState.append is LoadState.Loading -> {
                                        item {
                                            CircularProgressIndicator(
                                                modifier = Modifier.fillParentMaxSize(),
                                                color = Color(0xff423a99)
                                            )
                                        }
                                    }

                                    loadState.refresh is LoadState.Error -> {
                                        val err = getArticles.loadState.refresh as LoadState.Error
                                        item { Text(err.error.localizedMessage) }
                                    }

                                    loadState.append is LoadState.Error -> {
                                        val err = getArticles.loadState.append as LoadState.Error
                                        item { Text(err.error.localizedMessage) }
                                    }
                                }
                            }
                        } else {
                            item {
                                Text(
                                    text = "Статей пока нет!",
                                    color = Color(0xff423a99),
                                    style = TextStyle(
                                        fontSize = 15.sp,
                                        fontWeight = FontWeight.Bold
                                    ),
                                    modifier = Modifier
                                        .align(alignment = Alignment.TopStart)
                                )
                            }
                        }

                    }

                }
                Box(
                    modifier = Modifier
                        .requiredWidth(width = 393.dp)
                        .requiredHeight(height = 54.dp)
                ) {
                    Box(
                        modifier = Modifier
                            .requiredWidth(width = 393.dp)
                            .requiredHeight(height = 54.dp)
                            .clip(shape = RoundedCornerShape(15.dp))
                            .background(color = Color(0xff423a99))
                    )
                    Text(
                        text = "Articles:",
                        color = Color.White,
                        style = TextStyle(
                            fontSize = 17.sp,
                            fontWeight = FontWeight.Bold
                        ),
                        modifier = Modifier
                            .align(alignment = Alignment.TopStart)
                            .offset(
                                x = 24.dp,
                                y = 0.dp
                            )
                            .requiredWidth(width = 210.dp)
                            .requiredHeight(height = 54.dp)
                            .wrapContentHeight(align = Alignment.CenterVertically)
                    )
                }
            }
        }
        item {
            Spacer(modifier = Modifier.padding(10.dp))
            Box(
                modifier = Modifier
                    .offset(
                        x = 9.dp,
                        y = 220.dp
                    )
                    .requiredWidth(width = 393.dp)
                    .requiredHeight(height = 182.dp)
            ) {
                Box(
                    modifier = Modifier
                        .align(alignment = Alignment.TopStart)
                        .offset(
                            x = 0.dp,
                            y = 27.1240234375.dp
                        )
                        .requiredWidth(width = 393.dp)
                        .requiredHeight(height = 155.dp)
                ) {
                    Box(
                        modifier = Modifier
                            .requiredWidth(width = 393.dp)
                            .requiredHeight(height = 155.dp)
                            .clip(shape = RoundedCornerShape(5.dp))
                            .background(color = Color.White)
                            .border(
                                border = BorderStroke(3.dp, Color(0xffdbdbf1)),
                                shape = RoundedCornerShape(5.dp)
                            )
                    )

                    LazyColumn(
                        contentPadding = PaddingValues(
                            top = 28.dp,
                            bottom = 0.dp,
                            start = 10.dp,
                            end = 10.dp
                        ),
                        verticalArrangement = Arrangement.spacedBy(1.dp)
                    ) {
                        if (getTags.itemCount != 0) {
                            items(count = getTags.itemCount) { index ->
                                val tag = getTags[index]
                                if (tag?.userId == getUser?.id) {
                                    Spacer(modifier = Modifier.padding(5.dp))
                                    Text(
                                        text = "${tag?.title}",
                                        color = Color(0xff423a99),
                                        style = TextStyle(
                                            fontSize = 15.sp,
                                            fontWeight = FontWeight.Bold
                                        ),
                                        modifier = Modifier
                                            .align(alignment = Alignment.TopStart)
                                            .clickable {
                                                navController.navigate(
                                                    BottomBarScreen.SearchByTag.passId(
                                                        tag?.id.toString()
                                                    )
                                                )
                                            }
                                    )
                                    Spacer(modifier = Modifier.padding(5.dp))
                                    HorizontalDivider(
                                        thickness = 3.dp,
                                        modifier = Modifier
                                            .border(BorderStroke(3.dp, Color(0xffdbdbf1))),
                                        color = Color(0xffdbdbf1)
                                    )
                                }
                            }
                        } else {
                            item {
                                Text(
                                    text = "Тэгов пока нет!",
                                    color = Color(0xff423a99),
                                    style = TextStyle(
                                        fontSize = 15.sp,
                                        fontWeight = FontWeight.Bold
                                    ),
                                    modifier = Modifier
                                        .align(alignment = Alignment.TopStart)
                                )
                            }
                        }

                    }

                }
                Box(
                    modifier = Modifier
                        .requiredWidth(width = 393.dp)
                        .requiredHeight(height = 54.dp)
                ) {
                    Box(
                        modifier = Modifier
                            .requiredWidth(width = 393.dp)
                            .requiredHeight(height = 54.dp)
                            .clip(shape = RoundedCornerShape(15.dp))
                            .background(color = Color(0xff423a99))
                    )
                    Text(
                        text = "Tags:",
                        color = Color.White,
                        style = TextStyle(
                            fontSize = 17.sp,
                            fontWeight = FontWeight.Bold
                        ),
                        modifier = Modifier
                            .align(alignment = Alignment.TopStart)
                            .offset(
                                x = 24.dp,
                                y = 0.dp
                            )
                            .requiredWidth(width = 210.dp)
                            .requiredHeight(height = 54.dp)
                            .wrapContentHeight(align = Alignment.CenterVertically)
                    )
                }
            }
        }
    }
}

