@platforma-sdk/ui-vue 1.42.24 → 1.42.26

package/src/plugins/Monetization/RunStatus.vue

@@ -1,21 +1,17 @@
 <script setup lang="ts">
 import { computed } from 'vue';
-import { PlIcon24, PlTooltip } from '@milaboratories/uikit';
 
 const props = defineProps<{
   canRun: boolean | undefined;
   statusText: string | undefined;
+  isLoading?: boolean;
 }>();
 
-const tooltipText = computed(() => {
-  if (props.canRun) {
-    return 'Can run';
+const badgeText = computed(() => {
+  if (props.isLoading) {
+    return 'Updating...';
   }
 
-  return 'Cannot run: check your monetization settings';
-});
-
-const badgeText = computed(() => {
   if (props.canRun) {
     return 'Ready to run';
   }
@@ -26,7 +22,7 @@ const badgeText = computed(() => {
 
 <template>
   <div>
-    <div :class="[{ [$style['can-run']]: canRun }, $style.container]">
+    <div :class="[{ [$style['can-run']]: canRun, [$style.loading]: isLoading }, $style.container]">
       <div :class="$style.badge">
         <i :class="$style.blob">
           <span>
@@ -35,12 +31,6 @@ const badgeText = computed(() => {
         </i>
         <span>{{ badgeText }}</span>
       </div>
-      <PlTooltip v-if="false">
-        <template #tooltip>
-          {{ tooltipText }}
-        </template>
-        <PlIcon24 name="info" />
-      </PlTooltip>
       <slot />
     </div>
     <div v-if="statusText" :class="$style.statusText">{{ statusText }}</div>
@@ -54,10 +44,16 @@ const badgeText = computed(() => {
   gap: 8px;
   --blob-color: #FF5C5C;
   --badge-background: rgba(255, 92, 92, 0.12);
+
   &.can-run {
     --blob-color: #49CC49;
     --badge-background: rgba(99, 224, 36, 0.12);
   }
+
+  &.loading {
+    --blob-color: #FFAD0A;
+    --badge-background: rgba(255, 173, 10, 0.12);
+  }
 }
 
 .statusText {

package/src/plugins/Monetization/UserCabinetCard.vue

@@ -4,6 +4,7 @@ import { PlTooltip, PlMaskIcon24 } from '@milaboratories/uikit';
 
 const props = defineProps<{
   userCabinetUrl: string;
+  email?: string;
 }>();
 
 const copiedMessage = ref('');
@@ -41,6 +42,10 @@ const copyToClipboard = () => {
           <template #tooltip>{{ copiedMessage ? copiedMessage : 'Copy' }}</template>
         </PlTooltip>
       </div>
+      <div v-if="email" :class="$style.email">
+        <span>License owner:</span>
+        <span>{{ email }}</span>
+      </div>
     </div>
     <div :class="$style.hint">
       * Copy and paste the link into your browser
@@ -57,6 +62,22 @@ const copyToClipboard = () => {
   line-height: 16px;
 }
 
+.email {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-size: 12px;
+  color: var(--txt-03);
+
+  > span:last-child {
+    max-width: 200px;
+    text-overflow: ellipsis;
+    display: block;
+    white-space: nowrap;
+    overflow: hidden;
+  }
+}
+
 .copyIcon {
   cursor: pointer;
 }
@@ -66,8 +87,9 @@ const copyToClipboard = () => {
   flex-direction: column;
   gap: 8px;
   padding: 12px;
-  background-color: #f0f0f0;
+  background-color: #F7F8FA;
   border-radius: 6px;
+  border: 1px solid #E1E3EB;
 }
 
 .urlLabel {

package/src/plugins/Monetization/useInfo.ts

@@ -38,7 +38,7 @@ export function useInfo() {
 
   const canRun = computed(() => !!result.value?.canRun);
 
-  const status = computed(() => currentInfo.value ? result.value?.status : 'awaiting');
+  const status = computed(() => currentInfo.value ? result.value?.status : '');
 
   const customerEmail = computed(() => result.value?.customerEmail);