filemanager: support fallbackIcon

filemanager/src/components/PreviewPanel.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="preview-panel">
-    <img :src="item.previewUrl || item.icon" :alt="item.name" :class="{'shadow': item.previewUrl }"/>
+    <img :src="item.previewUrl || item.icon" :alt="item.name" :class="{'shadow': item.previewUrl }" @error="iconError($event)"/>
     <p>{{ item.name }}</p>
   </div>
 </template>
@@ -10,7 +10,13 @@
 export default {
   name: 'PreviewPanel',
   props: {
-    item: Object
+    item: Object,
+    fallbackIcon: String
+  },
+  methods: {
+    iconError(event) {
+      event.target.src = this.fallbackIcon;
+    }
   }
 };
 

filemanager/src/views/Home.vue

@@ -66,10 +66,11 @@
             :items="items"
             :clipboard="clipboard"
             :owners-model="ownersModel"
+            :fallback-icon="fallbackIcon"
           />
         </div>
         <div class="main-view-col" style="max-width: 300px;">
-          <PreviewPanel :item="activeItem || activeDirectoryItem"/>
+          <PreviewPanel :item="activeItem || activeDirectoryItem" :fallback-icon="fallbackIcon"/>
         </div>
       </div>
     </template>
@@ -121,6 +122,7 @@ export default {
   },
   data() {
     return {
+      fallbackIcon: '/mime-types/none.svg',
       cwd: '/',
       fatalError: false,
       activeItem: null,