Replace img with x-img

src/components/frame/Folder.vue

@@ -17,7 +17,7 @@
     <div class="previews fill-block">
       <div class="preview-container fill-block">
         <div class="img-outer" v-for="info of previews" :key="info.fileid">
-          <img
+          <XImg
             class="fill-block"
             :src="getPreviewUrl(info, true, 256)"
             @error="$event.target.classList.add('error')"

src/components/frame/Photo.vue

@@ -73,8 +73,6 @@ import { getPreviewUrl } from "../../services/FileUtils";
 import { IDay, IPhoto } from "../../types";
 import * as utils from "../../services/Utils";
 
-import XImg from "./XImg.vue";
-
 import errorsvg from "../../assets/error.svg";
 import CheckCircle from "vue-material-design-icons/CheckCircle.vue";
 import Star from "vue-material-design-icons/Star.vue";
@@ -84,7 +82,6 @@ import LivePhoto from "vue-material-design-icons/MotionPlayOutline.vue";
 export default defineComponent({
   name: "Photo",
   components: {
-    XImg,
     CheckCircle,
     Video,
     Star,

src/components/frame/Tag.vue

@@ -16,7 +16,7 @@
 
     <div class="previews fill-block" ref="previews">
       <div class="img-outer">
-        <img
+        <XImg
           draggable="false"
           class="fill-block"
           :class="{ error }"

src/components/modal/AlbumPicker.vue

@@ -16,7 +16,7 @@
         @click="pickAlbum(album)"
       >
         <template v-slot:icon="{}">
-          <img
+          <XImg
             v-if="album.last_added_photo !== -1"
             class="album__image"
             :src="toCoverUrl(album.last_added_photo)"

src/components/top-matter/MapSplitMatter.vue

@@ -27,7 +27,7 @@
             <div class="count" v-if="cluster.count > 1">
               {{ cluster.count }}
             </div>
-            <img
+            <XImg
               :src="clusterPreviewUrl(cluster)"
               :class="[
                 'thumb-important',

src/components/top-matter/OnThisDay.vue

@@ -7,7 +7,7 @@
         :key="year.year"
         @click="click(year)"
       >
-        <img class="fill-block" :src="year.url" />
+        <XImg class="fill-block" :src="year.url" />
 
         <div class="overlay">
           {{ year.text }}

src/main.ts

@@ -4,6 +4,7 @@ import "reflect-metadata";
 import Vue from "vue";
 import VueVirtualScroller from "vue-virtual-scroller";
 import "vue-virtual-scroller/dist/vue-virtual-scroller.css";
+import XImg from "./components/frame/XImg.vue";
 import GlobalMixin from "./mixins/GlobalMixin";
 import UserConfig from "./mixins/UserConfig";
 
@@ -72,6 +73,7 @@ if (!globalThis.videoClientIdPersistent) {
 Vue.mixin(GlobalMixin);
 Vue.mixin(UserConfig);
 Vue.use(VueVirtualScroller);
+Vue.component("XImg", XImg);
 
 // https://github.com/nextcloud/photos/blob/156f280c0476c483cb9ce81769ccb0c1c6500a4e/src/main.js
 // TODO: remove when we have a proper fileinfo standalone library