Give each PaneScaffoldState its own backPreviewState

Author: tunjid

scaffold/src/commonMain/kotlin/com/tunjid/heron/scaffold/scaffold/App.kt

@@ -22,21 +22,15 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.material3.Surface
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
-import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.rememberUpdatedState
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.geometry.Offset
 import androidx.compose.ui.layout.layout
 import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.platform.LocalWindowInfo
-import androidx.compose.ui.unit.round
-import androidx.navigationevent.NavigationEvent
-import androidx.navigationevent.NavigationEventTransitionState
-import androidx.navigationevent.compose.LocalNavigationEventDispatcherOwner
 import com.tunjid.composables.splitlayout.SplitLayout
 import com.tunjid.heron.images.LocalImageLoader
 import com.tunjid.heron.media.video.LocalVideoPlayerController
@@ -142,33 +136,6 @@ fun App(
                                 },
                             )
                         }
-
-                        val navigationEventDispatcher =
-                            LocalNavigationEventDispatcherOwner.current!!
-                                .navigationEventDispatcher
-
-                        LaunchedEffect(navigationEventDispatcher) {
-                            navigationEventDispatcher.transitionState
-                                .collect { eventState ->
-                                    when (eventState) {
-                                        is NavigationEventTransitionState.Idle -> {
-                                            appState.backPreviewState.progress = 0f
-                                        }
-
-                                        is NavigationEventTransitionState.InProgress -> {
-                                            appState.backPreviewState.progress =
-                                                eventState.latestEvent.progress
-                                            appState.backPreviewState.atStart =
-                                                eventState.latestEvent.swipeEdge == NavigationEvent.EDGE_LEFT
-                                            appState.backPreviewState.pointerOffset =
-                                                Offset(
-                                                    eventState.latestEvent.touchX,
-                                                    eventState.latestEvent.touchY,
-                                                ).round()
-                                        }
-                                    }
-                                }
-                        }
                     }
                 }
             }

scaffold/src/commonMain/kotlin/com/tunjid/heron/scaffold/scaffold/AppState.kt

@@ -40,7 +40,6 @@ import androidx.navigation3.runtime.rememberSaveableStateHolderNavEntryDecorator
 import androidx.navigationevent.NavigationEvent
 import androidx.navigationevent.NavigationEventTransitionState
 import androidx.navigationevent.compose.LocalNavigationEventDispatcherOwner
-import com.tunjid.composables.backpreview.BackPreviewState
 import com.tunjid.composables.splitlayout.SplitLayoutState
 import com.tunjid.heron.data.core.models.Preferences
 import com.tunjid.heron.data.core.types.GenericUri
@@ -110,9 +109,6 @@ class AppState(
     }
 
     internal val navigation by multiStackNavState
-    internal val backPreviewState = BackPreviewState(
-        minScale = 0.75f,
-    )
 
     internal var dismissBehavior by mutableStateOf<DismissBehavior>(DismissBehavior.None)
         private set

scaffold/src/commonMain/kotlin/com/tunjid/heron/scaffold/scaffold/PaneScaffold.kt

@@ -16,6 +16,7 @@
 
 package com.tunjid.heron.scaffold.scaffold
 
+import androidx.compose.animation.EnterExitState
 import androidx.compose.animation.animateBounds
 import androidx.compose.animation.core.animateDpAsState
 import androidx.compose.foundation.gestures.Orientation
@@ -36,13 +37,21 @@ import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.remember
+import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.runtime.rememberUpdatedState
 import androidx.compose.runtime.snapshotFlow
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
+import androidx.compose.ui.geometry.Offset
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.round
 import androidx.compose.ui.zIndex
+import androidx.lifecycle.compose.LifecycleStartEffect
+import androidx.navigationevent.NavigationEvent
+import androidx.navigationevent.NavigationEventTransitionState
+import androidx.navigationevent.compose.LocalNavigationEventDispatcherOwner
+import com.tunjid.composables.backpreview.BackPreviewState
 import com.tunjid.composables.constrainedsize.constrainedSizePlacement
 import com.tunjid.heron.ui.text.Memo
 import com.tunjid.heron.ui.text.message
