Fix add-ons searchbar

Signed-off-by: Yannick Schaus <github@schaus.net>

bundles/org.openhab.ui/web/src/pages/settings/addons/addons-add.vue

@@ -1,14 +1,14 @@
 <template>
   <f7-page @page:afterin="onPageAfterIn" @page:beforeout="addonPopupOpened = false" @page:afterout="stopEventSource">
     <f7-navbar :title="'Add ' + addonType + ' add-ons'" back-link="Back">
-      <f7-subnavbar :inner="false">
-        <f7-searchbar search-container=".search-list" search-in=".item-title" remove-diacritics :disable-button="!$theme.aurora"></f7-searchbar>
+      <f7-subnavbar :inner="false" v-show="initSearchbar">
+        <f7-searchbar search-container=".addons-list" :init="initSearchbar" v-if="initSearchbar" search-in=".item-title" remove-diacritics :disable-button="!$theme.aurora"></f7-searchbar>
       </f7-subnavbar>
     </f7-navbar>
     <f7-list class="searchbar-not-found">
       <f7-list-item title="Nothing found"></f7-list-item>
     </f7-list>
-    <f7-block class="block-narrow">
+    <f7-block class="block-narrow searchbar-found">
       <f7-col>
         <f7-block-title v-if="!ready">Loading...</f7-block-title>
         <f7-block-title v-else>{{addons.length}} add-on{{addons.length > 1 ? 's' : ''}} available</f7-block-title>
@@ -24,7 +24,7 @@
           >
           </f7-list-item>
         </f7-list>
-        <f7-list v-else media-list class="search-list searchbar-found">
+        <f7-list v-else media-list class="addons-list">
           <f7-list-item
             media-item
             v-for="addon in addons"
@@ -62,6 +62,7 @@ export default {
       addons: [],
       currentAddonId: null,
       ready: false,
+      initSearchbar: false,
       addonPopupOpened: false,
       currentlyInstalling: []
     }
@@ -79,6 +80,7 @@ export default {
       this.$oh.api.get('/rest/extensions').then(data => {
         this.addons = data.filter(addon => !addon.installed && addon.type === this.addonType)
         this.ready = true
+        setTimeout(() => { this.initSearchbar = true })
         this.startEventSource()
       }).catch((err) => {
         // sometimes we get 502 errors ('Jersey is not ready yet!'), keep trying