@designcrowd/fe-shared-lib 1.0.17 → 1.0.18

package/src/experiences/components/UploadYourLogoOnBoarding/LogoUploader.vue

@@ -1,91 +1,91 @@
-<template>
-  <LogoUploadingLoader loading-text="Uploading and converting your logo..." />
-</template>
-<script>
-import brandCrowdClient from '../../clients/brand-crowd-api.client';
-import LogoUploadingLoader from './LogoUploadingLoader.vue';
-
-import trackEvent from '../../helpers/tracking';
-import hexDiff from '../../helpers/hex-diff';
-
-export default {
-  components: {
-    LogoUploadingLoader,
-  },
-  props: {
-    logoFile: {
-      type: Object,
-      required: true,
-      default: undefined,
-    },
-    eventCategory: {
-      type: String,
-      required: true,
-    },
-  },
-  data() {
-    return {
-      isRunning: false,
-    };
-  },
-  mounted() {
-    this.uploadLogo();
-  },
-  methods: {
-    async uploadLogo() {
-      if (this.isRunning) return;
-      this.isRunning = true;
-
-      let duration = 0;
-
-      const start = Date.now();
-
-      const intervalTimer = setInterval(() => {
-        duration = Date.now() - start;
-      }, 1);
-
-      const result = await brandCrowdClient.uploadLogoAndGetDetails(this.logoFile);
-
-      clearInterval(intervalTimer);
-      this.isRunning = false;
-
-      if (result.error) {
-        this.$emit('on-upload-error', result.error);
-        return;
-      }
-
-      if (result.success) {
-        this.$emit('on-upload-success', result.response);
-      } else {
-        this.$emit('on-upload-error', result.response);
-      }
-
-      const diff = hexDiff(
-        result.response.data.logoImageDetails.textColors[0],
-        result.response.data.logoImageDetails.backgroundColors[0],
-      );
-
-      trackEvent({
-        eventCategory: this.eventCategory,
-        eventAction: 'timeTakenToUpload',
-        eventLabel: `${duration}`,
-        event: 'byoLogoUpload',
-      });
-
-      trackEvent({
-        eventCategory: this.eventCategory,
-        eventAction: 'logoSize',
-        eventLabel: `${this.logoFile.file.size}`,
-        event: 'byoLogoUpload',
-      });
-
-      trackEvent({
-        eventCategory: this.eventCategory,
-        eventAction: 'colorDifference',
-        eventLabel: `${diff}`,
-        event: 'byoLogoUpload',
-      });
-    },
-  },
-};
-</script>
+<template>
+  <LogoUploadingLoader loading-text="Uploading and converting your logo..." />
+</template>
+<script>
+import brandCrowdClient from '../../clients/brand-crowd-api.client';
+import LogoUploadingLoader from './LogoUploadingLoader.vue';
+
+import trackEvent from '../../helpers/tracking';
+import hexDiff from '../../helpers/hex-diff';
+
+export default {
+  components: {
+    LogoUploadingLoader,
+  },
+  props: {
+    logoFile: {
+      type: Object,
+      required: true,
+      default: undefined,
+    },
+    eventCategory: {
+      type: String,
+      required: true,
+    },
+  },
+  data() {
+    return {
+      isRunning: false,
+    };
+  },
+  mounted() {
+    this.uploadLogo();
+  },
+  methods: {
+    async uploadLogo() {
+      if (this.isRunning) return;
+      this.isRunning = true;
+
+      let duration = 0;
+
+      const start = Date.now();
+
+      const intervalTimer = setInterval(() => {
+        duration = Date.now() - start;
+      }, 1);
+
+      const result = await brandCrowdClient.uploadLogoAndGetDetails(this.logoFile);
+
+      clearInterval(intervalTimer);
+      this.isRunning = false;
+
+      if (result.error) {
+        this.$emit('on-upload-error', result.error);
+        return;
+      }
+
+      if (result.success) {
+        this.$emit('on-upload-success', result.response);
+      } else {
+        this.$emit('on-upload-error', result.response);
+      }
+
+      const diff = hexDiff(
+        result.response.data.logoImageDetails.textColors[0],
+        result.response.data.logoImageDetails.backgroundColors[0],
+      );
+
+      trackEvent({
+        eventCategory: this.eventCategory,
+        eventAction: 'timeTakenToUpload',
+        eventLabel: `${duration}`,
+        event: 'byoLogoUpload',
+      });
+
+      trackEvent({
+        eventCategory: this.eventCategory,
+        eventAction: 'logoSize',
+        eventLabel: `${this.logoFile.file.size}`,
+        event: 'byoLogoUpload',
+      });
+
+      trackEvent({
+        eventCategory: this.eventCategory,
+        eventAction: 'colorDifference',
+        eventLabel: `${diff}`,
+        event: 'byoLogoUpload',
+      });
+    },
+  },
+};
+</script>

package/src/experiences/components/UploadYourLogoOnBoarding/LogoUploadingLoader.vue

@@ -1,22 +1,22 @@
-<template>
-  <div class="tw-pt-12 tw-pb-16 tw-flex tw-flex-col tw-items-center tw-justify-center">
-    <img
-      src="https://dcstatic.com/images/brandcrowd/on-boarding/loading/preloader-1-d1cc0b885f.gif"
-      alt="Loading"
-      class="tw-block tw-mb-8"
-    />
-    <p class="tw-text-black tw-text-2xl tw-font-bold tw-text-center">
-      {{ loadingText }}
-    </p>
-  </div>
-</template>
-<script>
-export default {
-  props: {
-    loadingText: {
-      type: String,
-      required: true,
-    },
-  },
-};
-</script>
+<template>
+  <div class="tw-pt-12 tw-pb-16 tw-flex tw-flex-col tw-items-center tw-justify-center">
+    <img
+      src="https://dcstatic.com/images/brandcrowd/on-boarding/loading/preloader-1-d1cc0b885f.gif"
+      alt="Loading"
+      class="tw-block tw-mb-8"
+    />
+    <p class="tw-text-black tw-text-2xl tw-font-bold tw-text-center">
+      {{ loadingText }}
+    </p>
+  </div>
+</template>
+<script>
+export default {
+  props: {
+    loadingText: {
+      type: String,
+      required: true,
+    },
+  },
+};
+</script>