From 64a1e0a47e23d9d50e0942fca4698092a321e0bd Mon Sep 17 00:00:00 2001
From: Florian Hotze <florianh_dev@icloud.com>
Date: Fri, 1 Mar 2024 17:35:27 +0100
Subject: [PATCH] Add-on logo: Fix jdbc logos not loading & list-item logo
 distorted (#2440)

Signed-off-by: Florian Hotze <florianh_dev@icloud.com>
---
 .../web/src/components/addons/addon-list-item.vue         | 3 ++-
 .../web/src/components/addons/addon-logo.vue              | 8 ++++----
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/bundles/org.openhab.ui/web/src/components/addons/addon-list-item.vue b/bundles/org.openhab.ui/web/src/components/addons/addon-list-item.vue
index aba45f9ddb..1270cffbcc 100644
--- a/bundles/org.openhab.ui/web/src/components/addons/addon-list-item.vue
+++ b/bundles/org.openhab.ui/web/src/components/addons/addon-list-item.vue
@@ -11,7 +11,7 @@
     <div v-else-if="addon.properties && addon.properties.views" slot="subtitle">
       <addon-stats-line :addon="addon" :iconSize="15" />
     </div>
-    <addon-logo slot="media" class="logo-square" :addon="addon" size="64" logo-width="54" />
+    <addon-logo slot="media" class="logo-square" :addon="addon" size="64" />
     <div v-if="showInstallActions" slot="after">
       <f7-preloader v-if="addon.pending" color="blue" />
       <f7-button v-else-if="addon.installed" class="install-button prevent-active-state-propagation" text="Remove" color="red" round small @click="buttonClicked" />
@@ -37,6 +37,7 @@
     .logo
       margin-left 0
       max-height 54px
+      max-width 54px
   .item-media i
     padding-left 3px
   .item-after
diff --git a/bundles/org.openhab.ui/web/src/components/addons/addon-logo.vue b/bundles/org.openhab.ui/web/src/components/addons/addon-logo.vue
index df66615588..f4aa75cc4a 100644
--- a/bundles/org.openhab.ui/web/src/components/addons/addon-logo.vue
+++ b/bundles/org.openhab.ui/web/src/components/addons/addon-logo.vue
@@ -1,10 +1,10 @@
 <template>
   <div>
     <f7-icon v-show="!logoLoaded" :size="size" color="gray" :f7="addonIcon" class="default-icon" style="padding-left: 0; opacity: 0.2; position: absolute" />
-    <img v-if="!svgLogoError" class="lazy logo" :style="imgStyle" :width="logoWidth" ref="svgLogo"
+    <img v-if="!svgLogoError" class="lazy logo" :style="imgStyle" ref="svgLogo"
          :data-src="imageUrl('svg')">
     <img v-else-if="!pngLogoError" class="logo" :style="imgStyle" ref="pngLogo"
-         :src="imageUrl('png')" :width="logoWidth" @load="logoLoaded = true" @error="pngLogoError = true">
+         :src="imageUrl('png')" @load="logoLoaded = true" @error="pngLogoError = true">
   </div>
 </template>
 
@@ -12,7 +12,7 @@
 import { AddonIcons } from '@/assets/addon-store'
 
 export default {
-  props: ['addon', 'size', 'logoWidth'],
+  props: ['addon', 'size'],
   data () {
     return {
       addonIcon: AddonIcons[this.addon.type],
@@ -33,7 +33,7 @@ export default {
       if (this.addon.imageLink) return this.addon.imageLink.replace(/^\/\//, 'https://')
       let docsBranch = 'final'
       if (this.$store.state.runtimeInfo.buildString === 'Release Build') docsBranch = 'final-stable'
-      return `https://raw.githubusercontent.com/openhab/openhab-docs/${docsBranch}/images/addons/${this.addon.id.substring(this.addon.id.indexOf('-') + 1)}.${type}`
+      return `https://raw.githubusercontent.com/openhab/openhab-docs/${docsBranch}/images/addons/${this.addon.id}.${type}`
     }
   },
   mounted () {