Merge pull request quarkusio#45912 from phillip-kruger/dev-ui-hiberna…

…te-loading Dev UI: Make ORM Screen hot reload aware, add some more error handing
geoand · Jan 28, 2025 · ed97778 · ed97778
2 parents a7c6f11 + 4d94643
commit ed97778
Show file tree

Hide file tree

Showing 3 changed files with 89 additions and 16 deletions.
diff --git a/extensions/hibernate-orm/deployment/src/main/resources/dev-ui/hibernate-orm-entity-types.js b/extensions/hibernate-orm/deployment/src/main/resources/dev-ui/hibernate-orm-entity-types.js
@@ -1,15 +1,23 @@
-import { LitElement, html, css} from 'lit';
+import { QwcHotReloadElement, html, css} from 'qwc-hot-reload-element';
 import { JsonRpc } from 'jsonrpc';
 import '@vaadin/icon';
 import '@vaadin/button';
 import '@vaadin/grid';
+import '@vaadin/progress-bar';
 import { columnBodyRenderer } from '@vaadin/grid/lit.js';
+import { notifier } from 'notifier';
 
-export class HibernateOrmEntityTypesComponent extends LitElement {
+export class HibernateOrmEntityTypesComponent extends QwcHotReloadElement {
 
     static styles = css`
+        :host {
+            display: flex;
+            padding-left: 10px;
+            padding-right: 10px;
+        }
         .full-height {
-          height: 100%;
+            height: 100%;
+            width: 100%;
         }
     `;
 
@@ -19,24 +27,40 @@ export class HibernateOrmEntityTypesComponent extends LitElement {
         _persistenceUnits: {state: true, type: Array}
     }
 
+    constructor() {
+        super();
+        this._persistenceUnits = [];
+    }
+
     connectedCallback() {
         super.connectedCallback();
+        this.hotReload();
+    }
+
+    hotReload(){
         this.jsonRpc.getInfo().then(response => {
             this._persistenceUnits = response.result.persistenceUnits;
+        }).catch(error => {
+            console.error("Failed to fetch persistence units:", error);
+            this._persistenceUnits = []; 
+            notifier.showErrorMessage("Failed to fetch persistence units: " + error, "bottom-start", 30);
         });
     }
 
     render() {
         if (this._persistenceUnits) {
             return this._renderAllPUs();
         } else {
-            return html`<span>Loading...</span>`;
+            return html`<div style="color: var(--lumo-secondary-text-color);width: 95%;" >
+                            <div>Fetching persistence units...</div>
+                            <vaadin-progress-bar indeterminate></vaadin-progress-bar>
+                        </div>`;
         }
     }
 
     _renderAllPUs() {
         return this._persistenceUnits.length == 0
-            ? html`<p>No persistence units were found.</p>`
+            ? html`<p>No persistence units were found. <vaadin-button @click="${this.hotReload}" theme="small">Check again</vaadin-button></p>`
             : html`
                     <vaadin-tabsheet class="full-height">
                         <span slot="prefix">Persistence Unit</span>

diff --git a/extensions/hibernate-orm/deployment/src/main/resources/dev-ui/hibernate-orm-named-queries.js b/extensions/hibernate-orm/deployment/src/main/resources/dev-ui/hibernate-orm-named-queries.js
@@ -1,15 +1,23 @@
-import { LitElement, html, css} from 'lit';
+import { QwcHotReloadElement, html, css} from 'qwc-hot-reload-element';
 import { JsonRpc } from 'jsonrpc';
 import '@vaadin/icon';
 import '@vaadin/button';
 import '@vaadin/grid';
+import '@vaadin/progress-bar';
 import { columnBodyRenderer } from '@vaadin/grid/lit.js';
+import { notifier } from 'notifier';
 
-export class HibernateOrmNamedQueriesComponent extends LitElement {
+export class HibernateOrmNamedQueriesComponent extends QwcHotReloadElement {
 
     static styles = css`
+        :host {
+            display: flex;
+            padding-left: 10px;
+            padding-right: 10px;
+        }
         .full-height {
-          height: 100%;
+            height: 100%;
+            width: 100%;
         }
     `;
 
@@ -19,24 +27,40 @@ export class HibernateOrmNamedQueriesComponent extends LitElement {
         _persistenceUnits: {state: true, type: Array}
     }
 
+    constructor() {
+        super();
+        this._persistenceUnits = [];
+    }
+
     connectedCallback() {
         super.connectedCallback();
+        this.hotReload();
+    }
+
+    hotReload(){
         this.jsonRpc.getInfo().then(response => {
             this._persistenceUnits = response.result.persistenceUnits;
+        }).catch(error => {
+            console.error("Failed to fetch persistence units:", error);
+            this._persistenceUnits = []; 
+            notifier.showErrorMessage("Failed to fetch persistence units: " + error, "bottom-start", 30);
         });
     }
 
     render() {
         if (this._persistenceUnits) {
             return this._renderAllPUs();
         } else {
-            return html`<span>Loading...</span>`;
+            return html`<div style="color: var(--lumo-secondary-text-color);width: 95%;" >
+                            <div>Fetching persistence units...</div>
+                            <vaadin-progress-bar indeterminate></vaadin-progress-bar>
+                        </div>`;
         }
     }
 
     _renderAllPUs() {
         return this._persistenceUnits.length == 0
-            ? html`<p>No persistence units were found.</p>`
+            ? html`<p>No persistence units were found. <vaadin-button @click="${this.hotReload}" theme="small">Check again</vaadin-button></p>`
             : html`
                     <vaadin-tabsheet class="full-height">
                         <span slot="prefix">Persistence Unit</span>
@@ -59,7 +83,7 @@ export class HibernateOrmNamedQueriesComponent extends LitElement {
 
     _renderNamedQueriesTable(pu) {
         if (pu.namedQueries.length == 0) {
-            return html`<p>No named queries were found.</p>`
+            return html`<p>No named queries were found. <vaadin-button @click="${this.hotReload}" theme="small">Check again</vaadin-button></p>`
         }
         return html`
                 <vaadin-grid .items="${pu.namedQueries}" class="datatable" theme="no-border row-stripes">

diff --git a/...ons/hibernate-orm/deployment/src/main/resources/dev-ui/hibernate-orm-persistence-units.js b/...ons/hibernate-orm/deployment/src/main/resources/dev-ui/hibernate-orm-persistence-units.js
@@ -1,19 +1,26 @@
-import { LitElement, html, css} from 'lit';
+import { QwcHotReloadElement, html, css} from 'qwc-hot-reload-element';
 import { JsonRpc } from 'jsonrpc';
 import '@vaadin/icon';
 import '@vaadin/button';
 import '@vaadin/grid';
+import '@vaadin/progress-bar';
 import { columnBodyRenderer } from '@vaadin/grid/lit.js';
 import { notifier } from 'notifier';
 import { observeState } from 'lit-element-state';
 import { themeState } from 'theme-state';
 import '@quarkus-webcomponents/codeblock';
 
-export class HibernateOrmPersistenceUnitsComponent extends observeState(LitElement) {
+export class HibernateOrmPersistenceUnitsComponent extends observeState(QwcHotReloadElement) {
 
     static styles = css`
+        :host {
+            display: flex;
+            padding-left: 10px;
+            padding-right: 10px;
+        }
         .full-height {
-          height: 100%;
+            height: 100%;
+            width: 100%;
         }
         a.script-heading {
             display: block;
@@ -29,24 +36,42 @@ export class HibernateOrmPersistenceUnitsComponent extends observeState(LitEleme
         _persistenceUnits: {state: true, type: Array}
     }
 
+    constructor() {
+        super();
+        this._persistenceUnits = [];
+    }
+
     connectedCallback() {
         super.connectedCallback();
+        this.hotReload();
+    }
+
+    hotReload(){
         this.jsonRpc.getInfo().then(response => {
             this._persistenceUnits = response.result.persistenceUnits;
+        }).catch(error => {
+            console.error("Failed to fetch persistence units:", error);
+            this._persistenceUnits = []; 
+            notifier.showErrorMessage("Failed to fetch persistence units: " + error, "bottom-start", 30);
         });
     }
 
     render() {
         if (this._persistenceUnits) {
             return this._renderAllPUs();
         } else {
-            return html`<span>Loading...</span>`;
+            return html`<div style="color: var(--lumo-secondary-text-color);width: 95%;" >
+                            <div>Fetching persistence units...</div>
+                            <vaadin-progress-bar indeterminate></vaadin-progress-bar>
+                        </div>`;
         }
     }
 
     _renderAllPUs() {
         return this._persistenceUnits.length == 0
-            ? html`<p>No persistence units were found.</p>`
+            ? html`<p>No persistence units were found. 
+                        <vaadin-button @click="${this.hotReload}" theme="small">Check again</vaadin-button>
+                    </p>`
             : html`
                     <vaadin-tabsheet class="full-height">
                         <span slot="prefix">Persistence Unit</span>