Skip to content

Commit 3b4677d

Browse files
feat: Fixed lists items height, added pagination, added "view all" item
1 parent 0ca7094 commit 3b4677d

File tree

6 files changed

+130
-10
lines changed

6 files changed

+130
-10
lines changed

core/src/main/java/org/openedx/core/data/api/CourseApi.kt

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -72,6 +72,7 @@ interface CourseApi {
7272
suspend fun getUserCourses(
7373
@Path("username") username: String,
7474
@Query("page") page: Int = 1,
75+
@Query("page_size") pageSize: Int = 9,
7576
@Query("status") status: String? = null,
7677
@Query("requested_fields") fields: List<String> = emptyList()
7778
): CourseEnrollments

dashboard/src/main/java/org/openedx/courses/presentation/AllEnrolledCoursesFragment.kt

Lines changed: 24 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -62,8 +62,10 @@ import androidx.compose.ui.ExperimentalComposeUiApi
6262
import androidx.compose.ui.Modifier
6363
import androidx.compose.ui.graphics.Color
6464
import androidx.compose.ui.layout.ContentScale
65+
import androidx.compose.ui.layout.onSizeChanged
6566
import androidx.compose.ui.platform.ComposeView
6667
import androidx.compose.ui.platform.LocalContext
68+
import androidx.compose.ui.platform.LocalDensity
6769
import androidx.compose.ui.platform.LocalLayoutDirection
6870
import androidx.compose.ui.platform.ViewCompositionStrategy
6971
import androidx.compose.ui.platform.testTag
@@ -327,6 +329,10 @@ private fun AllEnrolledCoursesScreen(
327329
}
328330

329331
is AllEnrolledCoursesUIState.Courses -> {
332+
val density = LocalDensity.current
333+
var itemHeight by rememberSaveable {
334+
mutableStateOf(0f)
335+
}
330336
Box(
331337
modifier = Modifier.fillMaxSize(),
332338
contentAlignment = Alignment.Center
@@ -347,8 +353,12 @@ private fun AllEnrolledCoursesScreen(
347353
content = {
348354
items(state.courses) { course ->
349355
CourseItem(
350-
course,
351-
apiHostUrl,
356+
modifier = Modifier
357+
.onSizeChanged {
358+
itemHeight = it.height.toFloat()
359+
},
360+
course = course,
361+
apiHostUrl = apiHostUrl,
352362
onClick = {
353363
onAction(AllEnrolledCoursesAction.OpenCourse(it))
354364
}
@@ -359,10 +369,12 @@ private fun AllEnrolledCoursesScreen(
359369
Box(
360370
modifier = Modifier
361371
.fillMaxWidth()
362-
.padding(vertical = 16.dp),
372+
.height(with(density) { itemHeight.toDp() }),
363373
contentAlignment = Alignment.Center
364374
) {
365-
CircularProgressIndicator(color = MaterialTheme.appColors.primary)
375+
CircularProgressIndicator(
376+
color = MaterialTheme.appColors.primary
377+
)
366378
}
367379
}
368380
}
@@ -420,13 +432,15 @@ private fun AllEnrolledCoursesScreen(
420432

421433
@Composable
422434
private fun CourseItem(
435+
modifier: Modifier = Modifier,
423436
course: EnrolledCourse,
424437
apiHostUrl: String,
425438
onClick: (EnrolledCourse) -> Unit,
426439
) {
427440
Card(
428-
modifier = Modifier
441+
modifier = modifier
429442
.width(170.dp)
443+
.height(180.dp)
430444
.clickable {
431445
onClick(course)
432446
},
@@ -456,13 +470,17 @@ private fun CourseItem(
456470
color = MaterialTheme.appColors.primary,
457471
backgroundColor = MaterialTheme.appColors.divider
458472
)
473+
459474
Text(
460475
modifier = Modifier
461476
.fillMaxWidth()
462477
.padding(horizontal = 8.dp)
463478
.padding(top = 4.dp),
464479
style = MaterialTheme.appTypography.labelMedium,
465480
color = MaterialTheme.appColors.textFieldHint,
481+
overflow = TextOverflow.Ellipsis,
482+
minLines = 1,
483+
maxLines = 2,
466484
text = stringResource(
467485
R.string.dashboard_course_date,
468486
TimeUtils.getCourseFormattedDate(
@@ -483,7 +501,7 @@ private fun CourseItem(
483501
style = MaterialTheme.appTypography.titleSmall,
484502
color = MaterialTheme.appColors.textDark,
485503
overflow = TextOverflow.Ellipsis,
486-
minLines = 2,
504+
minLines = 1,
487505
maxLines = 2
488506
)
489507
}

dashboard/src/main/java/org/openedx/courses/presentation/UserCoursesScreen.kt

Lines changed: 59 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -288,6 +288,7 @@ private fun SecondaryCourses(
288288
onCourseClick: (EnrolledCourse) -> Unit,
289289
onViewAllClick: () -> Unit
290290
) {
291+
val items = courses.take(5)
291292
Column(
292293
modifier = Modifier
293294
.fillMaxWidth()
@@ -296,7 +297,7 @@ private fun SecondaryCourses(
296297
verticalArrangement = Arrangement.spacedBy(8.dp)
297298
) {
298299
TextIcon(
299-
text = stringResource(R.string.dashboard_view_all, courses.size),
300+
text = stringResource(R.string.dashboard_view_all_with_count, courses.size),
300301
textStyle = MaterialTheme.appTypography.titleSmall,
301302
icon = Icons.Default.ChevronRight,
302303
color = MaterialTheme.appColors.textDark,
@@ -305,13 +306,58 @@ private fun SecondaryCourses(
305306
onClick = onViewAllClick
306307
)
307308
LazyRow {
308-
items(courses) {
309+
items(items) {
309310
CourseListItem(
310311
course = it,
311312
apiHostUrl = apiHostUrl,
312313
onCourseClick = onCourseClick
313314
)
314315
}
316+
item {
317+
ViewAllItem(
318+
onViewAllClick = onViewAllClick
319+
)
320+
}
321+
}
322+
}
323+
}
324+
325+
@Composable
326+
private fun ViewAllItem(
327+
onViewAllClick: () -> Unit
328+
) {
329+
Card(
330+
modifier = Modifier
331+
.width(140.dp)
332+
.height(152.dp)
333+
.padding(4.dp)
334+
.clickable(
335+
onClickLabel = stringResource(id = R.string.dashboard_view_all),
336+
onClick = {
337+
onViewAllClick()
338+
}
339+
),
340+
backgroundColor = MaterialTheme.appColors.cardViewBackground,
341+
shape = MaterialTheme.appShapes.courseImageShape,
342+
elevation = 2.dp,
343+
) {
344+
Column(
345+
modifier = Modifier.fillMaxSize(),
346+
horizontalAlignment = Alignment.CenterHorizontally,
347+
verticalArrangement = Arrangement.Center
348+
) {
349+
Icon(
350+
modifier = Modifier.size(48.dp),
351+
painter = painterResource(id = R.drawable.dashboard_ic_book),
352+
tint = MaterialTheme.appColors.textFieldBorder,
353+
contentDescription = null
354+
)
355+
Spacer(modifier = Modifier.height(12.dp))
356+
Text(
357+
text = stringResource(id = R.string.dashboard_view_all),
358+
style = MaterialTheme.appTypography.titleSmall,
359+
color = MaterialTheme.appColors.textDark
360+
)
315361
}
316362
}
317363
}
@@ -325,6 +371,7 @@ private fun CourseListItem(
325371
Card(
326372
modifier = Modifier
327373
.width(140.dp)
374+
.height(152.dp)
328375
.padding(4.dp)
329376
.clickable {
330377
onCourseClick(course)
@@ -720,3 +767,13 @@ private fun UsersCourseScreenPreview() {
720767
)
721768
}
722769
}
770+
771+
@Preview
772+
@Composable
773+
private fun ViewAllItemPreview() {
774+
OpenEdXTheme {
775+
ViewAllItem(
776+
onViewAllClick = {}
777+
)
778+
}
779+
}

dashboard/src/main/java/org/openedx/learn/presentation/LearnFragment.kt

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -107,7 +107,6 @@ private fun LearnScreen(
107107
backgroundColor = MaterialTheme.appColors.background
108108
) { paddingValues ->
109109

110-
111110
Column(
112111
modifier = Modifier
113112
.padding(paddingValues)
Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
<vector xmlns:android="http://schemas.android.com/apk/res/android"
2+
android:width="97dp"
3+
android:height="96dp"
4+
android:viewportWidth="97"
5+
android:viewportHeight="96">
6+
<group>
7+
<clip-path android:pathData="M0.5,0h96v96h-96z" />
8+
<path
9+
android:pathData="M12.5,76C17.973,72.84 24.181,71.177 30.5,71.177C36.819,71.177 43.027,72.84 48.5,76C53.973,72.84 60.181,71.177 66.5,71.177C72.819,71.177 79.027,72.84 84.5,76"
10+
android:strokeLineJoin="round"
11+
android:strokeWidth="7"
12+
android:fillColor="#00000000"
13+
android:strokeColor="#8E9BAE"
14+
android:strokeLineCap="round" />
15+
<path
16+
android:pathData="M12.5,24C17.973,20.84 24.181,19.177 30.5,19.177C36.819,19.177 43.027,20.84 48.5,24C53.973,20.84 60.181,19.177 66.5,19.177C72.819,19.177 79.027,20.84 84.5,24"
17+
android:strokeLineJoin="round"
18+
android:strokeWidth="7"
19+
android:fillColor="#00000000"
20+
android:strokeColor="#8E9BAE"
21+
android:strokeLineCap="round" />
22+
<path
23+
android:pathData="M12.5,24V76"
24+
android:strokeLineJoin="round"
25+
android:strokeWidth="7"
26+
android:fillColor="#00000000"
27+
android:strokeColor="#8E9BAE"
28+
android:strokeLineCap="round" />
29+
<path
30+
android:pathData="M48.5,24V76"
31+
android:strokeLineJoin="round"
32+
android:strokeWidth="7"
33+
android:fillColor="#00000000"
34+
android:strokeColor="#8E9BAE"
35+
android:strokeLineCap="round" />
36+
<path
37+
android:pathData="M84.5,24V76"
38+
android:strokeLineJoin="round"
39+
android:strokeWidth="7"
40+
android:fillColor="#00000000"
41+
android:strokeColor="#8E9BAE"
42+
android:strokeLineCap="round" />
43+
</group>
44+
</vector>

dashboard/src/main/res/values/strings.xml

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,8 @@
1010
<string name="dashboard_start_course">Start course</string>
1111
<string name="dashboard_resume_course">Resume Course</string>
1212
<string name="dashboard_past_due_assignment">%1$d Past Due Assignment</string>
13-
<string name="dashboard_view_all">View All (%1$d)</string>
13+
<string name="dashboard_view_all_with_count">View All (%1$d)</string>
14+
<string name="dashboard_view_all">View All</string>
1415
<string name="dashboard_assignment_due_in_days">%1$s Due in %2$s</string>
1516
<string name="dashboard_course_filter_all">All</string>
1617
<string name="dashboard_course_filter_in_progress">In Progress</string>

0 commit comments

Comments
 (0)