Merge pull request #584 from OneSila/development

Collaboration, languages refactor and more

Author: BranDavidSebastian

src/assets/audio/notification.mp3

@@ -2,6 +2,7 @@
 import { computed } from 'vue';
 import AmazonDocumentTypeCategoriesList from './AmazonDocumentTypeCategoriesList.vue';
 import EbayDocumentTypeCategoriesList from './EbayDocumentTypeCategoriesList.vue';
+import MiraklDocumentTypeCategoriesList from './MiraklDocumentTypeCategoriesList.vue';
 import SheinDocumentTypeCategoriesList from './SheinDocumentTypeCategoriesList.vue';
 
 type CategoryId = string | number;
@@ -24,6 +25,8 @@ const currentComponent = computed(() => {
       return AmazonDocumentTypeCategoriesList;
     case 'ebay':
       return EbayDocumentTypeCategoriesList;
+    case 'mirakl':
+      return MiraklDocumentTypeCategoriesList;
     case 'shein':
       return SheinDocumentTypeCategoriesList;
     default:
@@ -36,7 +39,7 @@ const updateValue = (value: CategoryId[]) => {
 };
 
 const componentProps = computed(() =>
-  props.type === 'ebay' || props.type === 'amazon' || props.type === 'shein'
+  props.type === 'ebay' || props.type === 'amazon' || props.type === 'mirakl' || props.type === 'shein'
     ? {
       salesChannelId: props.salesChannelId ?? null,
       errorMessage: props.errorMessage ?? '',

src/core/integrations/integrations/integrations-show/containers/document-types/containers/remote-document-types/components/categories-lists/MiraklDocumentTypeCategoriesList.vue

@@ -1,8 +1,13 @@
 <script setup lang="ts">
+import { ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useRoute } from 'vue-router';
 import GeneralTemplate from "../../../../../../../../../shared/templates/GeneralTemplate.vue";
 import { Breadcrumbs } from "../../../../../../../../../shared/components/molecules/breadcrumbs";
 import { GeneralForm } from "../../../../../../../../../shared/components/organisms/general-form";
 import type { FormConfig } from "../../../../../../../../../shared/components/organisms/general-form/formConfig";
+import { Tabs } from "../../../../../../../../../shared/components/molecules/tabs";
+import { CollaborationTab } from "../../../../../../../../../shared/components/organisms/collaboration-tab";
 
 interface BreadcrumbLink {
   path?: {
@@ -17,6 +22,13 @@ const props = defineProps<{
   breadcrumbsLinks: BreadcrumbLink[];
   formConfig: FormConfig | null;
 }>();
+const { t } = useI18n();
+const route = useRoute();
+const targetId = ref(String(route.params.id));
+const tabItems = [
+  { name: 'general', label: t('shared.tabs.mapping'), icon: 'circle-info', alwaysRender: true },
+  { name: 'collaboration', label: t('shared.tabs.collaboration'), icon: 'comment-dots' },
+];
 
 const emit = defineEmits<{
   (e: 'set-data', value: any): void;
@@ -38,25 +50,32 @@ const handleFormUpdated = (form: Record<string, any>) => {
       <Breadcrumbs :links="props.breadcrumbsLinks" />
     </template>
     <template #content>
-      <GeneralForm
-        v-if="props.formConfig"
-        :config="props.formConfig"
-        @set-data="handleSetData"
-        @form-updated="handleFormUpdated"
-      >
-        <template #before-fields>
-          <slot name="before-form" />
+      <Tabs :tabs="tabItems">
+        <template #general>
+          <GeneralForm
+            v-if="props.formConfig"
+            :config="props.formConfig"
+            @set-data="handleSetData"
+            @form-updated="handleFormUpdated"
+          >
+            <template #before-fields>
+              <slot name="before-form" />
+            </template>
+            <template #help-section>
+              <slot name="help-section" />
+            </template>
+            <template #additional-button>
+              <slot name="additional-button" />
+            </template>
+            <template #additional-fields>
+              <slot name="additional-fields" />
+            </template>
+          </GeneralForm>
         </template>
-        <template #help-section>
-          <slot name="help-section" />
+        <template #collaboration>
+          <CollaborationTab :target-id="targetId" />
         </template>
-        <template #additional-button>
-          <slot name="additional-button" />
-        </template>
-        <template #additional-fields>
-          <slot name="additional-fields" />
-        </template>
-      </GeneralForm>
+      </Tabs>
     </template>
   </GeneralTemplate>
 </template>

src/core/integrations/integrations/integrations-show/containers/document-types/containers/remote-document-types/components/categories-lists/RemoteDocumentTypeCategoriesList.vue

@@ -16,7 +16,7 @@ const emit = defineEmits(['pull-data']);
 const { t } = useI18n();
 
 const searchConfig = computed(() => miraklPropertySelectValuesSearchConfigConstructor(t));
-const listingConfig = computed(() => miraklPropertySelectValuesListingConfigConstructor(t, props.id));
+const listingConfig = computed(() => miraklPropertySelectValuesListingConfigConstructor(t, props.id, props.salesChannelId));
 const fixedFilterVariables = computed(() => ({
   isPropertyValue: true,
 }));

src/core/integrations/integrations/integrations-show/containers/properties/containers/remote-properties/components/RemotePropertyEdit.vue

@@ -55,6 +55,8 @@ const config: RemoteSelectValueEditPropertyConfig = {
   valueQuery: getMiraklPropertySelectValueQuery,
   valueDataKey: 'miraklPropertySelectValue',
   mapValueData: valueData => ({
+    valueProxyId: valueData?.proxyId || null,
+    salesChannelId: valueData?.salesChannel?.id || null,
     form: {
       remoteProperty: valueData?.remoteProperty?.name || '',
       boolValue: valueData?.boolValue ?? null,
@@ -182,8 +184,8 @@ const config: RemoteSelectValueEditPropertyConfig = {
     },
   },
   notMappedBanner: {
-    titleKey: 'integrations.show.propertySelectValues.notMappedBanner.title',
-    contentKey: 'integrations.show.propertySelectValues.notMappedBanner.content',
+    titleKey: 'integrations.show.propertySelectValues.notMappedBannerMirakl.title',
+    contentKey: 'integrations.show.propertySelectValues.notMappedBannerMirakl.content',
     linkPath: ctx => ({
       name: 'integrations.remoteProperties.edit',
       params: { type: ctx.type, id: ctx.propertyId! },
@@ -205,6 +207,15 @@ const config: RemoteSelectValueEditPropertyConfig = {
           },
         }
       : null,
+  duplicateMapping: {
+    titleKey: 'integrations.show.propertySelectValues.duplicate.mirakl.title',
+    descriptionKey: 'integrations.show.propertySelectValues.duplicate.mirakl.description',
+    promptKey: 'integrations.show.propertySelectValues.duplicate.mirakl.prompt',
+    selectorHelpKey: 'integrations.show.propertySelectValues.duplicate.mirakl.help',
+    submitLabelKey: 'integrations.show.propertySelectValues.duplicate.mirakl.submit',
+    successMessageKey: 'integrations.show.propertySelectValues.duplicate.mirakl.success',
+    isVisible: ctx => Boolean(ctx.salesChannelId && ctx.valueProxyId && ctx.localPropertyId),
+  },
   listRoute: ctx => ({
     name: 'integrations.integrations.show',
     params: { type: ctx.type, id: ctx.integrationId },

src/core/integrations/integrations/integrations-show/containers/property-select-values/containers/mirakl-property-select-values/MiraklPropertySelectValues.vue

@@ -77,6 +77,7 @@ export const miraklPropertySelectValuesSearchConfigConstructor = (t: Function):
 export const miraklPropertySelectValuesListingConfigConstructor = (
   t: Function,
   specificIntegrationId: string,
+  salesChannelId: string,
 ): ListingConfig => ({
   headers: [
     t('integrations.show.propertySelectValues.labels.localizedValue'),
@@ -102,7 +103,7 @@ export const miraklPropertySelectValuesListingConfigConstructor = (
   addActions: true,
   addEdit: true,
   addShow: true,
-  urlQueryParams: { integrationId: specificIntegrationId },
+  urlQueryParams: { integrationId: specificIntegrationId, salesChannelId },
   editUrlName: 'integrations.remotePropertySelectValues.edit',
   showUrlName: 'integrations.remotePropertySelectValues.edit',
   addDelete: false,