From 87430e298d078831d990bf4c3ec69ac3065a38d5 Mon Sep 17 00:00:00 2001
From: Varun Patil <varunpatil@ucla.edu>
Date: Sat, 25 Feb 2023 16:35:08 -0800
Subject: [PATCH] Replace img with x-img

---
 src/components/frame/Folder.vue              | 4 ++--
 src/components/frame/Photo.vue               | 3 ---
 src/components/frame/Tag.vue                 | 2 +-
 src/components/modal/AlbumPicker.vue         | 2 +-
 src/components/top-matter/MapSplitMatter.vue | 2 +-
 src/components/top-matter/OnThisDay.vue      | 2 +-
 src/main.ts                                  | 2 ++
 7 files changed, 8 insertions(+), 9 deletions(-)

diff --git a/src/components/frame/Folder.vue b/src/components/frame/Folder.vue
index 411d0934..8eec446b 100644
--- a/src/components/frame/Folder.vue
+++ b/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')"
@@ -226,4 +226,4 @@ export default defineComponent({
     }
   }
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/src/components/frame/Photo.vue b/src/components/frame/Photo.vue
index ffd89020..5d9b8cae 100644
--- a/src/components/frame/Photo.vue
+++ b/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,
diff --git a/src/components/frame/Tag.vue b/src/components/frame/Tag.vue
index a67a5037..2d17bd51 100644
--- a/src/components/frame/Tag.vue
+++ b/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 }"
diff --git a/src/components/modal/AlbumPicker.vue b/src/components/modal/AlbumPicker.vue
index 14a328c3..571af79e 100644
--- a/src/components/modal/AlbumPicker.vue
+++ b/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)"
diff --git a/src/components/top-matter/MapSplitMatter.vue b/src/components/top-matter/MapSplitMatter.vue
index 605b6b54..dbea2a44 100644
--- a/src/components/top-matter/MapSplitMatter.vue
+++ b/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',
diff --git a/src/components/top-matter/OnThisDay.vue b/src/components/top-matter/OnThisDay.vue
index c8de3d7a..bac8d555 100644
--- a/src/components/top-matter/OnThisDay.vue
+++ b/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 }}
diff --git a/src/main.ts b/src/main.ts
index 884bfe35..cec607c9 100644
--- a/src/main.ts
+++ b/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