Not sure if thats the best way to do this, there i...
# compose
j
Not sure if thats the best way to do this, there is a bit of a lag when changing "showPastExams":
Copy code
val exams = examDataSource.getExamsAsFlow()
val isLoading = MutableStateFlow(false)
val showPastExams = MutableStateFlow(false)
val filteredExams = exams.combine(showPastExams) { exams, showPastExams ->
    val currentDate = Clock.System.now().toLocalDateTime(TimeZone.currentSystemDefault()).date
    exams.filter { it.date > currentDate || showPastExams }.sortedBy { it.date }
}
(This is in a ViewModel, using
collectAsState
in my Screen and LazyVerticalGrid)
This is the Screen:
Copy code
Column(
    modifier = Modifier.fillMaxSize()
) {
   // TopBar(showPastExams = showPastExams, onShowPastExamsChange = { examVm.showPastExams.value = !showPastExams })
    LazyVerticalGrid(GridCells.Adaptive(128.dp), modifier = Modifier
        .fillMaxSize()
        .weight(1f)) {
        items(filteredExams, { it.id }) {
            ExamCard(
                exam = it,
                onClick = { detailExamId = it.id },
                modifier = Modifier
                    .size(128.dp)
                    .padding(8.dp)
                    .animateItemPlacement()
            )
        }
    }
    BottomBar(
        showPastExams = showPastExams,
        onShowPastExamsChange = { examVm.showPastExams.value = !showPastExams },
        create = { createExamScreen = true }
    )
}
(Also short spike when changing to it)
m
Copy code
filteredExams
is a flow. how can items block accept and flow. code is missing
j
oh right thats just that:
Copy code
val exams by examVm.exams.collectAsState(emptyList())
val showPastExams by examVm.showPastExams.collectAsState()
val filteredExams by examVm.filteredExams.collectAsState(emptyList())
That is the whole screen. When "showPastExams" is true then is lags for a short time when switching to the screen. Note: I changed the screen a bit:
Copy code
@OptIn(ExperimentalFoundationApi::class)
@Composable
fun ExamScreen(
    examVm: ExamViewModel = getViewModel(),
    authVm: AuthenticationViewModel = getViewModel(),
    navController: NavController
) {
    val exams by examVm.exams.collectAsState()
    val showPastExams by examVm.showPastExams.collectAsState()
    val filteredExams by examVm.filteredExams.collectAsState()
    
    val isLoading by examVm.isLoading.collectAsState()
    val swipeRefreshState = rememberSwipeRefreshState(isLoading)

    val username by authVm.schoolUsername.collectAsState("")
    val password by authVm.schoolPassword.collectAsState("")

    val selectedExams = remember { mutableStateListOf<Exam>() }
    if(username.isBlank() || password.isBlank()) {
        SchoolLoginDialog(login = { username, password ->
            authVm.setSchoolCredentials(username, password)
        })
    } else {
        SwipeRefresh(
            modifier = Modifier.fillMaxSize(),
            state = swipeRefreshState,
            onRefresh = { examVm.refreshExams(username, password) },
            indicator = { state, refreshTrigger ->
                SwipeRefreshIndicator(
                    state = state,
                    refreshTriggerDistance = refreshTrigger,
                    backgroundColor = MaterialTheme.colorScheme.surface,
                    contentColor = MaterialTheme.colorScheme.onSurface
                )
            }
        ) {
            Column(
                modifier = Modifier.fillMaxSize()
            ) {
                // TopBar(showPastExams = showPastExams, onShowPastExamsChange = { examVm.showPastExams.value = !showPastExams })
                LazyVerticalGrid(GridCells.Adaptive(128.dp), modifier = Modifier
                    .fillMaxSize()
                    .weight(1f)) {
                    items(filteredExams, { it.id }) {
                        ExamCard(
                            exam = it,
                            selected = it in selectedExams,
                            showSelection = selectedExams.isNotEmpty(),
                            modifier = Modifier
                                .size(128.dp)
                                .padding(8.dp)
                                .combinedClickable(
                                    onLongClick = {
                                        if (it in selectedExams) selectedExams.remove(it) else selectedExams.add(
                                            it
                                        )
                                    },
                                    onClick = {
                                        if (selectedExams.isNotEmpty()) {
                                            if (it in selectedExams) selectedExams.remove(it) else selectedExams.add(
                                                it
                                            )
                                        } else {
                                            navController.navigate("exams/${it.id}")
                                        }
                                    }
                                )
                                .animateItemPlacement()
                        )
                    }
                }
                BottomBar(
                    showPastExams = showPastExams,
                    onShowPastExamsChange = { examVm.showPastExams.value = !showPastExams },
                    create = { navController.navigate("exams/create") }
                )
            }
        }

    }
}


@Composable
private fun ColumnScope.BottomBar(showPastExams: Boolean, onShowPastExamsChange: (Boolean) -> Unit, create: () -> Unit) {
    Row(
        verticalAlignment = Alignment.CenterVertically,
        horizontalArrangement = Arrangement.Start,
        modifier = Modifier
            .fillMaxWidth()
            .padding(16.dp)
    ) {
        Switch(checked = showPastExams, onCheckedChange = onShowPastExamsChange)
        Spacer(modifier = Modifier.size(12.dp))
        Text(stringResource(R.string.past_exams), modifier = Modifier.weight(1f))
        ExtendedFloatingActionButton(onClick = create) {
            Icon(EditIcon, contentDescription = null)
            Spacer(modifier = Modifier.padding(8.dp))
            Text(stringResource(R.string.create))
        }
    }
}