Skip to content

feat: [FC-0078] AllEnrolledCoursesView and DashboardGalleryView tablet layout paddings #433

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
volodymyr-chekyrta merged 1 commit into from
Apr 9, 2025
Merged

feat: [FC-0078] AllEnrolledCoursesView and DashboardGalleryView tablet layout paddings #433

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
84 changes: 44 additions & 40 deletions dashboard/src/main/java/org/openedx/courses/presentation/AllEnrolledCoursesView.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -230,7 +230,7 @@ private fun AllEnrolledCoursesView(
val contentWidth by remember(key1 = windowSize) {
mutableStateOf(
windowSize.windowSizeValue(
expanded = Modifier.widthIn(Dp.Unspecified, 650.dp),
expanded = Modifier.widthIn(Dp.Unspecified, 560.dp),
compact = Modifier.fillMaxWidth(),
)
)
Expand Down Expand Up @@ -274,7 +274,9 @@ private fun AllEnrolledCoursesView(
Header(
modifier = Modifier
.padding(
start = contentPaddings.calculateStartPadding(layoutDirection),
start = contentPaddings.calculateStartPadding(
layoutDirection
),
end = contentPaddings.calculateEndPadding(layoutDirection)
),
onSearchClick = {
Expand Down Expand Up @@ -305,50 +307,52 @@ private fun AllEnrolledCoursesView(

!state.courses.isNullOrEmpty() -> {
Box(
modifier = Modifier
.fillMaxSize()
.padding(contentPaddings),
contentAlignment = Alignment.Center
modifier = Modifier.fillMaxSize(),
contentAlignment = Alignment.TopCenter
) {
Column(
modifier = Modifier.fillMaxWidth(),
horizontalAlignment = Alignment.CenterHorizontally
) {
LazyVerticalGrid(
modifier = Modifier
.fillMaxHeight(),
state = scrollState,
columns = GridCells.Fixed(columns),
verticalArrangement = Arrangement.spacedBy(12.dp),
horizontalArrangement = Arrangement.spacedBy(12.dp),
content = {
items(state.courses) { course ->
CourseItem(
course = course,
apiHostUrl = apiHostUrl,
onClick = {
onAction(AllEnrolledCoursesAction.OpenCourse(it))
}
)
}
item(span = { GridItemSpan(columns) }) {
if (state.canLoadMore) {
Box(
modifier = Modifier
.fillMaxWidth()
.height(180.dp),
contentAlignment = Alignment.Center
) {
CircularProgressIndicator(
color = MaterialTheme.appColors.primary
LazyVerticalGrid(
modifier = Modifier
.fillMaxHeight(),
state = scrollState,
columns = GridCells.Fixed(columns),
verticalArrangement = Arrangement.spacedBy(12.dp),
horizontalArrangement = Arrangement.spacedBy(12.dp),
contentPadding = contentPaddings,
content = {
items(state.courses) { course ->
CourseItem(
course = course,
apiHostUrl = apiHostUrl,
onClick = {
onAction(
AllEnrolledCoursesAction.OpenCourse(
it
)
}
)
}
)
}
item(span = { GridItemSpan(columns) }) {
if (state.canLoadMore) {
Box(
modifier = Modifier
.fillMaxWidth()
.height(180.dp),
contentAlignment = Alignment.Center
) {
CircularProgressIndicator(
color = MaterialTheme.appColors.primary
)
}
}
}
}
)
if (scrollState.shouldLoadMore(
firstVisibleIndex,
LOAD_MORE_THRESHOLD
)
}
if (scrollState.shouldLoadMore(firstVisibleIndex, LOAD_MORE_THRESHOLD)) {
) {
onAction(AllEnrolledCoursesAction.EndOfPage)
}
}
Expand Down
145 changes: 86 additions & 59 deletions dashboard/src/main/java/org/openedx/courses/presentation/DashboardGalleryView.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,7 @@ import androidx.compose.foundation.layout.heightIn
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.layout.widthIn
import androidx.compose.foundation.lazy.grid.GridCells
import androidx.compose.foundation.lazy.grid.LazyHorizontalGrid
import androidx.compose.foundation.lazy.grid.items
Expand Down Expand Up @@ -46,6 +47,7 @@ import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.saveable.rememberSaveable
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
Expand Down Expand Up @@ -103,6 +105,7 @@ import org.openedx.dashboard.R
import org.openedx.foundation.extension.toImageLink
import org.openedx.foundation.presentation.UIMessage
import org.openedx.foundation.presentation.rememberWindowSize
import org.openedx.foundation.presentation.windowSizeValue
import java.util.Date
import org.openedx.core.R as CoreR

Expand Down Expand Up @@ -184,6 +187,7 @@ private fun DashboardGalleryView(
onAction: (DashboardGalleryScreenAction) -> Unit,
hasInternetConnection: Boolean
) {
val windowSize = rememberWindowSize()
val scaffoldState = rememberScaffoldState()
val pullRefreshState = rememberPullRefreshState(
refreshing = updating,
Expand All @@ -193,6 +197,24 @@ private fun DashboardGalleryView(
mutableStateOf(false)
}

val contentWidth by remember(key1 = windowSize) {
mutableStateOf(
windowSize.windowSizeValue(
expanded = Modifier.widthIn(Dp.Unspecified, 560.dp),
compact = Modifier.fillMaxWidth(),
)
)
}

val contentPadding by remember(key1 = windowSize) {
mutableStateOf(
windowSize.windowSizeValue(
expanded = PaddingValues(0.dp),
compact = PaddingValues(horizontal = 16.dp)
)
)
}

Scaffold(
scaffoldState = scaffoldState,
modifier = Modifier.fillMaxSize(),
Expand All @@ -209,64 +231,66 @@ private fun DashboardGalleryView(
color = MaterialTheme.appColors.background
) {
Box(
Modifier.fillMaxSize()
Modifier
.fillMaxSize()
.pullRefresh(pullRefreshState)
.verticalScroll(rememberScrollState()),
) {
Box(
Modifier
.fillMaxSize()
.pullRefresh(pullRefreshState)
.verticalScroll(rememberScrollState()),
) {
when (uiState) {
is DashboardGalleryUIState.Loading -> {
CircularProgressIndicator(
modifier = Modifier.align(Alignment.Center),
color = MaterialTheme.appColors.primary
)
}

is DashboardGalleryUIState.Courses -> {
UserCourses(
modifier = Modifier.fillMaxSize(),
userCourses = uiState.userCourses,
useRelativeDates = uiState.useRelativeDates,
apiHostUrl = apiHostUrl,
openCourse = {
onAction(DashboardGalleryScreenAction.OpenCourse(it))
},
onViewAllClick = {
onAction(DashboardGalleryScreenAction.ViewAll)
},
navigateToDates = {
onAction(DashboardGalleryScreenAction.NavigateToDates(it))
},
resumeBlockId = { course, blockId ->
onAction(DashboardGalleryScreenAction.OpenBlock(course, blockId))
}
)
}
when (uiState) {
is DashboardGalleryUIState.Loading -> {
CircularProgressIndicator(
modifier = Modifier.align(Alignment.Center),
color = MaterialTheme.appColors.primary
)
}

is DashboardGalleryUIState.Empty -> {
NoCoursesInfo(
modifier = Modifier
.align(Alignment.Center)
)
FindACourseButton(
modifier = Modifier
.align(Alignment.BottomCenter),
findACourseClick = {
onAction(DashboardGalleryScreenAction.NavigateToDiscovery)
}
)
}
is DashboardGalleryUIState.Courses -> {
UserCourses(
modifier = contentWidth
.fillMaxHeight()
.padding(vertical = 12.dp)
.displayCutoutForLandscape()
.align(Alignment.TopCenter),
contentPadding = contentPadding,
userCourses = uiState.userCourses,
useRelativeDates = uiState.useRelativeDates,
apiHostUrl = apiHostUrl,
openCourse = {
onAction(DashboardGalleryScreenAction.OpenCourse(it))
},
onViewAllClick = {
onAction(DashboardGalleryScreenAction.ViewAll)
},
navigateToDates = {
onAction(DashboardGalleryScreenAction.NavigateToDates(it))
},
resumeBlockId = { course, blockId ->
onAction(DashboardGalleryScreenAction.OpenBlock(course, blockId))
}
)
}

PullRefreshIndicator(
updating,
pullRefreshState,
Modifier.align(Alignment.TopCenter)
)
is DashboardGalleryUIState.Empty -> {
NoCoursesInfo(
modifier = Modifier
.align(Alignment.Center)
)
FindACourseButton(
modifier = Modifier
.align(Alignment.BottomCenter),
findACourseClick = {
onAction(DashboardGalleryScreenAction.NavigateToDiscovery)
}
)
}
}

PullRefreshIndicator(
updating,
pullRefreshState,
Modifier.align(Alignment.TopCenter)
)

if (!isInternetConnectionShown && !hasInternetConnection) {
OfflineModeDialog(
Modifier
Expand All @@ -290,6 +314,7 @@ private fun DashboardGalleryView(
private fun UserCourses(
modifier: Modifier = Modifier,
userCourses: CourseEnrollments,
contentPadding: PaddingValues,
apiHostUrl: String,
useRelativeDates: Boolean,
openCourse: (EnrolledCourse) -> Unit,
Expand All @@ -299,11 +324,11 @@ private fun UserCourses(
) {
Column(
modifier = modifier
.padding(vertical = 12.dp)
) {
val primaryCourse = userCourses.primary
if (primaryCourse != null) {
PrimaryCourseCard(
modifier = Modifier.padding(contentPadding),
primaryCourse = primaryCourse,
apiHostUrl = apiHostUrl,
navigateToDates = navigateToDates,
Expand All @@ -317,6 +342,7 @@ private fun UserCourses(
courses = userCourses.enrollments.courses,
hasNextPage = userCourses.enrollments.pagination.next.isNotEmpty(),
apiHostUrl = apiHostUrl,
contentPadding = contentPadding,
onCourseClick = openCourse,
onViewAllClick = onViewAllClick
)
Expand All @@ -329,6 +355,7 @@ private fun SecondaryCourses(
courses: List<EnrolledCourse>,
hasNextPage: Boolean,
apiHostUrl: String,
contentPadding: PaddingValues,
onCourseClick: (EnrolledCourse) -> Unit,
onViewAllClick: () -> Unit
) {
Expand All @@ -348,7 +375,7 @@ private fun SecondaryCourses(
verticalArrangement = Arrangement.spacedBy(8.dp)
) {
TextIcon(
modifier = Modifier.padding(horizontal = 18.dp),
modifier = Modifier.padding(contentPadding),
text = stringResource(R.string.dashboard_view_all_with_count, courses.size + 1),
textStyle = MaterialTheme.appTypography.titleSmall,
icon = Icons.AutoMirrored.Filled.KeyboardArrowRight,
Expand All @@ -361,7 +388,7 @@ private fun SecondaryCourses(
.fillMaxSize()
.height(height),
rows = GridCells.Fixed(rows),
contentPadding = PaddingValues(horizontal = 18.dp),
contentPadding = contentPadding,
content = {
items(items) {
CourseListItem(
Expand Down Expand Up @@ -526,6 +553,7 @@ private fun AssignmentItem(

@Composable
private fun PrimaryCourseCard(
modifier: Modifier = Modifier,
primaryCourse: EnrolledCourse,
apiHostUrl: String,
useRelativeDates: Boolean,
Expand All @@ -535,8 +563,7 @@ private fun PrimaryCourseCard(
) {
val orientation = LocalConfiguration.current.orientation
Card(
modifier = Modifier
.padding(horizontal = 16.dp)
modifier = modifier
.fillMaxWidth()
.padding(2.dp),
backgroundColor = MaterialTheme.appColors.background,
Expand Down Expand Up @@ -709,7 +736,7 @@ private fun PrimaryCourseCaption(
)
val progress: Float = try {
primaryCourse.progress.assignmentsCompleted.toFloat() /
primaryCourse.progress.totalAssignmentsCount.toFloat()
primaryCourse.progress.totalAssignmentsCount.toFloat()
} catch (_: ArithmeticException) {
0f
}
Expand Down
3 changes: 1 addition & 2 deletions downloads/src/main/java/org/openedx/downloads/presentation/download/DownloadsViewModel.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.School
import androidx.fragment.app.FragmentManager
import androidx.lifecycle.viewModelScope
import kotlinx.coroutines.Dispatchers
import kotlinx.coroutines.Job
import kotlinx.coroutines.flow.MutableSharedFlow
import kotlinx.coroutines.flow.MutableStateFlow
Expand Down Expand Up @@ -171,7 +170,7 @@ class DownloadsViewModel(
}

private fun fetchDownloads(refresh: Boolean) {
viewModelScope.launch(Dispatchers.IO) {
viewModelScope.launch {
updateLoadingState(isLoading = !refresh, isRefreshing = refresh)
interactor.getDownloadCoursesPreview(refresh)
.onCompletion {
Expand Down
1 change: 1 addition & 0 deletions downloads/src/test/java/org/openedx/downloads/DownloadsViewModelTest.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -265,6 +265,7 @@ class DownloadsViewModelTest {
workerController,
downloadHelper
)
advanceUntilIdle()
val fragmentManager = mockk<FragmentManager>(relaxed = true)
viewModel.downloadCourse(fragmentManager, "course1")
advanceUntilIdle()
Expand Down