Fixes for https://github.com/homebridge/homebridge/issues/3453

.github/workflows/release.yml

@@ -27,3 +27,36 @@ jobs:
       install_cmd: npm ci && cd ui && npm ci
     secrets:
       npm_auth_token: ${{ secrets.npm_token }}
+  build:
+    needs: publish
+    name: Attach Artifact
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Setup node
+        uses: actions/setup-node@v1
+        with:
+          node-version: 20.x
+
+      # Sanity check to ensure that release tags don't start with a 'v' version prefix but adhere to the X.Y.Z format
+      - name: Check for Tag name Format
+        # https://github.com/orgs/community/discussions/25017
+        if: startsWith(github.event.release.tag_name, 'v')
+        run: |
+          echo "Release Tag name must not start with 'v', this was supplied ${{github.event.release.tag_name}}"
+          exit 1
+
+      - name: Install package
+        run: |
+          export npm_config_prefix=$(pwd)/package
+          npm install -g homebridge-config-ui-x@${{ github.event.release.tag_name }}
+      - name: Create Bundle
+        run: |
+          tar -C $(pwd)/package --owner=0 --group=0 --format=posix -czvf homebridge-config-ui-x-${{ github.event.release.tag_name }}.tar.gz .
+          shasum -a 256 homebridge-config-ui-x-${{ github.event.release.tag_name }}.tar.gz > SHASUMS256.txt
+      - name: Attach Bundle
+        uses: AButler/upload-release-assets@v2.0
+        with:
+          files: 'homebridge-config-ui-x-${{ github.event.release.tag_name }}.tar.gz;SHASUMS256.txt'
+          repo-token: ${{ secrets.GITHUB_TOKEN }}
+          release-tag: ${{ github.event.release.tag_name }}      

CHANGELOG.md

