feat: [ANDROAPP-6689] Create DataSetInstanceScreen

aggregates/.gitignore

@@ -0,0 +1 @@
+/build

aggregates/build.gradle.kts

@@ -1,6 +1,14 @@
 plugins {
     kotlin("multiplatform")
+    id("org.jetbrains.compose") version "1.7.1"
     id("com.android.library")
+    alias(libs.plugins.kotlin.compose.compiler)
+}
+
+repositories{
+    maven { url = uri("https://oss.sonatype.org/content/repositories/snapshots") }
+    mavenCentral()
+    google()
 }
 
 kotlin {
@@ -14,39 +22,46 @@ kotlin {
 
     jvm("desktop")
 
-    listOf(
-        iosX64(),
-        iosArm64(),
-        iosSimulatorArm64()
-    ).forEach {
-        it.binaries.framework {
-            baseName = "aggregates"
-            isStatic = true
-        }
-    }
-
     sourceSets {
         commonMain.dependencies {
-            //put your multiplatform dependencies here
+            implementation(compose.runtime)
+            implementation(compose.foundation)
+            implementation(compose.ui)
+            implementation(compose.material3)
+            api(compose.materialIconsExtended)
+            implementation(libs.dhis2.mobile.designsystem)
+            implementation(libs.compose.material3.window)
         }
         commonTest.dependencies {
             implementation(kotlin("test"))
         }
 
-        androidMain.dependencies {  }
+        androidMain.dependencies {
+            implementation(libs.androidx.compose.preview)
+        }
 
         androidUnitTest.dependencies {  }
+
+        val desktopMain by getting {
+            dependencies {
+                implementation(compose.desktop.common)
+            }
+        }
     }
 }
 
 android {
     namespace = "org.dhis2.mobile.aggregates"
-    compileSdk = 34
+    compileSdk = libs.versions.sdk.get().toInt()
     defaultConfig {
-        minSdk = 21
+        minSdk = libs.versions.minSdk.get().toInt()
     }
     compileOptions {
         sourceCompatibility = JavaVersion.VERSION_1_8
         targetCompatibility = JavaVersion.VERSION_1_8
     }
 }
+dependencies {
+    debugImplementation(libs.androidx.compose.preview)
+    debugImplementation(libs.androidx.ui.tooling)
+}

aggregates/src/androidMain/kotlin/org/dhis2/mobile/aggregates/ui/DataSetTableScreenPreview.kt

@@ -0,0 +1,22 @@
+package org.dhis2.mobile.aggregates.ui
+
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.tooling.preview.Preview
+import org.dhis2.mobile.aggregates.model.previewDataSetScreenState
+import org.hisp.dhis.mobile.ui.designsystem.theme.DHIS2Theme
+
+@Preview(device = "id:pixel_8a")
+@Composable
+fun DataSetTableScreenPreview() {
+    DHIS2Theme {
+        DataSetInstanceScreen(previewDataSetScreenState(false, 3)) {}
+    }
+}
+
+@Preview(device = "id:pixel_c")
+@Composable
+fun DataSetTableTabletScreenPreview() {
+    DHIS2Theme {
+        DataSetInstanceScreen(previewDataSetScreenState(true, 10)) {}
+    }
+}

aggregates/src/androidMain/kotlin/org/dhis2/mobile/aggregates/ui/ScreenWidth.kt

@@ -0,0 +1,9 @@
+package org.dhis2.mobile.aggregates.ui
+
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.platform.LocalConfiguration
+import androidx.compose.ui.unit.Dp
+import androidx.compose.ui.unit.dp
+
+@Composable
+actual fun getScreenWidth(): Dp = LocalConfiguration.current.screenWidthDp.dp

aggregates/src/commonMain/kotlin/org/dhis2/mobile/aggregates/model/DataSetDetails.kt

@@ -0,0 +1,8 @@
+package org.dhis2.mobile.aggregates.model
+
+data class DataSetDetails(
+    val titleLabel: String,
+    val dateLabel: String,
+    val orgUnitLabel: String,
+    val catOptionComboLabel: String,
+)

aggregates/src/commonMain/kotlin/org/dhis2/mobile/aggregates/model/DataSetScreenState.kt

@@ -0,0 +1,27 @@
+package org.dhis2.mobile.aggregates.model
+
+data class DataSetScreenState(
+    val dataSetDetails: DataSetDetails,
+    val dataSetSections: List<DataSetSection>,
+    val useTwoPane: Boolean,
+)
+
+inline fun previewDataSetScreenState(
+    useTwoPane: Boolean,
+    numberOfTabs: Int,
+) = DataSetScreenState(
+    dataSetDetails = DataSetDetails(
+        titleLabel = "Data set title",
+        dateLabel = "Jan. 2024",
+        orgUnitLabel = "Org. Unit",
+        catOptionComboLabel = "Cat. Option Combo",
+    ),
+    dataSetSections = buildList {
+        repeat(numberOfTabs) {
+            add(
+                DataSetSection("uid$it", "Section $it"),
+            )
+        }
+    },
+    useTwoPane = useTwoPane,
+)

aggregates/src/commonMain/kotlin/org/dhis2/mobile/aggregates/model/DataSetSection.kt

@@ -0,0 +1,6 @@
+package org.dhis2.mobile.aggregates.model
+
+data class DataSetSection(
+    val uid: String,
+    val title: String,
+)

aggregates/src/commonMain/kotlin/org/dhis2/mobile/aggregates/ui/AdaptativeTabRow.kt

@@ -0,0 +1,130 @@
+package org.dhis2.mobile.aggregates.ui
+
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.ScrollableTabRow
+import androidx.compose.material3.Tab
+import androidx.compose.material3.TabRow
+import androidx.compose.material3.TabRowDefaults
+import androidx.compose.material3.TabRowDefaults.tabIndicatorOffset
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateListOf
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.runtime.setValue
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.layout.onGloballyPositioned
+import androidx.compose.ui.platform.LocalDensity
+import androidx.compose.ui.unit.dp
+import org.hisp.dhis.mobile.ui.designsystem.theme.Spacing
+
+/**
+ * Adaptive Tab Row
+ * Displays a scrollable tab row if the total width of the tabs exceeds the screen width.
+ * @param modifier Modifier for styling
+ * @param tabLabels List of tab labels to display
+ * @param onTabClicked Callback function to be invoked when a tab is clicked
+ * **/
+@Composable
+fun AdaptiveTabRow(
+    modifier: Modifier = Modifier,
+    tabLabels: List<String>,
+    onTabClicked: (index: Int) -> Unit,
+) {
+    var selectedTab by remember { mutableStateOf(0) }
+    val tabWidths = remember { mutableStateListOf<Int>() }
+    var scrollable by remember { mutableStateOf(false) }
+
+    // Calculate total width of tabs
+    val totalTabWidth = tabWidths.sum()
+    val screenWidth = with(LocalDensity.current) {
+        getScreenWidth().roundToPx()
+    }
+
+    LaunchedEffect(key1 = totalTabWidth, key2 = screenWidth) {
+        // Determine if tabs should be scrollable
+        scrollable = totalTabWidth > screenWidth
+    }
+
+    // TabRow with conditional behavior
+    if (false) {
+        ScrollableTabRow(
+            modifier = modifier
+                .height(48.dp)
+                .fillMaxWidth(),
+            selectedTabIndex = selectedTab,
+            containerColor = MaterialTheme.colorScheme.primary,
+            edgePadding = Spacing.Spacing16,
+            indicator = { tabPositions ->
+                TabRowDefaults.PrimaryIndicator(
+                    width = 56.dp,
+                    modifier = Modifier.tabIndicatorOffset(tabPositions[selectedTab]),
+                    color = MaterialTheme.colorScheme.onPrimary,
+                )
+            },
+            divider = {},
+        ) {
+            tabLabels.forEachIndexed { index, tabLabel ->
+                Tab(
+                    modifier = Modifier
+                        .height(48.dp)
+                        .onGloballyPositioned { coordinates ->
+                            tabWidths.add(index, coordinates.size.width)
+                        },
+                    selected = selectedTab == index,
+                    onClick = {
+                        selectedTab = index
+                        onTabClicked(index)
+                    },
+                ) {
+                    Text(
+                        text = tabLabel,
+                        color = MaterialTheme.colorScheme.onPrimary,
+                        style = MaterialTheme.typography.titleSmall,
+                    )
+                }
+            }
+        }
+    } else {
+        TabRow(
+            modifier = modifier
+                .height(48.dp)
+                .fillMaxWidth(),
+            selectedTabIndex = selectedTab,
+            containerColor = MaterialTheme.colorScheme.primary,
+            indicator = { tabPositions ->
+                TabRowDefaults.PrimaryIndicator(
+                    width = 56.dp,
+                    modifier = Modifier.tabIndicatorOffset(tabPositions[selectedTab]),
+                    color = MaterialTheme.colorScheme.onPrimary,
+                )
+            },
+            divider = {},
+        ) {
+            tabLabels.forEachIndexed { index, tabLabel ->
+                Tab(
+                    modifier = Modifier
+                        .height(48.dp)
+                        .onGloballyPositioned { coordinates ->
+                            tabWidths.add(index, coordinates.size.width)
+                        },
+                    selected = selectedTab == index,
+                    onClick = {
+                        selectedTab = index
+                        onTabClicked(index)
+                    },
+                ) {
+                    Text(
+                        text = tabLabel,
+                        color = MaterialTheme.colorScheme.onPrimary,
+                        style = MaterialTheme.typography.titleSmall,
+                    )
+                }
+            }
+        }
+    }
+}