feat: Add a storage viewer

app/src/main/java/eu/kanade/presentation/components/SettingsItems.kt

@@ -60,7 +60,10 @@ fun TriStateItem(
                 },
             )
             .fillMaxWidth()
-            .padding(horizontal = SettingsItemsPaddings.Horizontal, vertical = SettingsItemsPaddings.Vertical),
+            .padding(
+                horizontal = SettingsItemsPaddings.Horizontal,
+                vertical = SettingsItemsPaddings.Vertical,
+            ),
         verticalAlignment = Alignment.CenterVertically,
         horizontalArrangement = Arrangement.spacedBy(24.dp),
     ) {
@@ -91,25 +94,31 @@ fun TriStateItem(
 }
 
 @Composable
-fun SelectItem(
+fun <T> SelectItem(
     label: String,
-    options: Array<out Any?>,
+    options: Array<T>,
     selectedIndex: Int,
+    modifier: Modifier = Modifier,
     onSelect: (Int) -> Unit,
+    toString: (T) -> String = { it.toString() },
 ) {
     var expanded by remember { mutableStateOf(false) }
 
     ExposedDropdownMenuBox(
+        modifier = modifier,
         expanded = expanded,
         onExpandedChange = { expanded = !expanded },
     ) {
         OutlinedTextField(
             modifier = Modifier
                 .menuAnchor()
                 .fillMaxWidth()
-                .padding(horizontal = SettingsItemsPaddings.Horizontal, vertical = SettingsItemsPaddings.Vertical),
+                .padding(
+                    horizontal = SettingsItemsPaddings.Horizontal,
+                    vertical = SettingsItemsPaddings.Vertical,
+                ),
             label = { Text(text = label) },
-            value = options[selectedIndex].toString(),
+            value = toString(options[selectedIndex]),
             onValueChange = {},
             readOnly = true,
             singleLine = true,
@@ -126,9 +135,9 @@ fun SelectItem(
             expanded = expanded,
             onDismissRequest = { expanded = false },
         ) {
-            options.forEachIndexed { index, text ->
+            options.forEachIndexed { index, option ->
                 DropdownMenuItem(
-                    text = { Text(text.toString()) },
+                    text = { Text(toString(option)) },
                     onClick = {
                         onSelect(index)
                         expanded = false

app/src/main/java/eu/kanade/presentation/more/MoreScreen.kt

@@ -19,6 +19,7 @@ import androidx.compose.material.icons.outlined.Label
 import androidx.compose.material.icons.outlined.QueryStats
 import androidx.compose.material.icons.outlined.Settings
 import androidx.compose.material.icons.outlined.SettingsBackupRestore
+import androidx.compose.material.icons.outlined.Storage
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.vector.ImageVector
@@ -50,6 +51,7 @@ fun MoreScreen(
     onClickDownloadQueue: () -> Unit,
     onClickCategories: () -> Unit,
     onClickStats: () -> Unit,
+    onClickStorage: () -> Unit,
     onClickBackupAndRestore: () -> Unit,
     onClickSettings: () -> Unit,
     onClickAbout: () -> Unit,
@@ -165,6 +167,13 @@ fun MoreScreen(
                     onPreferenceClick = onClickStats,
                 )
             }
+            item {
+                TextPreferenceWidget(
+                    title = stringResource(R.string.label_storage),
+                    icon = Icons.Outlined.Storage,
+                    onPreferenceClick = onClickStorage,
+                )
+            }
             item {
                 TextPreferenceWidget(
                     title = stringResource(R.string.label_backup),

app/src/main/java/eu/kanade/presentation/more/storage/CumulativeStorage.kt

@@ -0,0 +1,72 @@
+package eu.kanade.presentation.more.storage
+
+import androidx.compose.foundation.Canvas
+import androidx.compose.foundation.layout.aspectRatio
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.StrokeCap
+import androidx.compose.ui.graphics.drawscope.Stroke
+import androidx.compose.ui.graphics.drawscope.rotate
+import androidx.compose.ui.layout.Layout
+import eu.kanade.tachiyomi.util.toSize
+
+@Composable
+fun CumulativeStorage(
+    items: List<StorageItem>,
+    modifier: Modifier = Modifier,
+    borderWidth: Float = 15f,
+) {
+    val totalSize = remember(items) {
+        items.sumOf { it.size }.toFloat()
+    }
+    val totalSizeString = remember(totalSize) {
+        totalSize.toLong().toSize()
+    }
+    Layout(
+        modifier = modifier,
+        content = {
+            Canvas(
+                modifier = Modifier.aspectRatio(1f),
+                onDraw = {
+                    val totalAngle = 180f
+                    var currentAngle = 0f
+                    rotate(180f) {
+                        for (item in items) {
+                            val itemAngle = (item.size / totalSize) * totalAngle
+                            drawArc(
+                                color = item.color,
+                                startAngle = currentAngle,
+                                sweepAngle = itemAngle,
+                                useCenter = false,
+                                style = Stroke(width = borderWidth, cap = StrokeCap.Round),
+                            )
+                            currentAngle += itemAngle
+                        }
+                    }
+                },
+            )
+            Text(
+                text = totalSizeString,
+                style = MaterialTheme.typography.displaySmall,
+            )
+        },
+        measurePolicy = { measurables, constraints ->
+            val placeables = measurables.map { measurable ->
+                measurable.measure(constraints.copy(minWidth = 0, minHeight = 0))
+            }
+            val canvas = placeables.first()
+            val text = placeables.last()
+            // use half the height of the canvas to avoid too much extra space
+            layout(constraints.maxWidth, canvas.height / 2) {
+                canvas.placeRelative(0, 0)
+                text.placeRelative(
+                    (canvas.width / 2) - (text.width / 2),
+                    (canvas.height / 4) - (text.height / 2),
+                )
+            }
+        },
+    )
+}

app/src/main/java/eu/kanade/presentation/more/storage/SelectStorageCategory.kt

@@ -0,0 +1,40 @@
+package eu.kanade.presentation.more.storage
+
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.stringResource
+import eu.kanade.presentation.components.SelectItem
+import eu.kanade.tachiyomi.R
+import tachiyomi.domain.category.model.Category
+
+@Composable
+fun SelectStorageCategory(
+    selectedCategory: Category,
+    categories: List<Category>,
+    modifier: Modifier = Modifier,
+    onCategorySelected: (Category) -> Unit,
+) {
+    val all = stringResource(R.string.label_all)
+    val default = stringResource(R.string.label_default)
+    val mappedCategories = remember(categories) {
+        categories.map {
+            when (it.id) {
+                -1L -> it.copy(name = all)
+                Category.UNCATEGORIZED_ID -> it.copy(name = default)
+                else -> it
+            }
+        }.toTypedArray()
+    }
+
+    SelectItem(
+        modifier = modifier,
+        label = stringResource(R.string.label_category),
+        selectedIndex = mappedCategories.indexOfFirst { it.id == selectedCategory.id },
+        options = mappedCategories,
+        onSelect = { index ->
+            onCategorySelected(mappedCategories[index])
+        },
+        toString = { it.name },
+    )
+}