migrate mt-inheritance-switch to custom i18n

shopware · Nov 6, 2024 · ad42e43 · ad42e43
1 parent a0fb1b7
commit ad42e43
Showing 1 changed file with 26 additions and 31 deletions.
diff --git a/...ent-library/src/components/form/_internal/mt-inheritance-switch/mt-inheritance-switch.vue b/...ent-library/src/components/form/_internal/mt-inheritance-switch/mt-inheritance-switch.vue
@@ -1,11 +1,13 @@
 <template>
   <div
-    class="mt-inheritance-switch"
-    :class="{
-      'mt-inheritance-switch--disabled': disabled,
-      'mt-inheritance-switch--is-inherited': isInherited,
-      'mt-inheritance-switch--is-not-inherited': !isInherited,
-    }"
+    :class="[
+      'mt-inheritance-switch',
+      {
+        'mt-inheritance-switch--disabled': disabled,
+        'mt-inheritance-switch--is-inherited': isInherited,
+        'mt-inheritance-switch--is-not-inherited': !isInherited,
+      },
+    ]"
   >
     <mt-icon
       v-if="isInherited"
@@ -20,14 +22,17 @@
       size="14"
       @click="onClickRemoveInheritance"
     />
+
     <mt-icon
       v-else
       key="uninherit-icon"
       v-tooltip="{
         message: t('tooltipRestoreInheritance'),
         disabled: disabled,
       }"
-      :class="unInheritClasses"
+      :class="{
+        'is--clickable': !disabled,
+      }"
       :multicolor="true"
       name="regular-link-horizontal-slash"
       size="14"
@@ -67,29 +72,7 @@ export default defineComponent({
     },
   },
 
-  computed: {
-    unInheritClasses(): { "is--clickable": boolean } {
-      return { "is--clickable": !this.disabled };
-    },
-  },
-
-  methods: {
-    onClickRestoreInheritance() {
-      if (this.disabled) {
-        return;
-      }
-      this.$emit("inheritance-restore");
-    },
-
-    onClickRemoveInheritance() {
-      if (this.disabled) {
-        return;
-      }
-      this.$emit("inheritance-remove");
-    },
-  },
-
-  setup() {
+  setup(props, { emit }) {
     const { t } = useI18n({
       messages: {
         en: {
@@ -103,7 +86,19 @@ export default defineComponent({
       },
     });
 
-    return { t };
+    function onClickRestoreInheritance() {
+      if (props.disabled) return;
+
+      emit("inheritance-restore");
+    }
+
+    function onClickRemoveInheritance() {
+      if (props.disabled) return;
+
+      emit("inheritance-remove");
+    }
+
+    return { t, onClickRemoveInheritance, onClickRestoreInheritance };
   },
 });
 </script>