Dev UI: Replaced internal components with Qomponent

Signed-off-by: Phillip Kruger <[email protected]>

bom/dev-ui/pom.xml

@@ -13,7 +13,7 @@
     <description>Dependency management for dev-ui. Importable by third party extension developers.</description>
 
     <properties>
-        <vaadin.version>24.3.11</vaadin.version>
+        <vaadin.version>24.3.13</vaadin.version>
         <lit.version>3.1.3</lit.version>
         <lit-element.version>4.0.5</lit-element.version>
         <lit-html.version>3.1.3</lit-html.version>
@@ -28,10 +28,11 @@
         <vaadin-router.version>1.7.5</vaadin-router.version>
         <lit-state.version>1.7.0</lit-state.version>
         <echarts.version>5.5.0</echarts.version>
-        <codeblock.version>1.0.13</codeblock.version>
         <es-module-shims.version>1.9.0</es-module-shims.version>
         <path-to-regexp.version>2.4.0</path-to-regexp.version>
-
+        <codeblock.version>1.0.16</codeblock.version>
+        <qomponent.version>1.0.0</qomponent.version>
+
         <hpcc-js-wasm.version>2.15.3</hpcc-js-wasm.version>
         <yargs.version>17.7.2</yargs.version>
         <cliui.version>8.0.1</cliui.version>
@@ -268,6 +269,14 @@
                 <scope>runtime</scope>
             </dependency>
 
+            <!-- Qomponent -->
+            <dependency>
+                <groupId>org.mvnpm.at.mvnpm</groupId>
+                <artifactId>qomponent</artifactId>
+                <version>${qomponent.version}</version>
+                <scope>runtime</scope>
+            </dependency>
+
             <!-- Polyfill for importmaps -->
             <dependency>
                 <groupId>org.mvnpm</groupId>

extensions/vertx-http/deployment/src/main/java/io/quarkus/devui/deployment/BuildTimeContentProcessor.java

