feat(model-server): add option to expand to a specific node in the ContentExplorer

mhuster23 · mhuster23 · commit 5197919ce9b3 · 2024-09-17T09:16:11.000+02:00
diff --git a/model-server/src/main/kotlin/org/modelix/model/server/handlers/HttpException.kt b/model-server/src/main/kotlin/org/modelix/model/server/handlers/HttpException.kt
@@ -18,6 +18,7 @@ package org.modelix.model.server.handlers
 
 import io.ktor.http.HttpStatusCode
 import org.modelix.model.lazy.BranchReference
+import org.modelix.model.persistent.SerializationUtil
 
 /**
  * A namespace for problems we use as the first part of every `type` in an application/problem+json response.
@@ -101,6 +102,21 @@ class VersionNotFoundException(versionHash: String, cause: Throwable? = null) :
         cause = cause,
     )
 
+/**
+ * A [HttpException] indicating that a node was not found.
+ *
+ * @param nodeId id of the missing node
+ * @param cause The causing exception for the bad request or null if none.
+ */
+class NodeNotFoundException(nodeId: Long, cause: Throwable? = null) :
+    HttpException(
+        HttpStatusCode.NotFound,
+        title = "Node not found",
+        details = "Node with id '${SerializationUtil.longToHex(nodeId)}' ('$nodeId') doesn't exist",
+        type = "/problems/node-not-found",
+        cause = cause,
+    )
+
 /**
  * An [HttpException] indicating that a provided repository name is not valid.
  *
diff --git a/model-server/src/main/kotlin/org/modelix/model/server/handlers/ui/ContentExplorer.kt b/model-server/src/main/kotlin/org/modelix/model/server/handlers/ui/ContentExplorer.kt
@@ -30,23 +30,29 @@ import io.ktor.server.routing.routing
 import kotlinx.html.BODY
 import kotlinx.html.FlowContent
 import kotlinx.html.UL
+import kotlinx.html.a
 import kotlinx.html.b
 import kotlinx.html.body
 import kotlinx.html.br
 import kotlinx.html.button
+import kotlinx.html.classes
 import kotlinx.html.div
+import kotlinx.html.getForm
 import kotlinx.html.h1
 import kotlinx.html.h3
 import kotlinx.html.id
+import kotlinx.html.label
 import kotlinx.html.li
 import kotlinx.html.link
 import kotlinx.html.script
 import kotlinx.html.small
 import kotlinx.html.stream.appendHTML
 import kotlinx.html.style
+import kotlinx.html.submitInput
 import kotlinx.html.table
 import kotlinx.html.tbody
 import kotlinx.html.td
+import kotlinx.html.textInput
 import kotlinx.html.th
 import kotlinx.html.thead
 import kotlinx.html.title
@@ -61,10 +67,12 @@ import org.modelix.model.api.PNodeAdapter
 import org.modelix.model.api.TreePointer
 import org.modelix.model.client.IModelClient
 import org.modelix.model.lazy.BranchReference
+import org.modelix.model.lazy.CLTree
 import org.modelix.model.lazy.CLVersion
 import org.modelix.model.lazy.RepositoryId
 import org.modelix.model.server.ModelServerPermissionSchema
 import org.modelix.model.server.handlers.IRepositoriesManager
+import org.modelix.model.server.handlers.NodeNotFoundException
 import org.modelix.model.server.templates.PageWithMenuBar
 import kotlin.collections.set
 
@@ -109,17 +117,36 @@ class ContentExplorer(private val client: IModelClient, private val repoManager:
                     return@get
                 }
 
+                // IMPORTANT Do not let `expandTo` be an arbitrary string to avoid code injection.
+                // The value of `expandTo` is expanded into JavaScript.
+                val expandTo = call.request.queryParameters["expandTo"]?.let {
+                    it.toLongOrNull() ?: return@get call.respondText("Invalid expandTo value. Provide a node id.", status = HttpStatusCode.BadRequest)
+                }
+
                 repoManager.runWithRepository(repositoryId) {
                     val tree = CLVersion.loadFromHash(versionHash, client.storeCache).getTree()
                     val rootNode = PNodeAdapter(ITree.ROOT_ID, TreePointer(tree))
 
+                    val expandedNodes = expandTo?.let { nodeId -> getAncestorsAndSelf(nodeId, tree) }.orEmpty()
+
                     call.respondHtmlTemplate(PageWithMenuBar("repos/", "../../../../..")) {
                         headContent {
                             title("Content Explorer")
                             link("../../../../../public/content-explorer.css", rel = "stylesheet")
                             script("text/javascript", src = "../../../../../public/content-explorer.js") {}
+                            if (expandTo != null) {
+                                script("text/javascript") {
+                                    unsafe {
+                                        +"""
+                                        document.addEventListener("DOMContentLoaded", function(event) {
+                                            scrollToElement('$expandTo');
+                                        });
+                                        """.trimIndent()
+                                    }
+                                }
+                            }
                         }
-                        bodyContent { contentPageBody(rootNode, versionHash, emptySet()) }
+                        bodyContent { contentPageBody(rootNode, versionHash, expandedNodes, expandTo) }
                     }
                 }
             }
@@ -188,6 +215,17 @@ class ContentExplorer(private val client: IModelClient, private val repoManager:
         }
     }
 
+    private fun getAncestorsAndSelf(expandTo: Long, tree: CLTree): Set<String> {
+        val seq = generateSequence(expandTo) { id ->
+            try {
+                tree.resolveElement(id)?.parentId
+            } catch (e: org.modelix.model.lazy.NodeNotFoundException) {
+                throw NodeNotFoundException(id, e)
+            }
+        }
+        return seq.map { it.toString() }.toSet()
+    }
+
     // The method traverses the expanded tree based on the alreadyExpandedNodeIds and
     // collects the expandable (not empty) nodes which are not expanded yet
     private fun collectExpandableChildNodes(under: PNodeAdapter, alreadyExpandedNodeIds: Set<String>): Set<String> {
@@ -206,7 +244,12 @@ class ContentExplorer(private val client: IModelClient, private val repoManager:
         return emptySet()
     }
 
-    private fun FlowContent.contentPageBody(rootNode: PNodeAdapter, versionHash: String, expandedNodeIds: Set<String>) {
+    private fun FlowContent.contentPageBody(
+        rootNode: PNodeAdapter,
+        versionHash: String,
+        expandedNodeIds: Set<String>,
+        expandTo: Long?,
+    ) {
         h1 { +"Model Server Content" }
         small {
             style = "color: #888; text-align: center; margin-bottom: 15px;"
@@ -223,24 +266,42 @@ class ContentExplorer(private val client: IModelClient, private val repoManager:
                 +"Collapse all"
             }
         }
+        getForm(action = ".") {
+            label {
+                htmlFor = "expandTo"
+                +"Expand to Node: "
+            }
+            textInput {
+                name = "expandTo"
+                placeholder = "nodeId"
+                required = true
+            }
+            submitInput(classes = "btn") {
+                value = "Go"
+            }
+        }
         div {
             id = "treeWrapper"
             ul("treeRoot") {
-                nodeItem(rootNode, expandedNodeIds)
+                nodeItem(rootNode, expandedNodeIds, expandTo)
             }
         }
         div {
             id = "nodeInspector"
         }
     }
 
-    private fun UL.nodeItem(node: PNodeAdapter, expandedNodeIds: Set<String>) {
+    private fun UL.nodeItem(node: PNodeAdapter, expandedNodeIds: Set<String>, expandTo: Long? = null) {
         li("nodeItem") {
+            id = node.nodeId.toString()
             val expanded = expandedNodeIds.contains(node.nodeId.toString())
             if (node.allChildren.toList().isNotEmpty()) {
                 div(if (expanded) "expander expander-expanded" else "expander") { unsafe { +"&#x25B6;" } }
             }
             div("nameField") {
+                if (expandTo == node.nodeId) {
+                    classes += "expandedToNameField"
+                }
                 attributes["data-nodeid"] = node.nodeId.toString()
                 b {
                     val namePropertyUID = BuiltinLanguages.jetbrains_mps_lang_core.INamedConcept.name.getUID()
@@ -268,7 +329,7 @@ class ContentExplorer(private val client: IModelClient, private val repoManager:
                 if (expanded) {
                     ul("nodeTree") {
                         for (child in node.allChildren) {
-                            nodeItem(child as PNodeAdapter, expandedNodeIds)
+                            nodeItem(child as PNodeAdapter, expandedNodeIds, expandTo)
                         }
                     }
                 }
@@ -322,7 +383,14 @@ class ContentExplorer(private val client: IModelClient, private val repoManager:
                             tr {
                                 td { +referenceRole }
                                 td {
-                                    +"${(node.getReferenceTarget(referenceRole) as? PNodeAdapter)?.nodeId}"
+                                    val nodeId = (node.getReferenceTarget(referenceRole) as? PNodeAdapter)?.nodeId
+                                    if (nodeId != null) {
+                                        a("?expandTo=$nodeId") {
+                                            +"$nodeId"
+                                        }
+                                    } else {
+                                        +"null"
+                                    }
                                 }
                                 td {
                                     +"${node.getReferenceTargetRef(referenceRole)?.serialize()}"
diff --git a/model-server/src/main/resources/public/content-explorer.css b/model-server/src/main/resources/public/content-explorer.css
@@ -45,6 +45,10 @@
 .selectedNameField {
     background-color: #c9c9c9;
 }
+.expandedToNameField {
+    border: 2px solid #32cd32;
+    background-color: #90ee90
+}
 #treeWrapper {
     align-self: flex-start;
 }
diff --git a/model-server/src/main/resources/public/content-explorer.js b/model-server/src/main/resources/public/content-explorer.js
@@ -11,6 +11,10 @@ function getExpandedNodeIds() {
         element => element.nextElementSibling?.getAttribute('data-nodeid'));
 }
 
+function scrollToElement(id) {
+    document.getElementById(id).scrollIntoView();
+}
+
 function sendExpandNodeRequest(expandAll) {
     const xhr = new XMLHttpRequest();
     xhr.onreadystatechange = () => {
@@ -40,6 +44,7 @@ function addContentExplorerClickListeners() {
                 selected[j].classList.remove('selectedNameField');
             }
             if (!isSelected) {
+                this.classList.remove('expandedToNameField');
                 this.classList.add('selectedNameField');
             }
         });
diff --git a/model-server/src/test/kotlin/org/modelix/model/server/handlers/ui/ContentExplorerTest.kt b/model-server/src/test/kotlin/org/modelix/model/server/handlers/ui/ContentExplorerTest.kt
@@ -16,12 +16,15 @@
 
 package org.modelix.model.server.handlers.ui
 
+import io.kotest.assertions.ktor.client.shouldHaveStatus
+import io.kotest.matchers.string.shouldContain
 import io.ktor.client.call.body
 import io.ktor.client.request.get
 import io.ktor.client.request.post
 import io.ktor.client.request.setBody
 import io.ktor.client.statement.bodyAsText
 import io.ktor.http.ContentType
+import io.ktor.http.HttpStatusCode
 import io.ktor.http.contentType
 import io.ktor.serialization.kotlinx.json.json
 import io.ktor.server.testing.ApplicationTestBuilder
@@ -138,4 +141,29 @@ class ContentExplorerTest {
         assertTrue { root.`is`(Evaluator.Class("treeRoot")) }
         assertTrue { root.childrenSize() > 0 }
     }
+
+    @Test
+    fun `expanding to non-existing node leads to not found response`() = runTest {
+        val client = createHttpClient()
+        val nodeId = "654321"
+
+        val delta: VersionDelta = client.post("/v2/repositories/node-expand-to/init").body()
+        val versionHash = delta.versionHash
+        val response = client.get("/content/repositories/node-expand-to/versions/$versionHash/?expandTo=$nodeId")
+
+        response shouldHaveStatus HttpStatusCode.NotFound
+        response.bodyAsText() shouldContain nodeId
+    }
+
+    @Test
+    fun `illegal expandTo value leads to bad request response`() = runTest {
+        val client = createHttpClient()
+        val nodeId = "illegalId"
+
+        val delta: VersionDelta = client.post("/v2/repositories/node-expand-to/init").body()
+        val versionHash = delta.versionHash
+        val response = client.get("/content/repositories/node-expand-to/versions/$versionHash/?expandTo=$nodeId")
+
+        response shouldHaveStatus HttpStatusCode.BadRequest
+    }
 }

Original file line number	Diff line number	Diff line change
`@@ -45,6 +45,10 @@`
`45`	`45`	`.selectedNameField {`
`46`	`46`	`background-color: #c9c9c9;`
`47`	`47`	`}`
	`48`	`+.expandedToNameField {`
	`49`	`+ border: 2px solid #32cd32;`
	`50`	`+ background-color: #90ee90`
	`51`	`+}`
`48`	`52`	`#treeWrapper {`
`49`	`53`	`align-self: flex-start;`
`50`	`54`	`}`
Original file line number	Diff line number	Diff line change
`@@ -11,6 +11,10 @@ function getExpandedNodeIds() {`
`11`	`11`	`element => element.nextElementSibling?.getAttribute('data-nodeid'));`
`12`	`12`	`}`
`13`	`13`
	`14`	`+function scrollToElement(id) {`
	`15`	`+ document.getElementById(id).scrollIntoView();`
	`16`	`+}`
	`17`	`+`
`14`	`18`	`function sendExpandNodeRequest(expandAll) {`
`15`	`19`	`const xhr = new XMLHttpRequest();`
`16`	`20`	`xhr.onreadystatechange = () => {`
`@@ -40,6 +44,7 @@ function addContentExplorerClickListeners() {`
`40`	`44`	`selected[j].classList.remove('selectedNameField');`
`41`	`45`	`}`
`42`	`46`	`if (!isSelected) {`
	`47`	`+ this.classList.remove('expandedToNameField');`
`43`	`48`	`this.classList.add('selectedNameField');`
`44`	`49`	`}`
`45`	`50`	`});`