@@ -1,10 +1,18 @@
+## 4.51.1 (2023-10-25)
+
+### Bug Fixes
+  - Fixes for Updating Node.js from vx.xx to v20.9.0...fails, node: /usr/lib/arm-linux-gnueabihf/libstdc++.so.6: version `GLIBCXX_3.4.26' not found (required by node) ([3453](https://github.com/homebridge/homebridge/issues/3453)
+  - Fix for unable to update Nodesource based nodejs version #1603
+  - Colon Markdown emojis are not parsed as they are on GitHub #1601
+  - Prevent tooltip from displaying after Node.js modal #1600
+
 ## 4.51.0 (2023-10-23)
 
 ### Notable Changes
 
 - **Node Support**
   - ⚠️ Node 16 has reached end-of-life and is no longer supported by the Homebridge UI.
-    - Starting with v4.50.7, the Homebridge UI will no longer work with Node 16, only Node 18 and 20
+    - Starting with v4.51.0, the Homebridge UI will no longer work with Node 16, only Node 18 and 20
     - Homebridge UI follows the same Node support schedule as Homebridge. See the [How-To-Update-Node.js](https://github.com/homebridge/homebridge/wiki/How-To-Update-Node.js) page in the Homebridge wiki for more information
 
 - **Plugins**

package.json

@@ -1,7 +1,7 @@
 {
   "name": "homebridge-config-ui-x",
   "displayName": "Homebridge UI",
-  "version": "4.51.0",
+  "version": "4.51.1",
   "description": "A web based management, configuration and control platform for Homebridge.",
   "license": "MIT",
   "author": "oznu <dev@oz.nu>",
@@ -72,6 +72,7 @@
     "class-validator": "0.14.0",
     "commander": "7.2.0",
     "dayjs": "1.11.10",
+    "emoji-js": "^3.7.0",
     "fastify": "4.23.2",
     "fs-extra": "10.1.0",
     "node-cache": "5.1.2",
@@ -152,4 +153,4 @@
     "smart home",
     "hb-service"
   ]
-}
+}

src/bin/platforms/linux.ts

@@ -336,6 +336,11 @@ export class LinuxInstaller extends BasePlatform {
             `Wanted: >=2.28. Installed: ${glibcVersion}`, 'fail');
           process.exit(1);
         }
+        if (semver.gte(job.target, '20.0.0') && glibcVersion < 2.29) {
+          this.hbService.logger('Your version of Linux does not meet the GLIBC version requirements to use this tool to upgrade Node.js. ' +
+            `Wanted: >=2.29. Installed: ${glibcVersion}`, 'fail');
+          process.exit(1);
+        }
       }
     } catch (e) {
       const osInfo = await si.osInfo();
@@ -429,7 +434,7 @@ export class LinuxInstaller extends BasePlatform {
       }
 
       // update repo
-      child_process.execSync(`echo "deb [signed-by=/etc/apt/keyrings/nodesource.gpg] https://deb.nodesource.com/node_${majorVersion}.x nodistro main" | sudo tee /etc/apt/sources.list.d/nodesource.list`, {
+      child_process.execSync(`echo "deb [signed-by=/etc/apt/keyrings/nodes] https://deb.nodesource.com/node_${majorVersion}.x nodistro main" | sudo tee /etc/apt/sources.list.d/nodesource.list`, {
         stdio: 'inherit',
       });
 

ui/angular.json

@@ -61,7 +61,8 @@
               "xterm",
               "xterm-addon-fit",
               "xterm-addon-web-links",
-              "mobile-detect"
+              "mobile-detect",
+              "emoji-js"
             ],
             "aot": false,
             "stylePreprocessorOptions": {

ui/src/app/core/core.module.ts

@@ -7,7 +7,7 @@ import { SpinnerComponent } from './components/spinner/spinner.component';
 import { ConvertTempPipe } from './pipes/convert-temp.pipe';
 import { ReplacePipe } from './pipes/replace.pipe';
 import { ExternalLinkIconPipe } from './pipes/external-link-icon.pipe';
-import { HrefTargetBlankDirective } from './directives/href-target-blank.directive';
+import { PluginsMarkdownDirective } from './directives/plugins.markdown.directive';
 import { LongClickDirective } from './directives/longclick.directive';
 import { BackupRestoreComponent } from './backup-restore/backup-restore.component';
 import { ScheduledBackupsComponent } from './backup-restore/scheduled-backups/scheduled-backups.component';
@@ -24,7 +24,7 @@ import { JsonSchemaFormPatchDirective } from './directives/json-schema-form-patc
         ConvertTempPipe,
         ReplacePipe,
         ExternalLinkIconPipe,
-        HrefTargetBlankDirective,
+        PluginsMarkdownDirective,
         LongClickDirective,
         RtlDirective,
         JsonSchemaFormPatchDirective,
@@ -46,7 +46,7 @@ import { JsonSchemaFormPatchDirective } from './directives/json-schema-form-patc
         ConvertTempPipe,
         ReplacePipe,
         ExternalLinkIconPipe,
-        HrefTargetBlankDirective,
+        PluginsMarkdownDirective,
         LongClickDirective,
         RtlDirective,
         JsonSchemaFormPatchDirective,

ui/src/app/core/directives/href-target-blank.directive.ts → ui/src/app/core/directives/plugins.markdown.directive.ts

@@ -1,9 +1,10 @@
 import { Directive, ElementRef, OnInit } from '@angular/core';
+import { EmojiConvertor } from 'emoji-js';
 
 @Directive({
-  selector: '[hrefTargetBlank]',
+  selector: 'markdown',
 })
-export class HrefTargetBlankDirective implements OnInit {
+export class PluginsMarkdownDirective implements OnInit {
 
   constructor(
     private el: ElementRef,
@@ -16,6 +17,10 @@ export class HrefTargetBlankDirective implements OnInit {
       a.target = '_blank';
       a.rel = 'noopener noreferrer';
     });
+
+    // replace colon emojis
+    const emoji = new EmojiConvertor();
+    this.el.nativeElement.innerHTML = emoji.replace_colons(this.el.nativeElement.innerHTML);
   }
 
 }

ui/src/app/core/manage-plugins/custom-plugins/homebridge-google-smarthome/homebridge-google-smarthome.component.html

@@ -47,7 +47,7 @@ <h4 class="mt-2">
     </div>
 
     <div class="mt-3" *ngIf="gshConfig && gshConfig.token">
-      <markdown hrefTargetBlank class="plugin-md" [data]="schema.footerDisplay" *ngIf="schema.footerDisplay">
+      <markdown class="plugin-md" [data]="schema.footerDisplay" *ngIf="schema.footerDisplay">
       </markdown>
     </div>
 

ui/src/app/core/manage-plugins/manage-plugins-modal/manage-plugins-modal.component.html

@@ -17,7 +17,7 @@ <h3 class="text-center primary-text" [translate]="'platform.version.title_servic
       </div>
       <hr>
     </div>
-    <markdown hrefTargetBlank class="plugin-md" [data]="changeLog"></markdown>
+    <markdown class="plugin-md" [data]="changeLog"></markdown>
   </div>
   <div *ngIf="!onlineUpdateOk" class="modal-body">
     <h4 class="primary-text text-center" [translate]="'plugins.manage.label_manual_update_required'">
@@ -41,7 +41,7 @@ <h4 class="primary-text text-center" [translate]="'plugins.manage.label_manual_u
   <div *ngIf="showReleaseNotes && !actionComplete" class="modal-body plugin-modal-body">
     <h3>Release Notes</h3>
     <h5>{{ release.name }}</h5>
-    <markdown hrefTargetBlank class="plugin-md" [data]="release.changelog"></markdown>
+    <markdown class="plugin-md" [data]="release.changelog"></markdown>
   </div>
   <div class="modal-footer" *ngIf="!onlineUpdateOk || actionComplete || showReleaseNotes || actionFailed">
     <button type="button" class="btn btn-elegant" data-dismiss="modal" (click)="activeModal.dismiss('Cross click')"

ui/src/app/core/manage-plugins/settings-plugins-modal/settings-plugins-modal.component.html

@@ -11,7 +11,7 @@ <h5 class="modal-title">
   </div>
   <div class="modal-body">
     <div>
-      <markdown hrefTargetBlank class="plugin-md" [data]="schema.headerDisplay | interpolateMd"
+      <markdown class="plugin-md" [data]="schema.headerDisplay | interpolateMd"
         *ngIf="schema.headerDisplay"></markdown>
     </div>
 
@@ -50,7 +50,7 @@ <h5 class="m-0">{{ block.name }}</h5>
     </div>
 
     <div class="mt-3">
-      <markdown hrefTargetBlank class="plugin-md" [data]="schema.footerDisplay | interpolateMd"
+      <markdown class="plugin-md" [data]="schema.footerDisplay | interpolateMd"
         *ngIf="schema.footerDisplay"></markdown>
     </div>
   </div>

ui/src/app/modules/plugins/plugin-card/plugin-card.component.html

@@ -52,7 +52,7 @@ <h4 class="card-title mb-0">
     </a>
     <a href="javascript:void(0)" class="card-link" *ngIf="plugin.updateAvailable" (click)="$plugin.updatePlugin(plugin)"
        placement="bottom" ngbTooltip="{{'plugins.tooltip_update_plugin_to' | translate:plugin }}" container="body"
-       openDelay="150" [translate]="'plugins.button_update'">
+       openDelay="150" [translate]="'plugins.button_update'" triggers="hover">
       {{ 'plugins.button_update' | translate | uppercase }}
     </a>
     <a href="javascript:void(0)" class="card-link" *ngIf="!plugin.installedVersion"