Skip to content

Commit

Permalink
feat(ui): thêm tìm kiếm trong class và folder
Browse files Browse the repository at this point in the history
- sửa bug giao diện trong study set detail và học viết
  • Loading branch information
nqmgaming committed Dec 15, 2024
1 parent 6cd0038 commit 5aabbe8
Show file tree
Hide file tree
Showing 13 changed files with 194 additions and 28 deletions.
Binary file added app/release/app-release.aab
Binary file not shown.
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,6 @@ import com.ramcosta.composedestinations.navigation.DestinationsNavigator
import com.ramcosta.composedestinations.result.NavResult
import com.ramcosta.composedestinations.result.ResultBackNavigator
import com.ramcosta.composedestinations.result.ResultRecipient
import timber.log.Timber
import com.pwhs.quickmem.R
import com.pwhs.quickmem.presentation.ads.BannerAds

Expand Down Expand Up @@ -443,15 +442,15 @@ fun ClassDetail(
ClassDetailEnums.FOLDERS.index -> FoldersTabScreen(
modifier = Modifier.fillMaxSize(),
onAddFoldersClicked = onNavigateAddFolder,
folder = folders,
folders = folders,
onFolderItemClicked = onFolderItemClicked,
isOwner = isOwner,
onDeleteFolderClicked = onDeleteFolderClick
)

ClassDetailEnums.MEMBERS.index -> MembersTabScreen(
modifier = Modifier.fillMaxSize(),
member = members,
members = members,
onMembersItemClicked = {
onNavigateToUserDetail(it.id)
},
Expand Down
Original file line number Diff line number Diff line change
@@ -1,31 +1,49 @@
package com.pwhs.quickmem.presentation.app.classes.detail.folders

import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material3.MaterialTheme.typography
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment.Companion.CenterHorizontally
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.pwhs.quickmem.R
import com.pwhs.quickmem.domain.model.folder.GetFolderResponseModel
import com.pwhs.quickmem.presentation.app.classes.detail.component.ClassDetailEmptyItems
import com.pwhs.quickmem.presentation.app.library.component.SearchTextField
import com.pwhs.quickmem.presentation.app.library.folder.component.FolderItem
import com.pwhs.quickmem.ui.theme.QuickMemTheme

@Composable
fun FoldersTabScreen(
modifier: Modifier = Modifier,
isOwner: Boolean,
folder: List<GetFolderResponseModel> = emptyList(),
folders: List<GetFolderResponseModel> = emptyList(),
onAddFoldersClicked: () -> Unit = {},
onFolderItemClicked: (GetFolderResponseModel) -> Unit = {},
onDeleteFolderClicked: (String) -> Unit = {}
) {
var searchQuery by remember { mutableStateOf("") }

val filterFolders = folders.filter {
searchQuery.trim().takeIf { query -> query.isNotEmpty() }?.let { query ->
it.title.contains(query, ignoreCase = true)
} != false
}
when {
folder.isEmpty() -> {
folders.isEmpty() -> {
ClassDetailEmptyItems(
modifier = modifier,
title = stringResource(R.string.txt_this_class_has_no_folders),
Expand All @@ -40,7 +58,15 @@ fun FoldersTabScreen(
LazyColumn(
modifier = modifier,
) {
items(items = folder, key = { it.id }) { folders ->
item {
SearchTextField(
modifier = Modifier.padding(horizontal = 16.dp),
searchQuery = searchQuery,
onSearchQueryChange = { searchQuery = it },
placeholder = stringResource(R.string.txt_search_folders),
)
}
items(items = filterFolders, key = { it.id }) { folders ->
FolderItem(
modifier = Modifier.padding(horizontal = 16.dp),
title = folders.title,
Expand All @@ -54,6 +80,22 @@ fun FoldersTabScreen(
isOwner = isOwner
)
}
item {
if (filterFolders.isEmpty() && searchQuery.trim().isNotEmpty()) {
Column(
modifier = Modifier
.fillMaxWidth()
.padding(16.dp),
horizontalAlignment = CenterHorizontally
) {
Text(
text = stringResource(R.string.txt_no_folders_found),
style = typography.bodyLarge,
textAlign = TextAlign.Center
)
}
}
}
item {
Spacer(modifier = Modifier.padding(60.dp))
}
Expand Down
Original file line number Diff line number Diff line change
@@ -1,31 +1,49 @@
package com.pwhs.quickmem.presentation.app.classes.detail.members

import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material3.MaterialTheme.typography
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment.Companion.CenterHorizontally
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.pwhs.quickmem.R
import com.pwhs.quickmem.domain.model.users.ClassMemberModel
import com.pwhs.quickmem.presentation.app.classes.detail.component.ClassDetailEmpty
import com.pwhs.quickmem.presentation.app.classes.detail.members.component.ClassMemberItem
import com.pwhs.quickmem.presentation.app.library.component.SearchTextField
import com.pwhs.quickmem.ui.theme.QuickMemTheme

@Composable
fun MembersTabScreen(
modifier: Modifier = Modifier,
isOwner: Boolean,
member: List<ClassMemberModel> = emptyList(),
members: List<ClassMemberModel> = emptyList(),
onMembersItemClicked: (ClassMemberModel) -> Unit = {},
onAddMembersClicked: () -> Unit = {},
onDeletedClicked: (String) -> Unit = {}
) {
var searchQuery by remember { mutableStateOf("") }

val filterMembers = members.filter {
searchQuery.trim().takeIf { query -> query.isNotEmpty() }?.let { query ->
it.username.contains(query, ignoreCase = true)
} != false
}
when {
member.isEmpty() -> {
members.isEmpty() -> {
ClassDetailEmpty(
modifier = modifier,
title = stringResource(R.string.txt_this_class_has_no_members),
Expand All @@ -40,7 +58,15 @@ fun MembersTabScreen(
LazyColumn(
modifier = modifier,
) {
items(items = member, key = { it.id }) { member ->
item {
SearchTextField(
modifier = Modifier.padding(horizontal = 16.dp),
searchQuery = searchQuery,
onSearchQueryChange = { searchQuery = it },
placeholder = stringResource(R.string.txt_search_folders),
)
}
items(items = filterMembers, key = { it.id }) { member ->
ClassMemberItem(
modifier = Modifier.padding(horizontal = 16.dp),
classMemberModel = member,
Expand All @@ -49,6 +75,22 @@ fun MembersTabScreen(
onDeleteClicked = onDeletedClicked,
)
}
item {
if (filterMembers.isEmpty() && searchQuery.trim().isNotEmpty()) {
Column(
modifier = Modifier
.fillMaxWidth()
.padding(16.dp),
horizontalAlignment = CenterHorizontally
) {
Text(
text = stringResource(R.string.txt_no_members_found),
style = typography.bodyLarge,
textAlign = TextAlign.Center
)
}
}
}
item {
Spacer(modifier = Modifier.padding(60.dp))
}
Expand Down
Original file line number Diff line number Diff line change
@@ -1,17 +1,28 @@
package com.pwhs.quickmem.presentation.app.classes.detail.study_sets

import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material3.MaterialTheme.typography
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment.Companion.CenterHorizontally
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.pwhs.quickmem.R
import com.pwhs.quickmem.domain.model.study_set.GetStudySetResponseModel
import com.pwhs.quickmem.presentation.app.classes.detail.component.ClassDetailEmptyItems
import com.pwhs.quickmem.presentation.app.library.component.SearchTextField
import com.pwhs.quickmem.presentation.app.library.study_set.component.StudySetItem
import com.pwhs.quickmem.ui.theme.QuickMemTheme

Expand All @@ -24,11 +35,18 @@ fun StudySetsTabScreen(
onStudySetItemClicked: (GetStudySetResponseModel) -> Unit = {},
onDeleteStudySetClicked: (String) -> Unit = {}
) {
var searchQuery by remember { mutableStateOf("") }

val filterStudySets = studySets.filter {
searchQuery.trim().takeIf { query -> query.isNotEmpty() }?.let { query ->
it.title.contains(query, ignoreCase = true)
} != false
}
when {
studySets.isEmpty() -> {
ClassDetailEmptyItems(
modifier = modifier,
title = stringResource(R.string.txt_this_class_has_no_sets),
title = stringResource(R.string.txt_this_class_has_no_study_sets),
subtitle = stringResource(R.string.txt_add_flashcard_sets_to_share_them_with_your_class),
buttonTitle = stringResource(R.string.txt_add_study_sets),
onAddClick = onAddStudySetClicked,
Expand All @@ -40,7 +58,15 @@ fun StudySetsTabScreen(
LazyColumn(
modifier = modifier,
) {
items(items = studySets, key = { it.id }) { studySet ->
item {
SearchTextField(
modifier = Modifier.padding(horizontal = 16.dp),
searchQuery = searchQuery,
onSearchQueryChange = { searchQuery = it },
placeholder = stringResource(R.string.txt_search_study_sets),
)
}
items(items = filterStudySets, key = { it.id }) { studySet ->
StudySetItem(
modifier = Modifier.padding(horizontal = 16.dp),
studySet = studySet,
Expand All @@ -51,6 +77,22 @@ fun StudySetsTabScreen(
}
)
}
item {
if (filterStudySets.isEmpty() && searchQuery.trim().isNotEmpty()) {
Column(
modifier = Modifier
.fillMaxWidth()
.padding(16.dp),
horizontalAlignment = CenterHorizontally
) {
Text(
text = stringResource(R.string.txt_no_study_sets_found),
style = typography.bodyLarge,
textAlign = TextAlign.Center
)
}
}
}
item {
Spacer(modifier = Modifier.padding(60.dp))
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -55,9 +55,7 @@ import com.ramcosta.composedestinations.generated.destinations.EditFolderScreenD
import com.ramcosta.composedestinations.generated.destinations.FlipFlashCardScreenDestination
import com.ramcosta.composedestinations.generated.destinations.LearnByQuizScreenDestination
import com.ramcosta.composedestinations.generated.destinations.LearnByTrueFalseScreenDestination
import com.ramcosta.composedestinations.generated.destinations.LearnByTrueFalseScreenDestination.invoke
import com.ramcosta.composedestinations.generated.destinations.LearnByWriteScreenDestination
import com.ramcosta.composedestinations.generated.destinations.LearnByWriteScreenDestination.invoke
import com.ramcosta.composedestinations.generated.destinations.ReportScreenDestination
import com.ramcosta.composedestinations.generated.destinations.StudySetDetailScreenDestination
import com.ramcosta.composedestinations.generated.destinations.UserDetailScreenDestination
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
Expand All @@ -17,6 +18,10 @@ import androidx.compose.material3.MaterialTheme.typography
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment.Companion.CenterHorizontally
import androidx.compose.ui.Alignment.Companion.CenterVertically
import androidx.compose.ui.Modifier
Expand All @@ -30,6 +35,7 @@ import com.pwhs.quickmem.domain.model.color.ColorModel
import com.pwhs.quickmem.domain.model.study_set.GetStudySetResponseModel
import com.pwhs.quickmem.domain.model.subject.SubjectModel
import com.pwhs.quickmem.domain.model.users.UserResponseModel
import com.pwhs.quickmem.presentation.app.library.component.SearchTextField
import com.pwhs.quickmem.presentation.app.library.study_set.component.StudySetItem
import com.pwhs.quickmem.ui.theme.QuickMemTheme

Expand All @@ -41,13 +47,21 @@ fun FolderDetailStudySetList(
onStudySetClick: (String) -> Unit = {},
onAddFlashCardClick: () -> Unit = {},
) {
var searchQuery by remember { mutableStateOf("") }

val filterStudySets = studySets.filter {
searchQuery.trim().takeIf { query -> query.isNotEmpty() }?.let { query ->
it.title.contains(query, ignoreCase = true)
} != false
}
Box(modifier = modifier) {
when {
studySets.isEmpty() -> {
Column(
horizontalAlignment = CenterHorizontally,
verticalArrangement = Arrangement.Center,
modifier = Modifier
.fillMaxWidth()
.padding(top = 100.dp)
) {
Text(
Expand Down Expand Up @@ -89,12 +103,35 @@ fun FolderDetailStudySetList(
LazyColumn(
horizontalAlignment = CenterHorizontally,
) {
items(items = studySets, key = { it.id }) { studySet ->
item {
SearchTextField(
searchQuery = searchQuery,
onSearchQueryChange = { searchQuery = it },
placeholder = stringResource(R.string.txt_search_study_sets),
)
}
items(items = filterStudySets, key = { it.id }) { studySet ->
StudySetItem(
studySet = studySet,
onStudySetClick = { onStudySetClick(studySet.id) }
)
}
item {
if (filterStudySets.isEmpty() && searchQuery.trim().isNotEmpty()) {
Column(
modifier = Modifier
.fillMaxWidth()
.padding(16.dp),
horizontalAlignment = CenterHorizontally
) {
Text(
text = stringResource(R.string.txt_no_study_sets_found),
style = typography.bodyLarge,
textAlign = TextAlign.Center
)
}
}
}
item {
Spacer(modifier = Modifier.padding(60.dp))
}
Expand Down
Loading

0 comments on commit 5aabbe8

Please sign in to comment.