Fix Markdown loading in standalone sample (#539)

When it was ported to the BTF2-based APIs, the job was done only partly,
and loading a preset would not result in the editor updating its content
accordingly.

The fix is to hoist the state and pass it around as needed, instead of
trying to manually sync up things, which is never going to work well.

samples/standalone/src/main/kotlin/org/jetbrains/jewel/samples/standalone/view/MarkdownView.kt

@@ -4,11 +4,8 @@ import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxHeight
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.text.input.rememberTextFieldState
 import androidx.compose.runtime.Composable
-import androidx.compose.runtime.getValue
-import androidx.compose.runtime.mutableStateOf
-import androidx.compose.runtime.remember
-import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
 import org.jetbrains.jewel.foundation.modifier.trackActivation
 import org.jetbrains.jewel.foundation.theme.JewelTheme
@@ -21,18 +18,17 @@ import org.jetbrains.jewel.ui.component.Divider
 @Composable
 fun MarkdownDemo() {
     Row(Modifier.trackActivation().fillMaxSize().background(JewelTheme.globalColors.panelBackground)) {
-        var currentMarkdown by remember { mutableStateOf(JewelReadme) }
+        val editorState = rememberTextFieldState(JewelReadme)
         MarkdownEditor(
-            currentMarkdown = currentMarkdown,
-            onMarkdownChange = { currentMarkdown = it },
+            state = editorState,
             modifier = Modifier.fillMaxHeight().weight(1f),
         )
 
         Divider(Orientation.Vertical, Modifier.fillMaxHeight())
 
         MarkdownPreview(
             modifier = Modifier.fillMaxHeight().weight(1f),
-            rawMarkdown = currentMarkdown,
+            rawMarkdown = editorState.text,
         )
     }
 }

samples/standalone/src/main/kotlin/org/jetbrains/jewel/samples/standalone/view/markdown/MarkdownEditor.kt

@@ -11,44 +11,40 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.rememberScrollState
-import androidx.compose.foundation.text.input.rememberTextFieldState
+import androidx.compose.foundation.text.input.TextFieldState
 import androidx.compose.runtime.Composable
-import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
 import androidx.compose.runtime.setValue
-import androidx.compose.runtime.snapshotFlow
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
 import com.darkrockstudios.libraries.mpfilepicker.FilePicker
 import com.darkrockstudios.libraries.mpfilepicker.JvmFile
 import org.jetbrains.jewel.foundation.theme.JewelTheme
-import org.jetbrains.jewel.samples.standalone.StandaloneSampleIcons
 import org.jetbrains.jewel.ui.Orientation
 import org.jetbrains.jewel.ui.component.Divider
 import org.jetbrains.jewel.ui.component.Icon
 import org.jetbrains.jewel.ui.component.OutlinedButton
 import org.jetbrains.jewel.ui.component.PopupMenu
 import org.jetbrains.jewel.ui.component.Text
 import org.jetbrains.jewel.ui.component.TextArea
+import org.jetbrains.jewel.ui.icons.AllIconsKeys
 
 @Composable
 internal fun MarkdownEditor(
-    currentMarkdown: String,
-    onMarkdownChange: (String) -> Unit,
+    state: TextFieldState,
     modifier: Modifier = Modifier,
 ) {
     Column(modifier) {
         ControlsRow(
             modifier = Modifier.fillMaxWidth().background(JewelTheme.globalColors.panelBackground).padding(8.dp),
-            onMarkdownChange = onMarkdownChange,
+            onLoadMarkdown = { state.edit { replace(0, length, it) } },
         )
         Divider(orientation = Orientation.Horizontal)
         Editor(
-            currentMarkdown = currentMarkdown,
-            onMarkdownChange = onMarkdownChange,
+            state = state,
             modifier = Modifier.fillMaxWidth().weight(1f),
         )
     }
@@ -57,7 +53,7 @@ internal fun MarkdownEditor(
 @Composable
 private fun ControlsRow(
     modifier: Modifier = Modifier,
-    onMarkdownChange: (String) -> Unit,
+    onLoadMarkdown: (String) -> Unit,
 ) {
     Row(
         modifier.horizontalScroll(rememberScrollState()),
@@ -78,22 +74,18 @@ private fun ControlsRow(
                 val jvmFile = platformFile as JvmFile
                 val contents = jvmFile.platformFile.readText()
 
-                onMarkdownChange(contents)
+                onLoadMarkdown(contents)
             }
         }
 
-        OutlinedButton(onClick = { onMarkdownChange("") }) { Text("Clear") }
+        OutlinedButton(onClick = { onLoadMarkdown("") }) { Text("Clear") }
 
         Box {
             var showPresets by remember { mutableStateOf(false) }
             OutlinedButton(onClick = { showPresets = true }) {
                 Text("Load preset")
                 Spacer(Modifier.width(8.dp))
-                Icon(
-                    resource = "expui/general/chevronDown.svg",
-                    contentDescription = null,
-                    iconClass = StandaloneSampleIcons::class.java,
-                )
+                Icon(AllIconsKeys.General.ChevronDown, contentDescription = null)
             }
 
             if (showPresets) {
@@ -106,7 +98,7 @@ private fun ControlsRow(
                         selected = selected == "Jewel readme",
                         onClick = {
                             selected = "Jewel readme"
-                            onMarkdownChange(JewelReadme)
+                            onLoadMarkdown(JewelReadme)
                         },
                     ) {
                         Text("Jewel readme")
@@ -116,7 +108,7 @@ private fun ControlsRow(
                         selected = selected == "Markdown catalog",
                         onClick = {
                             selected = "Markdown catalog"
-                            onMarkdownChange(MarkdownCatalog)
+                            onLoadMarkdown(MarkdownCatalog)
                         },
                     ) {
                         Text("Markdown catalog")
@@ -129,16 +121,9 @@ private fun ControlsRow(
 
 @Composable
 private fun Editor(
-    currentMarkdown: String,
-    onMarkdownChange: (String) -> Unit,
+    state: TextFieldState,
     modifier: Modifier = Modifier,
 ) {
-    val state = rememberTextFieldState(currentMarkdown)
-    LaunchedEffect(state) {
-        snapshotFlow { state.text }
-            .collect { onMarkdownChange(it.toString()) }
-    }
-
     Box(modifier.padding(16.dp)) {
         TextArea(
             state = state,

samples/standalone/src/main/kotlin/org/jetbrains/jewel/samples/standalone/view/markdown/MarkdownPreview.kt

@@ -43,7 +43,7 @@ import java.net.URI
 @Composable
 internal fun MarkdownPreview(
     modifier: Modifier = Modifier,
-    rawMarkdown: String,
+    rawMarkdown: CharSequence,
 ) {
     val isDark = JewelTheme.isDark
 
@@ -64,7 +64,7 @@ internal fun MarkdownPreview(
         @Suppress("InjectDispatcher") // This should never go in the composable IRL
         markdownBlocks =
             withContext(Dispatchers.Default) {
-                processor.processMarkdownDocument(rawMarkdown)
+                processor.processMarkdownDocument(rawMarkdown.toString())
             }
     }