Routing integration for Tab and Stack panels

2 files changed, 24 insertions, 5 deletions

diff --git a/src/main/kotlin/pl/treksoft/kvision/panel/StackPanel.kt b/src/main/kotlin/pl/treksoft/kvision/panel/StackPanel.kt
index 1d4b1b68..e69cc416 100644
--- a/src/main/kotlin/pl/treksoft/kvision/panel/StackPanel.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/panel/StackPanel.kt
@@ -2,6 +2,7 @@ package pl.treksoft.kvision.panel
 
 import com.github.snabbdom.VNode
 import pl.treksoft.kvision.core.Component
+import pl.treksoft.kvision.routing.routing
 
 open class StackPanel(
     private val activateLast: Boolean = true,
@@ -21,6 +22,13 @@ open class StackPanel(
         }
     }
 
+    open fun add(panel: Component, route: String): StackPanel {
+        add(panel)
+        val currentIndex = children.size - 1
+        routing.on(route, { _ -> activeIndex = currentIndex }).resolve()
+        return this
+    }
+
     override fun add(child: Component): StackPanel {
         super.add(child)
         if (activateLast) activeIndex = children.size - 1
diff --git a/src/main/kotlin/pl/treksoft/kvision/panel/TabPanel.kt b/src/main/kotlin/pl/treksoft/kvision/panel/TabPanel.kt
index 72063be0..411c4a57 100644
--- a/src/main/kotlin/pl/treksoft/kvision/panel/TabPanel.kt
+++ b/src/main/kotlin/pl/treksoft/kvision/panel/TabPanel.kt
@@ -5,15 +5,20 @@ import pl.treksoft.kvision.core.ResString
 import pl.treksoft.kvision.html.Link
 import pl.treksoft.kvision.html.TAG
 import pl.treksoft.kvision.html.Tag
+import pl.treksoft.kvision.routing.routing
 
 open class TabPanel : SimplePanel(setOf()) {
     var activeIndex
         get() = content.activeIndex
         set(value) {
-            content.activeIndex = value
-            nav.children.forEach { it.removeCssClass("active") }
-            if (content.activeIndex >= 0 && content.activeIndex <= nav.children.size) {
-                nav.children[content.activeIndex].addCssClass("active")
+            if (content.activeIndex != value) {
+                content.activeIndex = value
+                nav.children.forEach {
+                    it.removeCssClass("active")
+                }
+                if (content.activeIndex >= 0 && content.activeIndex <= nav.children.size) {
+                    nav.children[content.activeIndex].addCssClass("active")
+                }
             }
         }
 
@@ -27,7 +32,7 @@ open class TabPanel : SimplePanel(setOf()) {
 
     open fun addTab(
         title: String, panel: Component, icon: String? = null,
-        image: ResString? = null
+        image: ResString? = null, route: String? = null
     ): TabPanel {
         val tag = Tag(TAG.LI)
         tag.role = "presentation"
@@ -37,6 +42,9 @@ open class TabPanel : SimplePanel(setOf()) {
             click = { e ->
                 activeIndex = index
                 e.preventDefault()
+                if (route != null) {
+                    routing.navigate(route)
+                }
             }
         }
         nav.add(tag)
@@ -45,6 +53,9 @@ open class TabPanel : SimplePanel(setOf()) {
             activeIndex = 0
         }
         content.add(panel)
+        if (route != null) {
+            routing.on(route, { _ -> activeIndex = index }).resolve()
+        }
         return this
     }