@designcrowd/fe-shared-lib 1.2.5-ml-jj-3 → 1.2.5-ml-jj-4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@designcrowd/fe-shared-lib",
-  "version": "1.2.5-ml-jj-3",
+  "version": "1.2.5-ml-jj-4",
   "scripts": {
     "start": "run-p storybook watch:translation",
     "build": "npm run build:css --production",

package/src/experiences/components/PublishBrandPageModal/PublishBrandPageModal.vue

@@ -261,7 +261,7 @@ import SellDomainNameListModal from '../SellDomainNameListModal/SellDomainNameLi
 import brandCrowdApiClient from '../../clients/brand-crowd-api.client';
 import Events, { sitePublishedModal } from '../../constants/event-constants';
 import mediaQueryMixin from '../../mixins/mediaQueryMixin';
-import { tr } from '../../../useSharedLibTranslate';
+import { publishBrandPageModalTr } from '../../../useSharedLibTranslate';
 
 const DOMAIN_TYPES = {
   slug: 'slug',
@@ -416,22 +416,22 @@ export default {
   ],
   setup() {
     return {
-      tr,
-      sitePublishedLabel: tr('publishBrandPageModal.sitePublishedLabel'),
-      freePublishCardTitleLabel: tr('publishBrandPageModal.freePublishCardTitleLabel'),
-      freePublishCardDescriptionLabel: tr('publishBrandPageModal.freePublishCardDescriptionLabel'),
-      slugInputPlaceholderYourNameLabel: tr('publishBrandPageModal.slugInputPlaceholderYourNameLabel'),
-      slugInputPlaceholderYourBusinessNameLabel: tr('publishBrandPageModal.slugInputPlaceholderYourBusinessNameLabel'),
-      freeDomainLabel: tr('publishBrandPageModal.freeDomainLabel'),
-      purchasedDomainLabel: tr('publishBrandPageModal.purchasedDomainLabel'),
-      setUrlLabel: tr('publishBrandPageModal.setUrlLabel'),
-      publishLabel: tr('publishBrandPageModal.publishLabel'),
-      viewMoreDomainLabel: tr('publishBrandPageModal.viewMoreDomainLabel'),
-      copyLabel: tr('publishBrandPageModal.copyLabel'),
-      copySuccessLabel: tr('publishBrandPageModal.copySuccessLabel'),
-      hasAlreadyPurchasedDomainCloseButtonLabel: tr('publishBrandPageModal.hasAlreadyPurchasedDomainCloseButtonLabel'),
-      publishedSuccessDescriptionLabel: tr('publishBrandPageModal.publishedSuccessDescriptionLabel'),
-      selectDomainDropdownPlaceholder: tr('publishBrandPageModal.selectDomainDropdownPlaceholder'),
+      publishBrandPageModalTr,
+      sitePublishedLabel: publishBrandPageModalTr('sitePublishedLabel'),
+      freePublishCardTitleLabel: publishBrandPageModalTr('freePublishCardTitleLabel'),
+      freePublishCardDescriptionLabel: publishBrandPageModalTr('freePublishCardDescriptionLabel'),
+      slugInputPlaceholderYourNameLabel: publishBrandPageModalTr('slugInputPlaceholderYourNameLabel'),
+      slugInputPlaceholderYourBusinessNameLabel: publishBrandPageModalTr('slugInputPlaceholderYourBusinessNameLabel'),
+      freeDomainLabel: publishBrandPageModalTr('freeDomainLabel'),
+      purchasedDomainLabel: publishBrandPageModalTr('purchasedDomainLabel'),
+      setUrlLabel: publishBrandPageModalTr('setUrlLabel'),
+      publishLabel: publishBrandPageModalTr('publishLabel'),
+      viewMoreDomainLabel: publishBrandPageModalTr('viewMoreDomainLabel'),
+      copyLabel: publishBrandPageModalTr('copyLabel'),
+      copySuccessLabel: publishBrandPageModalTr('copySuccessLabel'),
+      hasAlreadyPurchasedDomainCloseButtonLabel: publishBrandPageModalTr('hasAlreadyPurchasedDomainCloseButtonLabel'),
+      publishedSuccessDescriptionLabel: publishBrandPageModalTr('publishedSuccessDescriptionLabel'),
+      selectDomainDropdownPlaceholder: publishBrandPageModalTr('selectDomainDropdownPlaceholder'),
     };
   },
   data() {
@@ -454,17 +454,17 @@ export default {
       return this.brandPageBaseUrl.replace('https://', '');
     },
     firstTimePublishHeaderLabel() {
-      return this.tr('publishBrandPageModal.firstTimePublishHeaderLabel', {
+      return this.publishBrandPageModalTr('firstTimePublishHeaderLabel', {
         brandPageDisplayName: this.brandPageDisplayName,
       });
     },
     publishSuccessLabel() {
-      return this.tr('publishBrandPageModal.publishSuccessLabel', {
+      return this.publishBrandPageModalTr('publishSuccessLabel', {
         brandPageDisplayName: this.brandPageDisplayName,
       });
     },
     viewMyWebsiteLabel() {
-      return this.tr('publishBrandPageModal.viewMyWebsiteLabel', {
+      return this.publishBrandPageModalTr('viewMyWebsiteLabel', {
         brandPageDisplayName: this.brandPageDisplayName,
       });
     },

package/src/experiences/components/SellDomainNameList/SellDomainNameList.vue

@@ -66,7 +66,7 @@
 import Button from '../../../atoms/components/Button/Button.vue';
 import Price from '../../../atoms/components/Price/Price.vue';
 import Events from '../../constants/event-constants';
-import { tr } from '../../../useSharedLibTranslate';
+import { sellDomainNameListTr } from '../../../useSharedLibTranslate';
 
 export default {
   components: {
@@ -110,10 +110,10 @@ export default {
   emits: ['load-more-domains'],
   setup() {
     return {
-      freeDomainButtonLabel: tr('sellDomainNameList.freeDomainButtonLabel'),
-      buyNowButtonLabel: tr('sellDomainNameList.buyNowButtonLabel'),
-      pricePerYearLabel: tr('sellDomainNameList.pricePerYearLabel'),
-      costPriceLabel: tr('sellDomainNameList.costPriceLabel'),
+      freeDomainButtonLabel: sellDomainNameListTr('freeDomainButtonLabel'),
+      buyNowButtonLabel: sellDomainNameListTr('buyNowButtonLabel'),
+      pricePerYearLabel: sellDomainNameListTr('pricePerYearLabel'),
+      costPriceLabel: sellDomainNameListTr('costPriceLabel'),
     };
   },
   methods: {

package/src/experiences/components/SellDomainNameListModal/SellDomainNameListModal.vue

@@ -35,7 +35,7 @@
 </template>
 <script>
 import Modal from '../../../atoms/components/Modal/Modal.vue';
-import { tr } from '../../../useSharedLibTranslate';
+import { sellDomainNameListModalTr } from '../../../useSharedLibTranslate';
 
 import SellDomainNameSearch from '../SellDomainNameSearch/SellDomainNameSearch.vue';
 import SellDomainNameSearchResult from '../SellDomainNameSearchResult/SellDomainNameListSearchResult.vue';
@@ -94,8 +94,8 @@ export default {
   emits: ['close-modal', 'input', 'search'],
   setup() {
     return {
-      domainSearchHeaderTitle: tr('sellDomainNameListModal.domainSearchHeaderTitle'),
-      domainSearchHeaderSubtitle: tr('sellDomainNameListModal.domainSearchHeaderSubtitle'),
+      domainSearchHeaderTitle: sellDomainNameListModalTr('domainSearchHeaderTitle'),
+      domainSearchHeaderSubtitle: sellDomainNameListModalTr('domainSearchHeaderSubtitle'),
     };
   },
   methods: {

package/src/experiences/components/SellDomainNameModalApplication/SellDomainNameModalApplication.vue

@@ -76,7 +76,7 @@ import brandCrowdApiClient from '../../clients/brand-crowd-api.client';
 import SellDomainNameSearch from '../SellDomainNameSearch/SellDomainNameSearch.vue';
 import SellDomainNameSearchResult from '../SellDomainNameSearchResult/SellDomainNameListSearchResult.vue';
 import Events from '../../constants/event-constants';
-import { tr } from '../../../useSharedLibTranslate';
+import { sellDomainNameModalApplicationTr } from '../../../useSharedLibTranslate';
 
 export default {
   components: {
@@ -122,8 +122,8 @@ export default {
   },
   setup() {
     return {
-      domainSearchHeaderTitle: tr('sellDomainNameModalApplication.domainSearchHeaderTitle'),
-      domainSearchHeaderSubtitle: tr('sellDomainNameModalApplication.domainSearchHeaderTitle'),
+      domainSearchHeaderTitle: sellDomainNameModalApplicationTr('domainSearchHeaderTitle'),
+      domainSearchHeaderSubtitle: sellDomainNameModalApplicationTr('domainSearchHeaderTitle'),
     };
   },
   data: () => ({

package/src/experiences/components/SellDomainNameSearch/SellDomainNameSearch.vue

@@ -44,7 +44,7 @@
 import Button from '../../../atoms/components/Button/Button.vue';
 import TextInput from '../../../atoms/components/TextInput/TextInput.vue';
 import { sellDomainNameMinSearchTextLength } from '../../constants/sell-domain-name-constants';
-import { tr } from '../../../useSharedLibTranslate';
+import { sellDomainNameSearchTr } from '../../../useSharedLibTranslate';
 
 export default {
   components: {
@@ -83,10 +83,10 @@ export default {
   emits: ['onSearch', 'onSearchTextInputChange'],
   setup() {
     return {
-      searchButtonLabel: tr('sellDomainNameSearch.searchButtonLabel'),
-      searchBarLabel: tr('sellDomainNameSearch.searchBarLabel'),
-      searchBarPlaceholder: tr('sellDomainNameSearch.searchBarPlaceholder'),
-      searchBarPreText: tr('sellDomainNameSearch.searchBarPreText'),
+      searchButtonLabel: sellDomainNameSearchTr('searchButtonLabel'),
+      searchBarLabel: sellDomainNameSearchTr('searchBarLabel'),
+      searchBarPlaceholder: sellDomainNameSearchTr('searchBarPlaceholder'),
+      searchBarPreText: sellDomainNameSearchTr('searchBarPreText'),
     };
   },
   data() {

package/src/experiences/components/SellDomainNameSearchResult/SellDomainNameListSearchResult.vue

@@ -41,7 +41,7 @@ import Loader from '../../../atoms/components/Loader/Loader.vue';
 import Picture from '../../../atoms/components/Picture/Picture.vue';
 import SellDomainNameList from '../SellDomainNameList/SellDomainNameList.vue';
 import Events from '../../constants/event-constants';
-import { tr } from '../../../useSharedLibTranslate';
+import { sellDomainNameListSearchResultTr } from '../../../useSharedLibTranslate';
 
 export default {
   components: {
@@ -104,7 +104,7 @@ export default {
   setup() {
     return {
       tr,
-      searchAnotherDomainMessage: tr('sellDomainNameListSearchResult.searchAnotherDomainMessage'),
+      searchAnotherDomainMessage: sellDomainNameListSearchResultTr('searchAnotherDomainMessage'),
     };
   },
   data() {
@@ -114,7 +114,7 @@ export default {
   },
   computed: {
     domainSearchEmptyMessageWithUserDomainName() {
-      return tr('sellDomainNameListSearchResult.domainSearchEmptyMessage', {
+      return sellDomainNameListSearchResultTr('domainSearchEmptyMessage', {
         domainNameSearchTerm: this.previousSearchText,
       });
     },

package/src/experiences/components/SellDomainNameWidget/SellDomainNameWidget.vue

@@ -38,7 +38,7 @@
   </div>
 </template>
 <script>
-import { tr } from '../../../useSharedLibTranslate';
+import { sellDomainNameWidgetTr } from '../../../useSharedLibTranslate';
 import Button from '../../../atoms/components/Button/Button.vue';
 import TextInput from '../../../atoms/components/TextInput/TextInput.vue';
 import SellDomainNameListModal from '../SellDomainNameListModal/SellDomainNameListModal.vue';
@@ -75,10 +75,10 @@ export default {
   },
   setup() {
     return {
-      searchButtonLabel: tr('sellDomainNameWidget.searchButtonLabel'),
-      searchBarLabel: tr('sellDomainNameWidget.searchBarLabel'),
-      searchBarPlaceholder: tr('sellDomainNameWidget.searchBarPlaceholder'),
-      domainSearchOrConnectHeaderSubtitle: tr('sellDomainNameWidget.domainSearchOrConnectHeaderSubtitle'),
+      searchButtonLabel: sellDomainNameWidgetTr('searchButtonLabel'),
+      searchBarLabel: sellDomainNameWidgetTr('searchBarLabel'),
+      searchBarPlaceholder: sellDomainNameWidgetTr('searchBarPlaceholder'),
+      domainSearchOrConnectHeaderSubtitle: sellDomainNameWidgetTr('domainSearchOrConnectHeaderSubtitle'),
     };
   },
   data: () => ({

package/src/useSharedLibTranslate.js

@@ -35,4 +35,34 @@ const tr = (key, valuesToInterpolate = {}) => {
   return translated;
 };
 
-export { setSharedLibLocaleAsync, tr };
+const publishBrandPageModalTr = (key, valuesToInterpolate = {}) =>
+  tr(`publishBrandPageModal.${key}`, valuesToInterpolate);
+
+const sellDomainNameWidgetTr = (key, valuesToInterpolate = {}) =>
+  tr(`sellDomainNameWidget.${key}`, valuesToInterpolate);
+
+const sellDomainNameListSearchResultTr = (key, valuesToInterpolate = {}) =>
+  tr(`sellDomainNameListSearchResult.${key}`, valuesToInterpolate);
+
+const sellDomainNameSearchTr = (key, valuesToInterpolate = {}) =>
+  tr(`sellDomainNameSearch.${key}`, valuesToInterpolate);
+
+const sellDomainNameModalApplicationTr = (key, valuesToInterpolate = {}) =>
+  tr(`sellDomainNameModalApplication.${key}`, valuesToInterpolate);
+
+const sellDomainNameListModalTr = (key, valuesToInterpolate = {}) =>
+  tr(`sellDomainNameListModal.${key}`, valuesToInterpolate);
+
+const sellDomainNameListTr = (key, valuesToInterpolate = {}) => tr(`sellDomainNameList.${key}`, valuesToInterpolate);
+
+export {
+  setSharedLibLocaleAsync,
+  tr,
+  publishBrandPageModalTr,
+  sellDomainNameWidgetTr,
+  sellDomainNameListSearchResultTr,
+  sellDomainNameSearchTr,
+  sellDomainNameModalApplicationTr,
+  sellDomainNameListModalTr,
+  sellDomainNameListTr,
+};