new instances view

app/src/main/java/eu/m724/vastapp/activity/dashboard/screen/Instances.kt

@@ -5,6 +5,7 @@ import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.ContextualFlowRow
 import androidx.compose.foundation.layout.ExperimentalLayoutApi
+import androidx.compose.foundation.layout.FlowRow
 import androidx.compose.foundation.layout.IntrinsicSize
 import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.Row
@@ -17,18 +18,29 @@ import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.verticalScroll
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.automirrored.filled.KeyboardArrowRight
+import androidx.compose.material.icons.filled.KeyboardArrowDown
+import androidx.compose.material.icons.filled.KeyboardArrowRight
 import androidx.compose.material3.Card
+import androidx.compose.material3.Icon
 import androidx.compose.material3.LinearProgressIndicator
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.collectAsState
+import androidx.compose.runtime.derivedStateOf
 import androidx.compose.runtime.getValue
+import androidx.compose.runtime.remember
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.rotate
+import androidx.compose.ui.focus.focusModifier
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import eu.m724.vastapp.activity.dashboard.DashboardViewModel
+import eu.m724.vastapp.vastai.data.Instance
+import eu.m724.vastapp.vastai.data.RentedInstance
 import org.json.JSONObject
 
 class Instances {
@@ -38,6 +50,7 @@ class Instances {
 @Composable
 fun InstancesScreen(dashboardViewModel: DashboardViewModel) {
     val uiState by dashboardViewModel.uiState.collectAsState()
+    val rentedInstances by dashboardViewModel.rentedInstances.collectAsState()
 
     // TODO actually get instances
 
@@ -45,20 +58,31 @@ fun InstancesScreen(dashboardViewModel: DashboardViewModel) {
         modifier = Modifier
             .fillMaxWidth()
             .verticalScroll(rememberScrollState()),
-        itemCount = 10,
+        itemCount = rentedInstances.size,
         horizontalArrangement = Arrangement.Center
-    ) {
+    ) { i ->
-        val instance = JSONObject()
+        RentedInstanceCard(rentedInstance = rentedInstances[i], modifier = Modifier
-        instance.put("id", 234523)
+            .width(340.dp)
-        instance.put("machine_id", 1121323)
+            .padding(8.dp))
-        instance.put("host_id", 5924)
+    }
-        instance.put("gpu_name", "RTX 4090")
+}
-        instance.put("num_gpus", 2)
-        instance.put("gpu_util", 70)
-        instance.put("gpu_ram", 24564)
-        instance.put("vmem_usage", 0.339843)
 
-        InstanceCard(instance = instance, modifier = Modifier.width(340.dp).padding(8.dp))
+@Composable
+fun RentedInstanceCard(rentedInstance: RentedInstance, modifier: Modifier = Modifier) {
+    val instance by remember(rentedInstance) { derivedStateOf { rentedInstance.instance } }
+    val label by remember(instance) { derivedStateOf {
+        rentedInstance.label ?: instance.machine.gpu.model
+    } }
+
+    Card(modifier = modifier) {
+        Row {
+            Text(label, fontSize = 18.sp)
+            Spacer(modifier = Modifier.weight(1f))
+            Icon(
+                imageVector = Icons.AutoMirrored.Filled.KeyboardArrowRight,
+                contentDescription = "Details about instance $label"
+            )
+        }
     }
 }