From 585821a40e159609c17cb418f7023e50a8dfc21c Mon Sep 17 00:00:00 2001
From: Steven Tang <stevenunderscoretang@gmail.com>
Date: Tue, 3 Oct 2023 13:30:16 -0600
Subject: [PATCH] Add BoxSandbox (#1523)

---
 .../redwood/testing/presenter/BoxSandbox.kt   | 108 ++++++++++++++++++
 .../redwood/testing/presenter/TestApp.kt      |   1 +
 2 files changed, 109 insertions(+)
 create mode 100644 test-app/presenter/src/commonMain/kotlin/com/example/redwood/testing/presenter/BoxSandbox.kt

diff --git a/test-app/presenter/src/commonMain/kotlin/com/example/redwood/testing/presenter/BoxSandbox.kt b/test-app/presenter/src/commonMain/kotlin/com/example/redwood/testing/presenter/BoxSandbox.kt
new file mode 100644
index 0000000000..fe23cec09f
--- /dev/null
+++ b/test-app/presenter/src/commonMain/kotlin/com/example/redwood/testing/presenter/BoxSandbox.kt
@@ -0,0 +1,108 @@
+/*
+ * Copyright (C) 2023 Square, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *      http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+package com.example.redwood.testing.presenter
+
+import androidx.compose.runtime.Composable
+import app.cash.redwood.Modifier
+import app.cash.redwood.layout.api.Constraint
+import app.cash.redwood.layout.api.CrossAxisAlignment
+import app.cash.redwood.layout.api.MainAxisAlignment
+import app.cash.redwood.layout.api.Overflow
+import app.cash.redwood.layout.compose.Box
+import app.cash.redwood.layout.compose.Column
+import app.cash.redwood.layout.compose.Row
+import app.cash.redwood.ui.Margin
+import app.cash.redwood.ui.dp
+import com.example.redwood.testing.compose.Button
+import com.example.redwood.testing.compose.Text
+
+@Composable
+fun BoxSandbox(modifier: Modifier = Modifier) {
+  Column(
+    width = Constraint.Fill,
+    height = Constraint.Fill,
+    overflow = Overflow.Scroll,
+    horizontalAlignment = CrossAxisAlignment.Stretch,
+    verticalAlignment = MainAxisAlignment.Start,
+  ) {
+    val crossAxisAlignments = listOf<CrossAxisAlignment>(
+      CrossAxisAlignment.Start,
+      CrossAxisAlignment.Center,
+      CrossAxisAlignment.Stretch,
+      CrossAxisAlignment.End,
+    )
+
+    val constraints = listOf<Constraint>(
+      Constraint.Fill,
+      Constraint.Wrap,
+    )
+
+    // Iterate over all permutations
+    constraints.forEach {
+      val widthConstraint = it
+      constraints.forEach {
+        val heightConstraint = it
+        crossAxisAlignments.forEach {
+          val horizontalAlignment = it
+          crossAxisAlignments.forEach {
+            val verticalAlignment = it
+            Text("$widthConstraint $heightConstraint $horizontalAlignment $verticalAlignment")
+            BoxRow(
+              width = widthConstraint,
+              height = heightConstraint,
+              horizontalAlignment = horizontalAlignment,
+              verticalAlignment = verticalAlignment,
+              modifier = Modifier.height(120.dp),
+            )
+          }
+        }
+      }
+    }
+  }
+}
+
+@Composable
+private fun BoxRow(
+  width: Constraint,
+  height: Constraint,
+  horizontalAlignment: CrossAxisAlignment,
+  verticalAlignment: CrossAxisAlignment,
+  modifier: Modifier = Modifier,
+) {
+  Column(
+    width = Constraint.Fill,
+    height = Constraint.Fill,
+    horizontalAlignment = CrossAxisAlignment.Start,
+    margin = Margin(horizontal = 20.dp, vertical = 0.dp),
+    modifier = modifier,
+  ) {
+    Row(
+      width = Constraint.Fill,
+      height = Constraint.Fill,
+    ) {
+      Box(
+        width = width,
+        height = height,
+        horizontalAlignment = horizontalAlignment,
+        verticalAlignment = verticalAlignment,
+      ) {
+        Button("BACK - BACK - BACK\nBACK - BACK - BACK\nBACK - BACK - BACK", onClick = null)
+        Button("MIDDLE - MIDDLE\nMIDDLE - MIDDLE", onClick = null)
+        Button("FRONT", onClick = null)
+      }
+    }
+  }
+}
diff --git a/test-app/presenter/src/commonMain/kotlin/com/example/redwood/testing/presenter/TestApp.kt b/test-app/presenter/src/commonMain/kotlin/com/example/redwood/testing/presenter/TestApp.kt
index 652d7d4073..75c90e17b2 100644
--- a/test-app/presenter/src/commonMain/kotlin/com/example/redwood/testing/presenter/TestApp.kt
+++ b/test-app/presenter/src/commonMain/kotlin/com/example/redwood/testing/presenter/TestApp.kt
@@ -34,6 +34,7 @@ import com.example.redwood.testing.compose.Text
 private val screens = buildMap<String, @Composable TestContext.() -> Unit> {
   put("Repo Search") { RepoSearch(httpClient) }
   put("UI Configuration") { UiConfigurationValues() }
+  put("Box Sandbox") { BoxSandbox() }
 }
 
 @Stable