@@ -51,7 +60,10 @@ import com.tunjid.treenav.compose.threepane.ThreePane
 import com.tunjid.treenav.compose.threepane.ThreePaneMovableElementSharedTransitionScope
 import com.tunjid.treenav.compose.threepane.rememberThreePaneMovableElementSharedTransitionScope
 import com.tunjid.treenav.strings.Route
+import kotlinx.coroutines.flow.collectLatest
 import kotlinx.coroutines.flow.filterNotNull
+import kotlinx.coroutines.flow.first
+import kotlinx.coroutines.launch
 
 class PaneScaffoldState internal constructor(
     internal val appState: AppState,
@@ -108,8 +120,9 @@ class PaneScaffoldState internal constructor(
     internal val hasSiblings
         get() = splitPaneState.filteredPaneOrder.size > 1
 
-    internal val backPreviewProgress
-        get() = appState.backPreviewState.progress
+    internal val backPreviewState = BackPreviewState(
+        minScale = 0.75f,
+    )
 
     internal val defaultContainerColor: Color
         @Composable get() {
@@ -135,7 +148,7 @@ fun PaneScope<ThreePane, Route>.rememberPaneScaffoldState(): PaneScaffoldState {
     val splitPaneState = LocalSplitPaneState.current
     val paneMovableElementSharedTransitionScope =
         rememberThreePaneMovableElementSharedTransitionScope()
-    return remember(
+    val paneScaffoldState = remember(
         appState,
         splitPaneState,
         paneMovableElementSharedTransitionScope,
@@ -146,6 +159,41 @@ fun PaneScope<ThreePane, Route>.rememberPaneScaffoldState(): PaneScaffoldState {
             paneMovableElementSharedTransitionScope = paneMovableElementSharedTransitionScope,
         )
     }
+
+    val scope = rememberCoroutineScope()
+
+    val navigationEventDispatcher =
+        LocalNavigationEventDispatcherOwner.current!!
+            .navigationEventDispatcher
+
+    LifecycleStartEffect(
+        key1 = scope,
+        key2 = navigationEventDispatcher,
+    ) {
+        val job = scope.launch {
+            navigationEventDispatcher.transitionState
+                .collectLatest { eventState ->
+                    when (eventState) {
+                        is NavigationEventTransitionState.Idle -> {
+                            // Wait to be visible
+                            snapshotFlow { paneScaffoldState.transition.targetState }
+                                .first { it == EnterExitState.Visible }
+                            paneScaffoldState.backPreviewState.progress = 0f
+                        }
+                        is NavigationEventTransitionState.InProgress -> paneScaffoldState.backPreviewState.apply {
+                            progress = eventState.latestEvent.progress
+                            atStart = eventState.latestEvent.swipeEdge == NavigationEvent.EDGE_LEFT
+                            pointerOffset = Offset(
+                                x = eventState.latestEvent.touchX,
+                                y = eventState.latestEvent.touchY,
+                            ).round()
+                        }
+                    }
+                }
+        }
+        onStopOrDispose { job.cancel() }
+    }
+    return paneScaffoldState
 }
 
 @Composable

scaffold/src/commonMain/kotlin/com/tunjid/heron/scaffold/scaffold/PredictiveBack.kt

@@ -40,7 +40,7 @@ fun Modifier.predictiveBackPlacement(
         appState.dismissBehavior != AppState.DismissBehavior.Gesture.DragToPop
 
     ifTrue(shouldDrawBackground) {
-        backPreview(appState.backPreviewState)
+        backPreview(backPreviewState)
     }
         .animatedRoundedCornerClip(
             cornerRadius = if (shouldDrawBackground) 16.dp else 0.dp,