CompetitionDetailsScreenNew.kt

@ExperimentalLayout
@ExperimentalFoundationApi
@Composable
fun CompetitionDetailsScreenNew() {
    val navigator = LocalNavigator.current
    val isLandScape = LocalIsLandScape.current
    val dashboardViewModel: DashboardViewModel = viewModel()
    val viewModel: CompetitionDetailsViewModel = viewModel()
    val scrollState = rememberLazyListState()
    val competionMatchesList = dashboardViewModel.competionMatchesList.collectAsLazyPagingItems()
    val competionTeamList = dashboardViewModel.competionClubsList.collectAsLazyPagingItems()
    val indicator = @Composable { tabPositions: List<TabPosition> ->
        HomeCategoryTabIndicator(
            Modifier.tabIndicatorOffset(tabPositions[viewModel.selectedIndex])
        )
    }

    BoxWithConstraints(Modifier.fillMaxSize()) {
        val collapseRange = viewModel.topBannerSize.toFloat()
        val remainingHeight = maxHeight - with(LocalDensity.current) { viewModel.topBannerSize.toDp() }
        val collapseFraction =
            (scrollState.firstVisibleItemScrollOffset / collapseRange).coerceIn(0f, 1f)
        val refreshItem = when (viewModel.selectedCategory) {
            DetailCategory.GAME -> competionMatchesList
            DetailCategory.TABLE -> competionMatchesList
            DetailCategory.TYMY -> competionTeamList
        }
        SwipeToRefreshComposeLayout(items = refreshItem, onRefresh = {
            refreshItem.refresh()
        }, content = {
            LazyColumn(
                state = scrollState,
                modifier = Modifier.fillMaxSize()
            ) {
                item(key = "competition_details_screen_header") {
                    LogCompositions("CompetitionDetailsScreenNew header")
                    Card(
                        modifier = Modifier
                            .fillMaxWidth()
                            .onSizeChanged {
                                viewModel.topBannerSize = it.height
                            },
                        elevation = 8.dp,
                        backgroundColor = Color.Yellow
                    ) {
                        Column(
                            modifier = Modifier.fillMaxSize(),
                            horizontalAlignment = Alignment.CenterHorizontally
                        ) {

                            FacrTopAppBar(isBackButtonVisible = true,
                                isTittleVisible = true,
                                isTralingItemVisible = false,
                                title = "PARDUBICKY KRAJ",
                                onBackClicked = {
                                    navigator.back()
                                })

                            Box(
                                modifier = Modifier
                                    .fillMaxWidth()
                                    .background(color = MaterialTheme.colors.primary)
                                    .padding(
                                        start = Constants.Padding24dp,
                                        end = Constants.Padding24dp,
                                        top = Constants.Padding8dp,
                                        bottom = Constants.Padding24dp
                                    )
                            ) {
                                Text(
                                    text = dashboardViewModel.selectedCompetitionTitle.value,
                                    style = facrHeading().copy(
                                        color = MaterialTheme.colors.onPrimary,
                                        textAlign = TextAlign.Center
                                    ),
                                    modifier = Modifier
                                        .align(Alignment.Center)
                                )
                            }

                            TabRow(
                                selectedTabIndex = viewModel.selectedIndex,
                                indicator = indicator,
                                modifier = Modifier.fillMaxWidth()
                            ) {
                                viewModel.categories.forEachIndexed { index, detailCategory ->
                                    Tab(selected = index == viewModel.selectedIndex, onClick = {
                                        viewModel.onSelectedCategory(detailCategory = detailCategory)
                                    }) {
                                        Text(
                                            modifier = Modifier.padding(bottom = Constants.Padding8dp),
                                            text = when (detailCategory) {
                                                DetailCategory.GAME -> stringResource(R.string.Competitions_matches)
                                                DetailCategory.TABLE -> stringResource(R.string.Competitions_table)
                                                DetailCategory.TYMY -> stringResource(R.string.Competitions_teams)
                                            },
                                            style = if (viewModel.selectedCategory == detailCategory) {
                                                facrBold16BodyText().copy(color = MaterialTheme.colors.onPrimary)
                                            } else {
                                                facrNormal16SubTitleText().copy(color = MaterialTheme.colors.onPrimary)
                                            }
                                        )
                                    }
                                }
                            }
                        }
                    }

                }

                when (viewModel.selectedCategory) {
                    DetailCategory.GAME ->
                        GameDetailNew(
                            matches = competionMatchesList,
                            isLandScape = isLandScape,
                            remainingSpace = remainingHeight,
                            navigateToMatchDetails = {
                                navigator.navigate(Destination.MatchDetailScreen)
                            })
                    DetailCategory.TABLE -> {
                        TableDetailNew()
                    }
                    DetailCategory.TYMY -> {
                        CompetitionsTeamListNew(
                            teams = competionTeamList,
                            isLandScape = isLandScape,
                            remainingSpace = remainingHeight,
                            navigateToMatchDetails = {
                            })
                    }
                }

            }
        })

        Card(
            modifier = Modifier
                .fillMaxWidth()
                .graphicsLayer {
                    alpha =
                        if (collapseFraction == 1f || scrollState.firstVisibleItemIndex > 0) 1f else 0f
                },
            elevation = 8.dp,
            backgroundColor = Color.Yellow
        ) {
            Column(
                modifier = Modifier.fillMaxWidth(),
                horizontalAlignment = Alignment.CenterHorizontally
            ) {

                FacrTopAppBar(isBackButtonVisible = true,
                    isTittleVisible = true,
                    isTralingItemVisible = false,
                    title = "PARDUBICKY KRAJ",
                    onBackClicked = {
                        navigator.back()
                    })

                TabRow(
                    selectedTabIndex = viewModel.selectedIndex,
                    indicator = indicator,
                    modifier = Modifier
                        .fillMaxWidth()
                        .background(color = Color.Red)
                ) {
                    viewModel.categories.forEachIndexed { index, detailCategory ->
                        Tab(selected = index == viewModel.selectedIndex, onClick = {
                            viewModel.onSelectedCategory(detailCategory = detailCategory)
                        }) {
                            Text(
                                modifier = Modifier.padding(bottom = Constants.Padding8dp),
                                text = when (detailCategory) {
                                    DetailCategory.GAME -> stringResource(R.string.Competitions_matches)
                                    DetailCategory.TABLE -> stringResource(R.string.Competitions_table)
                                    DetailCategory.TYMY -> stringResource(R.string.Competitions_teams)
                                },
                                style = if (viewModel.selectedCategory == detailCategory) {
                                    facrBold16BodyText().copy(color = MaterialTheme.colors.onPrimary)
                                } else {
                                    facrNormal16SubTitleText().copy(color = MaterialTheme.colors.onPrimary)
                                }
                            )
                        }
                    }
                }
            }
        }
    }


}