From 9abaad76128b1b01916b4c8daa6cb639eb7492e0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?=
 <tugcekucukoglu.860@gmail.com>
Date: Fri, 9 Jun 2023 13:28:10 +0300
Subject: [PATCH] Refactor #3965 - Update for Image

---
 components/lib/image/BaseImage.vue | 15 ++++++++++++---
 components/lib/image/Image.vue     |  6 +++---
 2 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/components/lib/image/BaseImage.vue b/components/lib/image/BaseImage.vue
index a6b580255..463f3cfc3 100644
--- a/components/lib/image/BaseImage.vue
+++ b/components/lib/image/BaseImage.vue
@@ -71,7 +71,6 @@ const styles = `
 const classes = {
     root: ({ props }) => [
         'p-image p-component',
-        props.class,
         {
             'p-image-preview-container': props.preview
         }
@@ -82,8 +81,18 @@ const classes = {
     mask: 'p-image-mask p-component-overlay p-component-overlay-enter',
     rotateRightButton: 'p-image-action p-link',
     rotateLeftButton: 'p-image-action p-link',
-    zoomOutButton: ({ instance }) => ['p-image-action p-link', { 'p-disabled': instance.isZoomOutDisabled }],
-    zoomInButton: ({ instance }) => ['p-image-action p-link', { 'p-disabled': instance.isZoomInDisabled }],
+    zoomOutButton: ({ instance }) => [
+        'p-image-action p-link',
+        {
+            'p-disabled': instance.isZoomOutDisabled
+        }
+    ],
+    zoomInButton: ({ instance }) => [
+        'p-image-action p-link',
+        {
+            'p-disabled': instance.isZoomInDisabled
+        }
+    ],
     closeButton: 'p-image-action p-link',
     preview: 'p-image-preview'
 };
diff --git a/components/lib/image/Image.vue b/components/lib/image/Image.vue
index 65c50641f..ef111e79b 100644
--- a/components/lib/image/Image.vue
+++ b/components/lib/image/Image.vue
@@ -1,5 +1,5 @@
 <template>
-    <span :class="[cx('root'), containerClass]" :style="style" v-bind="ptm('root')">
+    <span :class="containerClass" :style="style" v-bind="ptm('root')" data-pc-name="image">
         <slot name="image" :onError="onError">
             <img :style="imageStyle" :class="[cx('image'), imageClass]" @error="onError" v-bind="{ ...$attrs, ...ptm('image') }" />
         </slot>
@@ -54,7 +54,6 @@
 </template>
 
 <script>
-import BaseImage from './BaseImage.vue';
 import FocusTrap from 'primevue/focustrap';
 import EyeIcon from 'primevue/icons/eye';
 import RefreshIcon from 'primevue/icons/refresh';
@@ -64,6 +63,7 @@ import TimesIcon from 'primevue/icons/times';
 import UndoIcon from 'primevue/icons/undo';
 import Portal from 'primevue/portal';
 import { DomHandler, ZIndexUtils } from 'primevue/utils';
+import BaseImage from './BaseImage.vue';
 
 export default {
     name: 'Image',
@@ -183,7 +183,7 @@ export default {
     },
     computed: {
         containerClass() {
-            return this.class;
+            return [this.cx('root'), this.class];
         },
         rotateClass() {
             return 'p-image-preview-rotate-' + this.rotate;