Improve downloads extra info and side menu item

presentation/src/desktopMain/kotlin/ca/gosyer/ui/main/components/DownloadsExtraInfo.kt

@@ -19,6 +19,7 @@ import androidx.compose.runtime.remember
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.dp
 import ca.gosyer.data.base.WebsocketService
+import ca.gosyer.data.download.model.DownloaderStatus
 import ca.gosyer.i18n.MR
 import ca.gosyer.ui.downloads.DownloadsScreenViewModel
 import ca.gosyer.uicore.resources.stringResource
@@ -28,13 +29,19 @@ import ca.gosyer.uicore.vm.LocalViewModelFactory
 fun DownloadsExtraInfo() {
     val vmFactory = LocalViewModelFactory.current
     val vm = remember { vmFactory.instantiate<DownloadsScreenViewModel>(true) }
-    val status by vm.serviceStatus.collectAsState()
+    val serviceStatus by vm.serviceStatus.collectAsState()
+    val downloaderStatus by vm.downloaderStatus.collectAsState()
     val list by vm.downloadQueue.collectAsState()
-    val text = when (status) {
+    val text = when (serviceStatus) {
         WebsocketService.Status.STARTING -> stringResource(MR.strings.downloads_loading)
         WebsocketService.Status.RUNNING -> {
             if (list.isNotEmpty()) {
-                stringResource(MR.strings.downloads_remaining, list.size)
+                val remainingDownloads = stringResource(MR.strings.downloads_remaining, list.size)
+                if (downloaderStatus == DownloaderStatus.Stopped) {
+                    stringResource(MR.strings.downloads_paused) + "  •  " + remainingDownloads
+                } else {
+                    remainingDownloads
+                }
             } else null
         }
         WebsocketService.Status.STOPPED -> null
@@ -45,7 +52,7 @@ fun DownloadsExtraInfo() {
             style = MaterialTheme.typography.body2,
             color = LocalContentColor.current.copy(alpha = ContentAlpha.disabled)
         )
-    } else if (status == WebsocketService.Status.STOPPED) {
+    } else if (serviceStatus == WebsocketService.Status.STOPPED) {
         Surface(onClick = vm::restartDownloader, shape = RoundedCornerShape(4.dp)) {
             Text(
                 stringResource(MR.strings.downloads_stopped),

presentation/src/desktopMain/kotlin/ca/gosyer/ui/main/components/SideMenuItem.kt

@@ -6,32 +6,31 @@
 
 package ca.gosyer.ui.main.components
 
-import androidx.compose.foundation.Image
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.defaultMinSize
 import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.Card
+import androidx.compose.material.Icon
 import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.graphics.ColorFilter
 import androidx.compose.ui.graphics.vector.ImageVector
 import androidx.compose.ui.unit.dp
-import ca.gosyer.ui.main.TopLevelMenus
+import ca.gosyer.ui.main.Menu
 import ca.gosyer.uicore.components.combinedMouseClickable
 import ca.gosyer.uicore.resources.stringResource
 import cafe.adriel.voyager.core.screen.Screen
 
 @Composable
-fun SideMenuItem(selected: Boolean, topLevelMenu: TopLevelMenus, newRoot: (Screen) -> Unit) {
+fun SideMenuItem(selected: Boolean, topLevelMenu: Menu, newRoot: (Screen) -> Unit) {
     SideMenuItem(
         selected,
         stringResource(topLevelMenu.textKey),
@@ -51,7 +50,7 @@ private fun SideMenuItem(
     createScreen: () -> Screen,
     selectedIcon: ImageVector,
     unselectedIcon: ImageVector,
-    onMiddleClick: () -> Unit,
+    onMiddleClick: (() -> Unit)?,
     extraInfo: (@Composable () -> Unit)? = null,
     onClick: (Screen) -> Unit
 ) {
@@ -68,22 +67,22 @@ private fun SideMenuItem(
         Row(
             verticalAlignment = Alignment.CenterVertically,
             modifier = Modifier.fillMaxWidth()
-                .height(40.dp)
+                .defaultMinSize(minHeight = 40.dp)
                 .combinedMouseClickable(
                     onClick = { onClick(createScreen()) },
-                    onMiddleClick = { onMiddleClick() }
+                    onMiddleClick = { onMiddleClick?.invoke() }
                 )
         ) {
             Spacer(Modifier.width(16.dp))
-            Image(
-                if (selected) {
+            Icon(
+                imageVector = if (selected) {
                     selectedIcon
                 } else {
                     unselectedIcon
                 },
-                text,
-                Modifier.size(20.dp),
-                colorFilter = ColorFilter.tint(MaterialTheme.colors.onSurface)
+                contentDescription = text,
+                modifier = Modifier.size(20.dp),
+                tint = MaterialTheme.colors.onSurface
             )
             Spacer(Modifier.width(16.dp))
             Column {