fix: render small blocks as full width if they're single

d1snin · Sep 6, 2023 · 335dce5 · 335dce5
1 parent 16915ff
commit 335dce5
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 3 deletions.
diff --git a/beam-ui/src/jsMain/kotlin/dev/d1s/beam/ui/component/BlockComponent.kt b/beam-ui/src/jsMain/kotlin/dev/d1s/beam/ui/component/BlockComponent.kt
@@ -19,6 +19,7 @@ package dev.d1s.beam.ui.component
 import dev.d1s.beam.commons.Block
 import dev.d1s.beam.commons.MetadataKeys
 import dev.d1s.beam.ui.contententity.renderEntities
+import dev.d1s.beam.ui.util.Size.MaxBlockSize
 import dev.d1s.beam.ui.util.Size.sizeOf
 import dev.d1s.exkt.kvision.component.Component
 import dev.d1s.exkt.kvision.component.Effect
@@ -42,7 +43,12 @@ class BlockComponent : Component<BlockComponent.Config>(::Config), KoinComponent
 
     private fun SimplePanel.renderBlockCard(block: Block) {
         renderCard("w-100 p-4 d-flex flex-column justify-content-start") {
-            val blockSize = sizeOf(block.size).px
+            val blockSize = if (config.single.value) {
+                sizeOf(MaxBlockSize).px
+            } else {
+                sizeOf(block.size).px
+            }
+
             maxWidth = blockSize
 
             applyMargin()
@@ -86,6 +92,8 @@ class BlockComponent : Component<BlockComponent.Config>(::Config), KoinComponent
         val applyMarginBottom = atomic(true)
 
         val widthCompensator = atomic(.0)
+
+        val single = atomic(false)
     }
 
     companion object {

diff --git a/beam-ui/src/jsMain/kotlin/dev/d1s/beam/ui/component/BlockContainerComponent.kt b/beam-ui/src/jsMain/kotlin/dev/d1s/beam/ui/component/BlockContainerComponent.kt
@@ -127,12 +127,20 @@ class BlockContainerComponent : Component<Unit>(), KoinComponent {
                 val lastBlock = blockIndex == batch.lastIndex
                 val lastBatch = index == batches.lastIndex
 
-                renderBlock(block, lastBlock, lastBatch, compensator)
+                val single = batch.size == 1
+
+                renderBlock(block, lastBlock, lastBatch, compensator, single)
             }
         }
     }
 
-    private fun SimplePanel.renderBlock(block: Block, lastBlock: Boolean, lastBatch: Boolean, compensator: Double) {
+    private fun SimplePanel.renderBlock(
+        block: Block,
+        lastBlock: Boolean,
+        lastBatch: Boolean,
+        compensator: Double,
+        single: Boolean
+    ) {
         val blockComponent = get<Component<BlockComponent.Config>>(Qualifier.BlockComponent)
 
         render(blockComponent) {
@@ -147,6 +155,8 @@ class BlockContainerComponent : Component<Unit>(), KoinComponent {
             }
 
             this.widthCompensator.value = compensator
+
+            this.single.value = single
         }
     }
 }