be able to select a specific step from the tree

app/src/main/java/com/iqball/app/component/StepTree.kt

@@ -1,6 +1,5 @@
 package com.iqball.app.component
 
-import android.util.Log
 import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Box
@@ -24,7 +23,6 @@ import androidx.compose.ui.draw.drawWithContent
 import androidx.compose.ui.geometry.Offset
 import androidx.compose.ui.geometry.Rect
 import androidx.compose.ui.graphics.Color
-import androidx.compose.ui.layout.boundsInParent
 import androidx.compose.ui.layout.boundsInRoot
 import androidx.compose.ui.layout.onGloballyPositioned
 import androidx.compose.ui.text.style.TextAlign
@@ -61,7 +59,6 @@ fun StepsTree(root: StepNodeInfo, selectedNodeId: Int, onNodeSelected: (StepNode
                     val parentCenter = nodesOffsets[parent]!!.center.minus(globalOffset)
                     for (children in parent.children) {
                         val childrenCenter = nodesOffsets[children]!!.center.minus(globalOffset)
-                        Log.d("STATE", "$parentCenter, $childrenCenter")
                         drawLine(Color.Black, start = parentCenter, end = childrenCenter, strokeWidth = 5F)
                         toDraw += children
                     }

app/src/main/java/com/iqball/app/page/VisualizerPage.kt

@@ -1,13 +1,11 @@
 package com.iqball.app.page
 
-import android.app.Activity
 import android.content.res.Configuration
 import android.util.Log
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.ArrowBack
@@ -17,20 +15,18 @@ import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableIntStateOf
-import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
+import androidx.compose.runtime.saveable.rememberSaveable
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.LocalConfiguration
 import arrow.core.Either
-import arrow.core.flatMap
 import com.iqball.app.component.BasketCourt
 import com.iqball.app.component.StepsTree
 import com.iqball.app.model.TacticInfo
 import com.iqball.app.model.tactic.CourtType
-import com.iqball.app.model.tactic.StepContent
 import com.iqball.app.model.tactic.StepNodeInfo
 import com.iqball.app.net.service.TacticService
 import com.iqball.app.session.Token
@@ -42,7 +38,6 @@ import java.time.ZoneId
 private data class VisualizerInitialData(
     val info: TacticInfo,
     val rootStep: StepNodeInfo,
-    val rootContent: StepContent
 )
 
 @Composable
@@ -51,15 +46,33 @@ fun VisualizerPage(
     auth: Token,
     tacticId: Int,
 ) {
-    val dataEither = initializeVisualizer(service, auth, tacticId)
+    val dataEither = remember { initializeVisualizer(service, auth, tacticId) }
 
-    val (info, rootStep, rootContent) = when (dataEither) {
+    val (info, rootStep) = when (dataEither) {
+        // On error return a text to print it to the user
         is Either.Left -> return Text(text = dataEither.value)
         is Either.Right -> dataEither.value
     }
 
     val screenOrientation = LocalConfiguration.current.orientation
-    var selectedStepId by remember { mutableIntStateOf(rootStep.id) }
+    var selectedStepId by rememberSaveable { mutableIntStateOf(rootStep.id) }
+    val content = remember(selectedStepId) {
+        runBlocking {
+            val result = service.getTacticStepContent(auth, tacticId, selectedStepId)
+                .onLeft {
+                    Log.e(
+                        "received error response from server when retrieving root content: {}",
+                        it.toString()
+                    )
+                }
+            when (result) {
+                is Either.Left -> throw Error("Unexpected error")
+                is Either.Right -> result.value
+            }
+        }
+    }
+
+    Log.d("CONTENT", content.toString())
 
     Column {
         VisualizerHeader(title = info.name)
@@ -71,7 +84,7 @@ fun VisualizerPage(
             )
 
             Configuration.ORIENTATION_LANDSCAPE -> BasketCourt(
-                content = rootContent,
+                content = content,
                 type = info.type
             )
 
@@ -111,7 +124,7 @@ private fun initializeVisualizer(
     auth: Token,
     tacticId: Int
 ): Either<String, VisualizerInitialData> {
-    val (tacticInfo, tacticTree, rootStepContent) = runBlocking {
+    val (tacticInfo, tacticTree) = runBlocking {
         val tacticInfo = service.getTacticInfo(auth, tacticId)
             .map {
                 TacticInfo(
@@ -141,24 +154,13 @@ private fun initializeVisualizer(
                 )
             }
 
-        val rootStepContent = tacticTree
-            .flatMap {
-                service.getTacticStepContent(auth, tacticId, it.id)
-                    .onLeft {
-                        Log.e(
-                            "received error response from server when retrieving root content: {}",
-                            it.toString()
-                        )
-                    }
-            }
-
-        Triple(tacticInfo.getOrNull(), tacticTree.getOrNull(), rootStepContent.getOrNull())
+        Pair(tacticInfo.getOrNull(), tacticTree.getOrNull())
     }
 
-    if (tacticInfo == null || tacticTree == null || rootStepContent == null) {
+    if (tacticInfo == null || tacticTree == null) {
         return Either.Left("Unable to retrieve tactic information")
     }
 
 
-    return Either.Right(VisualizerInitialData(tacticInfo, tacticTree, rootStepContent))
+    return Either.Right(VisualizerInitialData(tacticInfo, tacticTree))
 }