From 130eea00698965cf1efe31b4b29235329afaf890 Mon Sep 17 00:00:00 2001
From: Alain Brenzikofer <alain@integritee.network>
Date: Wed, 15 Jan 2025 22:24:15 +0100
Subject: [PATCH 1/2] fix broken TEERdays tab account handling

---
 components/tabs/TeerDaysTab.vue | 187 ++++++++------------------------
 configs/chains.ts               |   2 +
 pages/index.vue                 |   2 +-
 3 files changed, 51 insertions(+), 140 deletions(-)

diff --git a/components/tabs/TeerDaysTab.vue b/components/tabs/TeerDaysTab.vue
index bfe98c4..0dd7604 100644
--- a/components/tabs/TeerDaysTab.vue
+++ b/components/tabs/TeerDaysTab.vue
@@ -10,11 +10,11 @@
     </div>
     <InfoBanner
       v-if="!accountStore.hasInjector"
-      :isMobile="isMobile"
-      textMobile="You need some signer extension to use this page. Please make sure to
+      :isMobile="props.isMobile"
+      textMobile="You need some signer extension to use this page securely. Please make sure to
         enable your extension and reload the page in case the connect button
         doesn't work."
-      textDesktop="You need some signer extension to use this page. Please make sure to
+      textDesktop="You need some signer extension to use this page securely. Please make sure to
         enable your extension and reload the page in case the connect button
         doesn't work."
     />
@@ -315,6 +315,11 @@
               class="mt-1 flex items-baseline justify-between md:block lg:flex"
             >
               <div
+                v-if="summaryHolders === null"
+                class="spinner"
+              ></div>
+              <div
+                v-else
                 class="flex items-baseline text-2xl font-semibold text-incognitee-green"
               >
                 {{ summaryHolders }}
@@ -343,6 +348,11 @@
               class="mt-1 flex items-baseline justify-between md:block lg:flex"
             >
               <div
+                v-if="summaryTeerBonded === null"
+                class="spinner"
+              ></div>
+              <div
+                v-else
                 class="flex items-baseline text-2xl font-semibold text-incognitee-green"
               >
                 {{ formatBigDecimalBalance(summaryTeerBonded) }}
@@ -371,6 +381,11 @@
               class="mt-1 flex items-baseline justify-between md:block lg:flex"
             >
               <div
+                v-if="summaryTeerDays === null"
+                class="spinner"
+              ></div>
+              <div
+                v-else
                 class="flex items-baseline text-2xl font-semibold text-incognitee-green"
               >
                 {{ formatBigDecimalBalance(summaryTeerDays) }}
@@ -638,40 +653,25 @@
       </div>
     </div>
   </div>
-  <!-- Choose Wallet -->
-  <ChooseWalletOverlay
-    :show="showChooseWalletOverlay"
-    :close="closeChooseWalletOverlay"
-    :onExtensionAccountChange="onExtensionAccountChange"
-  />
 </template>
 
 <script setup lang="ts">
 import {
-  web3Accounts,
-  web3Enable,
   web3FromAddress,
 } from "@polkadot/extension-dapp";
 import { ApiPromise, WsProvider } from "@polkadot/api";
 import { cryptoWaitReady } from "@polkadot/util-crypto";
-import { onMounted, onUnmounted, computed, ref, watch } from "vue";
+import {onMounted, onUnmounted, computed, ref, watch, defineProps} from "vue";
 import { useRouter } from "vue-router";
 import { useAccount } from "~/store/account.ts";
 import { formatDecimalBalance } from "~/helpers/numbers";
 import { useSystemHealth } from "~/store/systemHealth.ts";
-import { ChainId, chainConfigs } from "~/configs/chains.ts";
+import { chainConfigs, TEER_DECIMALS } from "~/configs/chains.ts";
 import { useInterval } from "@vueuse/core";
 import { XMarkIcon } from "@heroicons/vue/20/solid";
 import { eventBus } from "~/helpers/eventBus";
-import { loadEnv, teerdaysNetwork, isLive } from "~/lib/environmentConfig";
+import { teerdaysNetwork } from "~/lib/environmentConfig";
 import { Bond, PendingUnlock } from "~/lib/teerDays";