@@ -108,11 +108,12 @@ InternalImportMapBuildItem createKnownInternalImportMap(NonApplicationRootPathBu
         internalImportMapBuildItem.add("qwc-server-log", contextRoot + "qwc/qwc-server-log.js");
         internalImportMapBuildItem.add("qwc-extension-link", contextRoot + "qwc/qwc-extension-link.js");
         // Quarkus UI
-        internalImportMapBuildItem.add("qui/", contextRoot + "qui/");
-        internalImportMapBuildItem.add("qui-card", contextRoot + "qui/qui-card.js");
 
-        internalImportMapBuildItem.add("qui-badge", contextRoot + "qui/qui-badge.js");
-        internalImportMapBuildItem.add("qui-alert", contextRoot + "qui/qui-alert.js");
+        //        internalImportMapBuildItem.add("qui/", contextRoot + "qui/");
+        //        internalImportMapBuildItem.add("qui-card", contextRoot + "qui/qui-card.js");
+
+        //internalImportMapBuildItem.add("qui-badge", contextRoot + "qui/qui-badge.js");
+        //internalImportMapBuildItem.add("qui-alert", contextRoot + "qui/qui-alert.js");
         internalImportMapBuildItem.add("qui-ide-link", contextRoot + "qui/qui-ide-link.js");
 
         // Echarts
@@ -144,6 +145,28 @@ InternalImportMapBuildItem createKnownInternalImportMap(NonApplicationRootPathBu
         return internalImportMapBuildItem;
     }
 
+    @BuildStep(onlyIf = IsDevelopment.class)
+    RelocationImportMapBuildItem createRelocationMap() {
+
+        RelocationImportMapBuildItem relocationImportMapBuildItem = new RelocationImportMapBuildItem();
+
+        // Backward compatibility mappings
+        relocationImportMapBuildItem.add("@quarkus-webcomponents/codeblock/", "@qomponent/qui-code-block/");
+        relocationImportMapBuildItem.add("@quarkus-webcomponents/codeblock", "@qomponent/qui-code-block");
+
+        relocationImportMapBuildItem.add("qui-badge", "@qomponent/qui-badge");
+        relocationImportMapBuildItem.add("qui/qui-badge.js", "@qomponent/qui-badge");
+
+        relocationImportMapBuildItem.add("qui-alert", "@qomponent/qui-alert");
+        relocationImportMapBuildItem.add("qui/qui-alert.js", "@qomponent/qui-alert");
+
+        relocationImportMapBuildItem.add("qui-card", "@qomponent/qui-card");
+        relocationImportMapBuildItem.add("qui/qui-card.js", "@qomponent/qui-card");
+
+        return relocationImportMapBuildItem;
+
+    }
+
     /**
      * Here we map all the pages (as defined by the extensions) build time data
      *
@@ -312,7 +335,8 @@ QuteTemplateBuildItem createIndexHtmlTemplate(
             MvnpmBuildItem mvnpmBuildItem,
             ThemeVarsBuildItem themeVarsBuildItem,
             NonApplicationRootPathBuildItem nonApplicationRootPathBuildItem,
-            List<InternalImportMapBuildItem> internalImportMapBuildItems) {
+            List<InternalImportMapBuildItem> internalImportMapBuildItems,
+            RelocationImportMapBuildItem relocationImportMapBuildItem) {
         QuteTemplateBuildItem quteTemplateBuildItem = new QuteTemplateBuildItem(
                 QuteTemplateBuildItem.DEV_UI);
 
@@ -321,6 +345,22 @@ QuteTemplateBuildItem createIndexHtmlTemplate(
             Map<String, String> importMap = importMapBuildItem.getImportMap();
             aggregator.addMappings(importMap);
         }
+
+        Map<String, String> currentImportMap = aggregator.aggregate(nonApplicationRootPathBuildItem.getNonApplicationRootPath())
+                .getImports();
+        Map<String, String> relocationMap = relocationImportMapBuildItem.getRelocationMap();
+        for (Map.Entry<String, String> relocation : relocationMap.entrySet()) {
+            String from = relocation.getKey();
+            String to = relocation.getValue();
+
+            if (currentImportMap.containsKey(to)) {
+                String newTo = currentImportMap.get(to);
+                aggregator.addMapping(from, newTo);
+            } else {
+                log.warnf("Could not relocate " + from + " as " + to + " does not exist in the importmap");
+            }
+        }
+
         String esModuleShimsVersion = extractEsModuleShimsVersion(mvnpmBuildItem.getMvnpmJars());
         String importmap = aggregator.aggregateAsJson(nonApplicationRootPathBuildItem.getNonApplicationRootPath());
         aggregator.reset();

extensions/vertx-http/deployment/src/main/java/io/quarkus/devui/deployment/RelocationImportMapBuildItem.java

@@ -0,0 +1,26 @@
+package io.quarkus.devui.deployment;
+
+import java.util.HashMap;
+import java.util.Map;
+
+import io.quarkus.builder.item.SimpleBuildItem;
+
+/**
+ * Used internally to relocate namespaces for backward compatibility
+ */
+public final class RelocationImportMapBuildItem extends SimpleBuildItem {
+
+    private final Map<String, String> relocations = new HashMap<>();
+
+    public RelocationImportMapBuildItem() {
+
+    }
+
+    public void add(String from, String to) {
+        this.relocations.put(from, to);
+    }
+
+    public Map<String, String> getRelocationMap() {
+        return relocations;
+    }
+}

extensions/vertx-http/dev-ui-resources/pom.xml

@@ -105,6 +105,13 @@
             <scope>runtime</scope>
         </dependency>
 
+        <!-- Qomponent -->
+        <dependency>
+            <groupId>org.mvnpm.at.mvnpm</groupId>
+            <artifactId>qomponent</artifactId>
+            <scope>runtime</scope>
+        </dependency>
+
         <!-- Polyfill for importmaps -->
         <dependency>
             <groupId>org.mvnpm</groupId>