From 118e23cc8c3adf0c9aaa2d8456ae237e5b9c4189 Mon Sep 17 00:00:00 2001
From: Johannes Wolf <mail@johannes-wolf.com>
Date: Fri, 16 Aug 2024 14:44:20 +0200
Subject: [PATCH] Fix SourceData inspector styling

---
 .../app/inspection.panel.component.ts         | 18 ++++++++++++-
 .../app/sourcedata.panel.component.ts         | 26 ++++++++-----------
 package-lock.json                             |  2 +-
 3 files changed, 29 insertions(+), 17 deletions(-)

diff --git a/erdblick_app/app/inspection.panel.component.ts b/erdblick_app/app/inspection.panel.component.ts
index 12c80616..3d7e535d 100644
--- a/erdblick_app/app/inspection.panel.component.ts
+++ b/erdblick_app/app/inspection.panel.component.ts
@@ -35,7 +35,23 @@ interface InspectorTab {
                 </ng-template>
             </p-accordionTab>
         </p-accordion>
-    `
+    `,
+    styles: [
+        `@layer erdblick {
+            .inspector-title {
+                display: flex;
+                gap: 4px;
+                justify-content: center;
+                align-items: center;
+
+                .p-button {
+                    width: 30px;
+                    height: 30px;
+                    margin: 0;
+                }
+            }
+        }`,
+    ]
 })
 export class InspectionPanelComponent implements OnInit
 {
diff --git a/erdblick_app/app/sourcedata.panel.component.ts b/erdblick_app/app/sourcedata.panel.component.ts
index a8bf2c11..d846ddf8 100644
--- a/erdblick_app/app/sourcedata.panel.component.ts
+++ b/erdblick_app/app/sourcedata.panel.component.ts
@@ -45,9 +45,7 @@ import {TreeTable} from "primeng/treetable";
 
                     <ng-template pTemplate="header">
                         <tr>
-                            <th *ngFor="let col of columns"
-                                [ngStyle]="{width: col.width ? col.width + 'px' : 'auto'}"
-                            >
+                            <th *ngFor="let col of columns">
                                 {{ col.header }}
                             </th>
                         </tr>
@@ -55,9 +53,7 @@ import {TreeTable} from "primeng/treetable";
 
                     <ng-template pTemplate="body" let-rowNode let-rowData="rowData">
                         <tr [ttRow]="rowNode" [class]="rowData.styleClass || ''">
-                            <td *ngFor="let col of columns; let i = index"
-                                [ngStyle]="{width: col.width ? col.width + 'px' : 'auto'}"
-                            >
+                            <td *ngFor="let col of columns; let i = index">
                                 <p-treeTableToggler [rowNode]="rowNode" *ngIf="i == 0" />
                                 <span *ngIf="filterFields.indexOf(col.key) != -1" [innerHTML]="col.transform(rowData[col.key]) | highlight: filterString"></span>
                                 <span *ngIf="filterFields.indexOf(col.key) == -1" [innerHTML]="col.transform(rowData[col.key])"></span>
@@ -182,22 +178,23 @@ export class SourceDataPanelComponent implements OnInit {
 
     selectItemWithAddress(address: bigint) {
         let searchAddress: any = address;
+        let addressInRange: any;
         if (this.addressFormat == coreLib.SourceDataAddressFormat.BIT_RANGE) {
             searchAddress = {
                 offset: address >> BigInt(32) & BigInt(0xFFFFFFFF),
                 size: address & BigInt(0xFFFFFFFF),
             }
-        }
 
-        console.log(`Highlighting item with address`, searchAddress);
-        const addressLow = typeof searchAddress === 'object' ? searchAddress['offset'] : searchAddress;
-        const addressHigh = addressLow + (typeof searchAddress === 'object' ? searchAddress['size'] : searchAddress);
+            const addressLow = typeof searchAddress === 'object' ? searchAddress['offset'] : searchAddress;
+            const addressHigh = addressLow + (typeof searchAddress === 'object' ? searchAddress['size'] : searchAddress);
 
-        let addressInRange = (addr: any) => {
-            if (typeof addr === 'object') {
+            addressInRange = (addr: any) => {
                 return addr.offset >= addressLow && addr.offset + addr.size <= addressHigh;
             }
-            return addr == searchAddress
+        } else {
+            addressInRange = (addr: any) => {
+                return addr == searchAddress;
+            }
         }
 
         // Virtual row index (visible row index) of the first highlighted row, or undefined.
@@ -230,6 +227,7 @@ export class SourceDataPanelComponent implements OnInit {
             }
         };
 
+        console.log(`Highlighting item with address`, searchAddress);
         this.treeData.forEach((item: TreeTableNode, index) => {
             select(item, [], false, index);
         });
@@ -251,6 +249,4 @@ export class SourceDataPanelComponent implements OnInit {
             this.clearFilter();
         }
     }
-
-    protected readonly HTMLInputElement = HTMLInputElement;
 }
diff --git a/package-lock.json b/package-lock.json
index 71e08b5d..f938ce07 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -28,7 +28,7 @@
                 "js-yaml": "^4.1.0",
                 "material-icons": "^1.13.12",
                 "primeicons": "^7.0.0",
-                "primeng": "^17.18.0",
+                "primeng": "17.18.7",
                 "rxjs": "~7.8.1",
                 "stream-browserify": "^3.0.0",
                 "stream-http": "^3.2.0",