included place-holder text for empty bookmark and history screen

ezechuka · Mar 1, 2022 · a57dadb · a57dadb
1 parent 0cc3345
commit a57dadb
Show file tree

Hide file tree

Showing 2 changed files with 83 additions and 35 deletions.
diff --git a/app/src/main/java/com/javalon/englishwhiz/ui/BookmarkScreen.kt b/app/src/main/java/com/javalon/englishwhiz/ui/BookmarkScreen.kt
@@ -1,12 +1,17 @@
 package com.javalon.englishwhiz.ui
 
+import androidx.compose.foundation.Image
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
+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.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.wrapContentHeight
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.itemsIndexed
@@ -43,38 +48,59 @@ import com.javalon.englishwhiz.ui.theme.cardBGDay
 fun BookmarkScreen(viewModel: BookmarkViewModel, onItemClick: (Int) -> Unit) {
     viewModel.getAllBookmark()
     val bookmarks by remember { mutableStateOf(viewModel.bookmarks) }
-    Column(
-        horizontalAlignment = Alignment.CenterHorizontally,
-        modifier = Modifier.fillMaxSize()
-    ) {
-        Text(
-            text = "Bookmarks",
-            style = MaterialTheme.typography.h6,
-            color = blueText,
-            modifier = Modifier
-                .padding(start = 16.dp, end = 16.dp, top = 16.dp, bottom = 0.dp)
-                .align(Alignment.Start)
-        )
+    Box(modifier = Modifier.fillMaxSize()) {
+        Column(
+            horizontalAlignment = Alignment.CenterHorizontally,
+        ) {
+            Text(
+                text = "Bookmarks",
+                style = MaterialTheme.typography.h6,
+                color = blueText,
+                modifier = Modifier
+                    .padding(start = 16.dp, end = 16.dp, top = 16.dp, bottom = 0.dp)
+                    .align(Alignment.Start)
+            )
 
-        BookmarkList(list = bookmarks.value, onItemClick = onItemClick) {
-            viewModel.deleteBookmark(it)
+            BookmarkList(list = bookmarks.value, onItemClick = onItemClick) {
+                viewModel.deleteBookmark(it)
+            }
+        }
+        if (bookmarks.value.isEmpty()) {
+            Text(
+                text = "Bookmark is empty. Click on the 'save' icon in Home to add to bookmark",
+                style = MaterialTheme.typography.subtitle2,
+                fontWeight = FontWeight.ExtraLight,
+                textAlign = TextAlign.Center,
+                color = blueText,
+                modifier = Modifier.padding(16.dp).align(Alignment.Center)
+            )
         }
     }
+
 }
 
 @ExperimentalUnitApi
 @Composable
-fun BookmarkList(list: List<WordModel>, onItemClick: (Int) -> Unit, onDeleteClick: (WordModel) -> Unit) {
-        LazyColumn(modifier = Modifier.padding(horizontal = 16.dp)) {
-            itemsIndexed(list) { index, item ->
-                BookmarkItem(index, wordModel = item, onItemClick, onDeleteClick)
-            }
+fun BookmarkList(
+    list: List<WordModel>,
+    onItemClick: (Int) -> Unit,
+    onDeleteClick: (WordModel) -> Unit
+) {
+    LazyColumn(modifier = Modifier.padding(horizontal = 16.dp)) {
+        itemsIndexed(list) { index, item ->
+            BookmarkItem(index, wordModel = item, onItemClick, onDeleteClick)
         }
+    }
 }
 
 @ExperimentalUnitApi
 @Composable
-fun BookmarkItem(index: Int, wordModel: WordModel, onItemClick: (Int) -> Unit, onDeleteClick: (WordModel) -> Unit) {
+fun BookmarkItem(
+    index: Int,
+    wordModel: WordModel,
+    onItemClick: (Int) -> Unit,
+    onDeleteClick: (WordModel) -> Unit
+) {
     Card(
         modifier = Modifier
             .fillMaxWidth()

diff --git a/app/src/main/java/com/javalon/englishwhiz/ui/HistoryScreen.kt b/app/src/main/java/com/javalon/englishwhiz/ui/HistoryScreen.kt
@@ -1,7 +1,11 @@
 package com.javalon.englishwhiz.ui
 
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Text
@@ -11,31 +15,49 @@ import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.text.style.TextAlign
 import androidx.compose.ui.unit.ExperimentalUnitApi
 import androidx.compose.ui.unit.dp
+import com.javalon.englishwhiz.R
 import com.javalon.englishwhiz.presentation.HistoryViewModel
 import com.javalon.englishwhiz.ui.theme.blueText
 
 @ExperimentalUnitApi
 @Composable
 fun HistoryScreen(viewModel: HistoryViewModel, onItemClick: (Int) -> Unit) {
     viewModel.getAllHistory()
-    val bookmarks by remember { mutableStateOf(viewModel.history) }
-    Column(
-        horizontalAlignment = Alignment.CenterHorizontally,
-        modifier = Modifier.fillMaxSize()
-    ) {
-        Text(
-            text = "History",
-            style = MaterialTheme.typography.h6,
-            color = blueText,
-            modifier = Modifier
-                .padding(start = 16.dp, end = 16.dp, top = 16.dp, bottom = 0.dp)
-                .align(Alignment.Start)
-        )
+    val history by remember { mutableStateOf(viewModel.history) }
+    Box(modifier = Modifier.fillMaxSize()) {
+        Column(
+            horizontalAlignment = Alignment.CenterHorizontally,
+            modifier = Modifier.fillMaxSize()
+        ) {
+            Text(
+                text = "History",
+                style = MaterialTheme.typography.h6,
+                color = blueText,
+                modifier = Modifier
+                    .padding(start = 16.dp, end = 16.dp, top = 16.dp, bottom = 0.dp)
+                    .align(Alignment.Start)
+            )
 
-        BookmarkList(list = bookmarks.value, onItemClick = onItemClick) {
-            viewModel.deleteHistory(it)
+            BookmarkList(list = history.value, onItemClick = onItemClick) {
+                viewModel.deleteHistory(it)
+            }
+        }
+
+        if (history.value.isEmpty()) {
+            Text(
+                text = "History is empty. Your search history will appear here",
+                style = MaterialTheme.typography.subtitle2,
+                fontWeight = FontWeight.ExtraLight,
+                textAlign = TextAlign.Center,
+                color = blueText,
+                modifier = Modifier.padding(16.dp).align(Alignment.Center)
+            )
         }
     }
+
 }