Release hotfix to main (#1295)

* Archisinal dapp Staking Promo Card (#1288)

* Add files via upload

* Update dapp_promotions.json

Adding Archisinal to Promo card

* Rename Archisinal Logo.png to Archisinal.png

* Update dapp_promotions.json

* Inflation dashboard (#1289)

* Pie chart

* Inflation rate chart

* Dashboard re-styling

* Fixes and cleanup

* PR comments fix

* Adjustable staker updates

* dapp_promotions.json fix

* useInflation hook fix (#1296)

* useInflation hook fix

* PR comments fix

* Remove Yoki campaign (#1297)

---------

Co-authored-by: Tom-STEM <[email protected]>

src/App.vue

@@ -28,12 +28,6 @@
     </transition>
     <notification-stack />
 
-    <modal-yoki-origins
-      v-if="showYokiOriginsModal"
-      :set-is-open="setYokiOriginsModal"
-      :show="showYokiOriginsModal"
-    />
-
     <modal-disclaimer
       v-if="showDisclaimerModal"
       :set-is-open="setShowDisclaimerModal"
@@ -50,7 +44,6 @@ import { defineComponent, computed, ref, watch, onMounted } from 'vue';
 import DashboardLayout from 'layouts/DashboardLayout.vue';
 import { useStore } from 'src/store';
 import ModalLoading from 'components/common/ModalLoading.vue';
-import ModalYokiOrigins from 'components/common/ModalYokiOrigins.vue';
 import AlertBox from 'components/common/AlertBox.vue';
 import CookiePolicy from 'components/common/CookiePolicy.vue';
 import ModalDisclaimer from 'components/common/ModalDisclaimer.vue';
@@ -85,7 +78,6 @@ export default defineComponent({
     ModalLoading,
     AlertBox,
     CookiePolicy,
-    ModalYokiOrigins,
     ModalDisclaimer,
     NotificationStack,
     ModalOnboarding,
@@ -105,8 +97,7 @@ export default defineComponent({
       isDappStakingV3,
     } = useDappStaking();
     const { fetchStakeAmountsToStore, fetchDappsToStore } = useDapps();
-    const { fetchActiveConfigurationToStore } = useInflation();
-
+    const { fetchActiveConfigurationToStore, fetchInflationParamsToStore } = useInflation();
     const isLoading = computed(() => store.getters['general/isLoading']);
     const showAlert = computed(() => store.getters['general/showAlert']);
     const isEthWallet = computed<boolean>(() => store.getters['general/isEthWallet']);
@@ -124,18 +115,6 @@ export default defineComponent({
       showDisclaimerModal.value = isOpen;
     };
 
-    // Yoki Origins modal
-    const showYokiOriginsModal = ref<boolean>(false);
-    if (!localStorage.getItem(LOCAL_STORAGE.CLOSE_YOKI_ORIGINS_MODAL)) {
-      setTimeout(() => {
-        showYokiOriginsModal.value = true;
-      }, 2000);
-    }
-
-    const setYokiOriginsModal = (isOpen: boolean): void => {
-      showYokiOriginsModal.value = isOpen;
-    };
-
     // Handle busy and extrinsic call status messages.
     const eventAggregator = container.get<IEventAggregator>(Symbols.EventAggregator);
     eventAggregator.subscribe(ExtrinsicStatusMessage.name, (m) => {
@@ -186,6 +165,7 @@ export default defineComponent({
           fetchStakerInfoToStore(),
           fetchEraLengthsToStore(),
           fetchActiveConfigurationToStore(),
+          fetchInflationParamsToStore(),
         ]);
       }
     });
@@ -235,8 +215,6 @@ export default defineComponent({
       isLoading,
       showAlert,
       showDisclaimerModal,
-      showYokiOriginsModal,
-      setYokiOriginsModal,
       setShowDisclaimerModal,
     };
   },

src/components/common/ChartPanel.vue

@@ -3,7 +3,7 @@
     <q-skeleton class="skeleton--chart" />
   </div>
   <div v-else>
-    <div class="container--chart">
+    <div>
       <div class="row">
         <span class="text--accent container--title--color">{{ $t(title) }}</span>
       </div>
@@ -95,7 +95,7 @@ export default defineComponent({
   setup(props, { emit }) {
     const store = useStore();
     const isDarkTheme = computed(() => store.getters['general/theme'] === 'DARK');
-    const getBackgroundColor = (): string => (isDarkTheme.value ? '#060b23' : '#fff');
+    const getBackgroundColor = (): string => 'transparent';
     const getLineColor = (): string => (isDarkTheme.value ? 'rgba(108,111,111,0.1)' : '#F7F7F8');
     const getTextColor = (): string => (isDarkTheme.value ? '#5F656F' : '#B1B7C1');
     const hasData = ref<boolean>(false);

src/components/common/DoughnutChart.vue

@@ -23,14 +23,14 @@
         :fill="textColor"
         :x="size * 0.55"
         :y="size * 0.55 - 28"
-        font-size="24"
+        font-size="20"
         font-weight="700"
         text-anchor="middle"
       >
         {{ text }}
       </text>
       <text
-        v-if="value > 0"
+        v-if="value > 0 && tokenSymbol"
         :fill="textColor"
         :x="size * 0.55"
         :y="size * 0.52"
@@ -85,7 +85,8 @@ export default defineComponent({
     },
     tokenSymbol: {
       type: String,
-      required: true,
+      required: false,
+      default: undefined,
     },
     isDarkTheme: {
       type: Boolean,

src/components/common/styles/chart-panel.scss

@@ -1,18 +1,5 @@
 @import 'src/css/quasar.variables.scss';
 
-.container--chart {
-  box-shadow: $container-border-shadow-light;
-  background: $container-bg-white;
-  border-radius: 6px;
-  padding: 8px 16px;
-  @media (min-width: $md) {
-    padding: 8px 24px;
-  }
-  @media (min-width: $xxl) {
-    width: 560px;
-  }
-}
-
 .row {
   padding: 16px 8px 0px 8px;
 }
@@ -74,10 +61,3 @@
     font-size: 26px;
   }
 }
-
-.body--dark {
-  .container--chart {
-    box-shadow: $container-border-shadow-dark;
-    background-color: $container-bg-dark;
-  }
-}