-import {
-  extensionAccounts,
-  connectExtension,
-  injectorForAddress,
-} from "~/lib/signerExtensionUtils";
-import { nextTick } from "vue";
-import ChooseWalletOverlay from "~/components/overlays/ChooseWalletOverlay.vue";
 import InfoBanner from "~/components/ui/InfoBanner.vue";
 import { formatBigDecimalBalance } from "~/helpers/numbers.ts";
 
@@ -684,41 +684,27 @@ const toggleAccordion = (index) => {
 const accountStore = useAccount();
 const systemHealth = useSystemHealth();
 const router = useRouter();
-const accounts = ref([]);
-const selectedAccount = ref(null);
 const currentBond = ref(null);
 const pendingUnlock = ref(null);
 const allBonds = ref([]);
-const summaryHolders = ref(0);
-const summaryTeerBonded = ref(0);
-const summaryTeerDays = ref(0);
-const isChoosingAccount = ref(false);
+const summaryHolders = ref(null);
+const summaryTeerBonded = ref(null);
+const summaryTeerDays = ref(null);
 
-const isMobile = ref(false);
-
-// Überwache die Bildschirmgröße und aktualisiere den isMobile-Wert
-const checkIfMobile = () => {
-  isMobile.value = window.matchMedia("(max-width: 768px)").matches;
-};
 const dropSubscriptions = async () => {
   console.log("dropping subscriptions");
   integriteeNetworkApi?.disconnect();
   integriteeNetworkApi = null;
-  accountStore.setInjector(null);
   isFetchingTeerBalance.value = false;
 };
-const onExtensionAccountChange = async (selectedAddress) => {
+
+watch(
+  () => accountStore.getAddress,
+  async () => await onExtensionAccountChange(),
+);
+const onExtensionAccountChange = async () => {
   await dropSubscriptions();
-  console.log("user selected extension account:", selectedAddress);
-  try {
-    accountStore.setAccount(selectedAddress.toString());
-    accountStore.setInjector(await injectorForAddress(accountStore.getAddress));
-  } catch (e) {
-    console.warn("could not load injected account" + e);
-    alert(
-      "could not find selected address in extensions. Have you enabled your extensions?",
-    );
-  }
+  console.log("re-subscribing to TEERday data using account:", accountStore.getAddress);
   await subscribeToTeerDayStats();
   if (accountStore.getAddress === "none") {
     console.log("skipping api init. no address");
@@ -740,7 +726,6 @@ const onExtensionAccountChange = async (selectedAddress) => {
         teerdaysNetwork,
       );
       accountStore.setBalanceFrozen(BigInt(currentFrozen), teerdaysNetwork);
-      closeChooseWalletOverlay();
       isFetchingTeerBalance.value = false;
     },
   );
@@ -759,10 +744,10 @@ const onExtensionAccountChange = async (selectedAddress) => {
         let lastUpdated = new Date(0);
         lastUpdated.setUTCMilliseconds(bond.lastUpdated.toNumber());
         currentBond.value = new Bond(
-          bond.value / Math.pow(10, accountStore.decimals),
+          bond.value / Math.pow(10, TEER_DECIMALS),
           lastUpdated,
           bond.accumulatedTokentime /
-            Math.pow(10, accountStore.decimals) /
+            Math.pow(10, TEER_DECIMALS) /
             86400 /
             1000,
         );
@@ -783,7 +768,7 @@ const onExtensionAccountChange = async (selectedAddress) => {
         unlockDate.setUTCMilliseconds(unlockEpoch);
         console.log("Unlock date:" + unlockDate + "epoch:" + unlockEpoch);
         pendingUnlock.value = new PendingUnlock(
-          timestamp_amount[1] / Math.pow(10, accountStore.decimals),
+          timestamp_amount[1] / Math.pow(10, TEER_DECIMALS),
           unlockDate,
         );
       } else {
@@ -793,64 +778,6 @@ const onExtensionAccountChange = async (selectedAddress) => {
   );
 };
 
-const connect = () => {
-  web3Enable("Integritee Dapp")
-    .then((extensions) => {
-      console.log("Enabled extensions:", extensions);
-
-      // Check if any extensions are found
-      if (extensions.length === 0) {
-        console.error(
-          "No wallet extensions found. Please install or enable a wallet.",
-        );
-        alert("No wallet extensions found. Please install or enable a wallet.");
-        return; // Stop execution if no extensions are found
-      }
-
-      return web3Accounts();
-    })
-    .then((accountsList) => {
-      // If web3Accounts() didn't return a list, exit gracefully
-      if (!accountsList) {
-        console.error("No accounts found. Please unlock your wallet.");
-        alert("No accounts found. Please unlock your wallet.");
-        return;
-      }
-
-      // If accounts are found, store them
-      accounts.value = accountsList;
-      console.log("Found accounts:", accountsList);
-
-      if (accountsList.length > 0) {
-        // Wallet accounts found, scroll to the wallet section
-        nextTick(() => {
-          const walletSection = document.getElementById("wallet");
-          if (walletSection) {
-            // Scroll with smooth behavior
-            walletSection.scrollIntoView({
-              behavior: "smooth",
-              block: "start",
-            });
-          } else {
-            console.error("Wallet section not found.");
-          }
-        });
-      } else {
-        console.error(
-          "No accounts detected. Please unlock your wallet or create an account.",
-        );
-        alert(
-          "No accounts detected. Please unlock your wallet or create an account.",
-        );
-      }
-    })
-    .catch((error) => {
-      // Handle any errors during the connection process
-      console.error("Error during wallet connection:", error);
-      alert("Error during wallet connection. Please try again.");
-    });
-};
-
 let integriteeNetworkApi: ApiPromise | null = null;
 
 const subscribeToTeerDayStats = async () => {
@@ -859,13 +786,6 @@ const subscribeToTeerDayStats = async () => {
     "trying to init api at " + chainConfigs[teerdaysNetwork.value].api,
   );
   integriteeNetworkApi = await ApiPromise.create({ provider: wsProvider });
-  accountStore.setDecimals(Number(integriteeNetworkApi.registry.chainDecimals));
-  accountStore.setSS58Format(Number(integriteeNetworkApi.registry.chainSS58));
-  if (accountStore.hasInjector) {
-    router.push({
-      query: { address: accountStore.getAddress },
-    });
-  }
   console.log("api initialized");
   allBonds.value = [];
   cryptoWaitReady().then(() => {
@@ -879,10 +799,10 @@ const subscribeToTeerDayStats = async () => {
           let bond = maybeBond.unwrap();
           lastUpdated.setUTCMilliseconds(bond.lastUpdated.toNumber());
           let mybond = new Bond(
-            bond.value / Math.pow(10, accountStore.decimals),
+            bond.value / Math.pow(10, TEER_DECIMALS),
             lastUpdated,
             bond.accumulatedTokentime /
-              Math.pow(10, accountStore.decimals) /
+              Math.pow(10, TEER_DECIMALS) /
               86400 /
               1000,
           );
@@ -916,19 +836,11 @@ const subscribeToTeerDayStats = async () => {
 };
 
 onMounted(async () => {
-  eventBus.on("addressClicked", openChooseWalletOverlay);
-  const injectedAddress = router.currentRoute.value.query.address;
-  if (injectedAddress) {
-    connectExtension();
-    onExtensionAccountChange(injectedAddress.toString());
-  } else {
-    subscribeToTeerDayStats();
-    //openChooseWalletOverlay();
-  }
+  await onExtensionAccountChange();
 });
 
-onUnmounted(() => {
-  eventBus.off("addressClicked", openChooseWalletOverlay);
+onUnmounted(async () => {
+  await dropSubscriptions();
 });
 
 const isFetchingTeerBalance = ref(true);
@@ -937,7 +849,7 @@ const amountToBond = ref(0);
 const bondAmount = () => {
   // Handle the bonding process here
   const amount =
-    BigInt(amountToBond.value) * BigInt(Math.pow(10, accountStore.decimals));
+    BigInt(amountToBond.value) * BigInt(Math.pow(10, TEER_DECIMALS));
   console.log(`Bonding ${amount}`);
   txStatus.value = "⌛ Bonding. Please sign the transaction in your wallet.";
   openStatusOverlay();
@@ -967,7 +879,7 @@ const amountToUnbond = ref(0);
 const unbondAmount = () => {
   // Handle the bonding process here
   const amount =
-    BigInt(amountToUnbond.value) * BigInt(Math.pow(10, accountStore.decimals));
+    BigInt(amountToUnbond.value) * BigInt(Math.pow(10, TEER_DECIMALS));
   console.log(`Unbonding ${amount}`);
   txStatus.value = "⌛ Unbonding. Please sign the transaction in your wallet.";
   openStatusOverlay();
@@ -1080,16 +992,13 @@ const txErrHandlerIntegritee = (err) => {
   txStatus.value = `😞 Transaction failed: ${err.toString()}.`;
 };
 
-const showChooseWalletOverlay = ref(false);
-const openChooseWalletOverlay = () => {
-  isChoosingAccount.value = true;
-  isFetchingTeerBalance.value = true;
-  showChooseWalletOverlay.value = true;
-};
-const closeChooseWalletOverlay = () => {
-  isChoosingAccount.value == false;
-  showChooseWalletOverlay.value = false;
-};
+const props = defineProps({
+  isMobile: {
+    type: Boolean,
+    required: true,
+  },
+});
+
 </script>
 
 <style scoped>
diff --git a/configs/chains.ts b/configs/chains.ts
index e602e63..5847a41 100644
--- a/configs/chains.ts
+++ b/configs/chains.ts
@@ -78,3 +78,5 @@ export const chainConfigs: Record<ChainId, ChainConfig> = {
     api: "wss://scv1.asset-hub-polkadot.api.incognitee.io:443",
   },
 };
+
+export const TEER_DECIMALS = 12;
diff --git a/pages/index.vue b/pages/index.vue
index 70b24ea..034f8ed 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -32,7 +32,7 @@
   <div v-if="activeApp === 'vouchers'"><VouchersTab /></div>
   <div v-else-if="activeApp === 'swap'"><SwapTab /></div>
   <div v-else-if="activeApp === 'gov'"><GovTab /></div>
-  <div v-else-if="activeApp === 'teerdays'"><TeerDaysTab /></div>
+  <div v-else-if="activeApp === 'teerdays'"><TeerDaysTab :isMobile="isMobile" /></div>
   <!-- New Wallet -->
   <OverlayDialog
     :show="showNewWalletOverlay"

From d13202341d4f6cac5a23d445bce75eeeafd0367c Mon Sep 17 00:00:00 2001
From: Alain Brenzikofer <alain@integritee.network>
Date: Wed, 15 Jan 2025 22:24:44 +0100
Subject: [PATCH 2/2] prettier

---
 components/overlays/SessionProxiesOverlay.vue | 11 +++++--
 components/tabs/TeerDaysTab.vue               | 32 ++++++-------------
 components/tabs/WalletTab.vue                 |  4 +--
 components/ui/HealthIndicator.vue             |  4 +--
 components/ui/Sidebar.vue                     |  8 ++++-
 configs/chains.ts                             |  2 +-
 configs/incognitee.ts                         |  4 +--
 lib/environmentConfig.ts                      | 29 +++++++++++++----
 lib/wellKnownIdentites.ts                     |  2 +-
 nuxt.config.ts                                |  3 +-
 pages/dot.vue                                 |  2 +-
 pages/index.vue                               |  4 ++-
 pages/teer.vue                                |  2 +-
 13 files changed, 62 insertions(+), 45 deletions(-)

diff --git a/components/overlays/SessionProxiesOverlay.vue b/components/overlays/SessionProxiesOverlay.vue
index 94ba180..3b8ab93 100644
--- a/components/overlays/SessionProxiesOverlay.vue
+++ b/components/overlays/SessionProxiesOverlay.vue
@@ -172,10 +172,15 @@ const updateAuthorization = async () => {
     selectedSessionProxyRole.value,
   );
   if (bestSessionProxyRole.value === null) {
-      if (accountStore.getDecimalBalanceFree(incogniteeSidechain) < INCOGNITEE_SESSION_PROXY_DEPOSIT + INCOGNITEE_TX_FEE) {
-        alert(
+    if (
+      accountStore.getDecimalBalanceFree(incogniteeSidechain) <
+      INCOGNITEE_SESSION_PROXY_DEPOSIT + INCOGNITEE_TX_FEE
+    ) {
+      alert(
         "Insufficient funds to register session proxy. You need at least " +
-          formatDecimalBalance(INCOGNITEE_SESSION_PROXY_DEPOSIT + INCOGNITEE_TX_FEE) +
+          formatDecimalBalance(
+            INCOGNITEE_SESSION_PROXY_DEPOSIT + INCOGNITEE_TX_FEE,
+          ) +
           " " +
           accountStore.getSymbol +
           " private balance to register a session proxy",
diff --git a/components/tabs/TeerDaysTab.vue b/components/tabs/TeerDaysTab.vue
index 0dd7604..db91430 100644
--- a/components/tabs/TeerDaysTab.vue
+++ b/components/tabs/TeerDaysTab.vue
@@ -314,10 +314,7 @@
             <dd
               class="mt-1 flex items-baseline justify-between md:block lg:flex"
             >
-              <div
-                v-if="summaryHolders === null"
-                class="spinner"
-              ></div>
+              <div v-if="summaryHolders === null" class="spinner"></div>
               <div
                 v-else
                 class="flex items-baseline text-2xl font-semibold text-incognitee-green"
@@ -347,10 +344,7 @@
             <dd
               class="mt-1 flex items-baseline justify-between md:block lg:flex"
             >
-              <div
-                v-if="summaryTeerBonded === null"
-                class="spinner"
-              ></div>
+              <div v-if="summaryTeerBonded === null" class="spinner"></div>
               <div
                 v-else
                 class="flex items-baseline text-2xl font-semibold text-incognitee-green"
@@ -380,10 +374,7 @@
             <dd
               class="mt-1 flex items-baseline justify-between md:block lg:flex"
             >
-              <div
-                v-if="summaryTeerDays === null"
-                class="spinner"
-              ></div>
+              <div v-if="summaryTeerDays === null" class="spinner"></div>
               <div
                 v-else
                 class="flex items-baseline text-2xl font-semibold text-incognitee-green"
@@ -656,12 +647,10 @@
 </template>
 
 <script setup lang="ts">
-import {
-  web3FromAddress,
-} from "@polkadot/extension-dapp";
+import { web3FromAddress } from "@polkadot/extension-dapp";
 import { ApiPromise, WsProvider } from "@polkadot/api";
 import { cryptoWaitReady } from "@polkadot/util-crypto";
-import {onMounted, onUnmounted, computed, ref, watch, defineProps} from "vue";
+import { onMounted, onUnmounted, computed, ref, watch, defineProps } from "vue";
 import { useRouter } from "vue-router";
 import { useAccount } from "~/store/account.ts";
 import { formatDecimalBalance } from "~/helpers/numbers";
@@ -704,7 +693,10 @@ watch(
 );
 const onExtensionAccountChange = async () => {
   await dropSubscriptions();
-  console.log("re-subscribing to TEERday data using account:", accountStore.getAddress);
+  console.log(
+    "re-subscribing to TEERday data using account:",
+    accountStore.getAddress,
+  );
   await subscribeToTeerDayStats();
   if (accountStore.getAddress === "none") {
     console.log("skipping api init. no address");
@@ -721,10 +713,7 @@ const onExtensionAccountChange = async () => {
     }) => {
       console.log("TEER balance:" + currentFree);
       accountStore.setBalanceFree(BigInt(currentFree), teerdaysNetwork);
-      accountStore.setBalanceReserved(
-        BigInt(currentReserved),
-        teerdaysNetwork,
-      );
+      accountStore.setBalanceReserved(BigInt(currentReserved), teerdaysNetwork);
       accountStore.setBalanceFrozen(BigInt(currentFrozen), teerdaysNetwork);
       isFetchingTeerBalance.value = false;
     },
@@ -998,7 +987,6 @@ const props = defineProps({
     required: true,
   },
 });
-
 </script>
 
 <style scoped>
diff --git a/components/tabs/WalletTab.vue b/components/tabs/WalletTab.vue
index f58e67f..e2ee2df 100644
--- a/components/tabs/WalletTab.vue
+++ b/components/tabs/WalletTab.vue
@@ -11,7 +11,7 @@
     <WarningBanner
       v-if="
         (accountStore.getSymbol === 'TEER' ||
-        accountStore.getSymbol === 'DOT') &&
+          accountStore.getSymbol === 'DOT') &&
         accountStore.getAddress !== 'none' &&
         !accountStore.hasInjector
       "
@@ -1037,7 +1037,7 @@ import {
   INCOGNITEE_SHIELDING_FEE_FRACTION,
   INCOGNITEE_TX_FEE,
   INCOGNITEE_UNSHIELDING_FEE,
-  minUnshieldingAmount
+  minUnshieldingAmount,
 } from "~/configs/incognitee";
 import { formatDecimalBalance } from "~/helpers/numbers";
 import WarningBanner from "~/components/ui/WarningBanner.vue";
diff --git a/components/ui/HealthIndicator.vue b/components/ui/HealthIndicator.vue
index 0b6a448..42bf2ab 100644
--- a/components/ui/HealthIndicator.vue
+++ b/components/ui/HealthIndicator.vue
@@ -41,8 +41,8 @@ const systemHealth = useSystemHealth();
 const router = useRouter();
 
 const contextualHealth = computed(() => {
-//    case "/teerdays":
-//      return systemHealth.getIntegriteeSystemHealth.overall();
+  //    case "/teerdays":
+  //      return systemHealth.getIntegriteeSystemHealth.overall();
   return systemHealth.getSidechainSystemHealth.overall();
 });
 
diff --git a/components/ui/Sidebar.vue b/components/ui/Sidebar.vue
index 21da8ff..e0411e4 100644
--- a/components/ui/Sidebar.vue
+++ b/components/ui/Sidebar.vue
@@ -103,7 +103,13 @@
               Messages
             </button>
           </li>
-          <li v-if="accountStore.getSymbol === 'TEER' || accountStore.getSymbol === 'DOT'" class="px-4">
+          <li
+            v-if="
+              accountStore.getSymbol === 'TEER' ||
+              accountStore.getSymbol === 'DOT'
+            "
+            class="px-4"
+          >
             <button
               class="flex items-center w-full text-left text-sm font-semibold hover:bg-gray-800 px-2 py-2 rounded-md"
               @click="
diff --git a/configs/chains.ts b/configs/chains.ts
index 5847a41..40912e0 100644
--- a/configs/chains.ts
+++ b/configs/chains.ts
@@ -11,7 +11,7 @@ export enum ChainId {
   IntegriteeDev,
   IncogniteePaseoRelay,
   IncogniteeIntegriteeKusama,
-  IncogniteeAssetHubPolkadot
+  IncogniteeAssetHubPolkadot,
 }
 
 type ChainConfig = {
diff --git a/configs/incognitee.ts b/configs/incognitee.ts
index 9556b65..271875c 100644
--- a/configs/incognitee.ts
+++ b/configs/incognitee.ts
@@ -13,7 +13,7 @@ export const minUnshieldingAmount = (token: string): number => {
     return 1.1;
   } else if (token === "DOT") {
     return 0.1;
-  } else  {
+  } else {
     return 0.1;
   }
-}
+};
diff --git a/lib/environmentConfig.ts b/lib/environmentConfig.ts
index 4a79003..12369f4 100644
--- a/lib/environmentConfig.ts
+++ b/lib/environmentConfig.ts
@@ -29,19 +29,34 @@ export const loadEnv = async (envFile?: string) => {
     return envOverride[key] ?? envDefault[key] ?? defaultValue;
   };
 
-  const shieldingTargetEnv = getEnvValue("SHIELDING_TARGET", ChainId.PaseoRelay);
+  const shieldingTargetEnv = getEnvValue(
+    "SHIELDING_TARGET",
+    ChainId.PaseoRelay,
+  );
   const shieldingLimitEnv = getEnvValue("SHIELDING_LIMIT", Infinity);
-  const incogniteeSidechainEnv = getEnvValue("INCOGNITEE_SIDECHAIN", ChainId.IncogniteePaseoRelay);
-  const incogniteeShardEnv = getEnvValue("SHARD", "5wePd1LYa5M49ghwgZXs55cepKbJKhj5xfzQGfPeMS7c");
+  const incogniteeSidechainEnv = getEnvValue(
+    "INCOGNITEE_SIDECHAIN",
+    ChainId.IncogniteePaseoRelay,
+  );
+  const incogniteeShardEnv = getEnvValue(
+    "SHARD",
+    "5wePd1LYa5M49ghwgZXs55cepKbJKhj5xfzQGfPeMS7c",
+  );
   const isLiveEnv = getEnvValue("LIVE", true);
-  const integriteeNetworkEnv = getEnvValue("TEERDAYS_NETWORK", ChainId.IntegriteeKusama);
+  const integriteeNetworkEnv = getEnvValue(
+    "TEERDAYS_NETWORK",
+    ChainId.IntegriteeKusama,
+  );
 
   incogniteeShard.value = incogniteeShardEnv;
   shieldingTarget.value = ChainId[shieldingTargetEnv] ?? ChainId.PaseoRelay;
-  incogniteeSidechain.value = ChainId[incogniteeSidechainEnv] ?? ChainId.IncogniteePaseoRelay;
-  shieldingLimit.value = shieldingLimitEnv > 0 ? Number(shieldingLimitEnv) : Infinity;
+  incogniteeSidechain.value =
+    ChainId[incogniteeSidechainEnv] ?? ChainId.IncogniteePaseoRelay;
+  shieldingLimit.value =
+    shieldingLimitEnv > 0 ? Number(shieldingLimitEnv) : Infinity;
   isLive.value = toBoolean(isLiveEnv);
-  teerdaysNetwork.value = ChainId[integriteeNetworkEnv] ?? ChainId.IntegriteeKusama;
+  teerdaysNetwork.value =
+    ChainId[integriteeNetworkEnv] ?? ChainId.IntegriteeKusama;
 
   console.log(
     "SHIELDING_TARGET: env:" +
diff --git a/lib/wellKnownIdentites.ts b/lib/wellKnownIdentites.ts
index ce78a0b..be85dcc 100644
--- a/lib/wellKnownIdentites.ts
+++ b/lib/wellKnownIdentites.ts
@@ -31,5 +31,5 @@ export const identities = [
   {
     username: "IncogniteeQuizMaster",
     address: "12sJZcxqGkBUN8xesuLxC4hbYk7Y6W6Amkm52onbcxgfvnzA",
-  }
+  },
 ];
diff --git a/nuxt.config.ts b/nuxt.config.ts
index d80d1f4..c09c351 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -16,7 +16,8 @@ export default defineNuxtConfig({
     head: {
       title: "Incognitee",
       charset: "utf-8",
-      viewport: "width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no",
+      viewport:
+        "width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no",
       meta: [
         // {
         //   hid: 'robots',
diff --git a/pages/dot.vue b/pages/dot.vue
index f9e1762..11947fb 100644
--- a/pages/dot.vue
+++ b/pages/dot.vue
@@ -3,5 +3,5 @@
 </template>
 
 <script setup>
-import IndexPage from './index.vue';
+import IndexPage from "./index.vue";
 </script>
diff --git a/pages/index.vue b/pages/index.vue
index 034f8ed..3a35aaa 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -32,7 +32,9 @@
   <div v-if="activeApp === 'vouchers'"><VouchersTab /></div>
   <div v-else-if="activeApp === 'swap'"><SwapTab /></div>
   <div v-else-if="activeApp === 'gov'"><GovTab /></div>
-  <div v-else-if="activeApp === 'teerdays'"><TeerDaysTab :isMobile="isMobile" /></div>
+  <div v-else-if="activeApp === 'teerdays'">
+    <TeerDaysTab :isMobile="isMobile" />
+  </div>
   <!-- New Wallet -->
   <OverlayDialog
     :show="showNewWalletOverlay"
diff --git a/pages/teer.vue b/pages/teer.vue
index 6a33d92..406c043 100644
--- a/pages/teer.vue
+++ b/pages/teer.vue
@@ -3,5 +3,5 @@
 </template>
 
 <script setup>
-import IndexPage from './index.vue';
+import IndexPage from "./index.vue";
 </script>