From 91fd1f0a19fe7359214a1b4afdc7bc4de7260af7 Mon Sep 17 00:00:00 2001
From: Guru <guru@tor.us>
Date: Fri, 29 Nov 2024 12:47:06 +0530
Subject: [PATCH 1/2] fix: lints

---
 src/components/WalletTabs.vue               | 2 +-
 src/components/payments/EstimateChanges.vue | 2 +-
 src/components/settings/Display.vue         | 4 ++--
 src/pages/wallet/Home.vue                   | 2 +-
 src/pages/wallet/NftDetail.vue              | 2 +-
 5 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/components/WalletTabs.vue b/src/components/WalletTabs.vue
index b23e47d7..142ed647 100644
--- a/src/components/WalletTabs.vue
+++ b/src/components/WalletTabs.vue
@@ -101,7 +101,7 @@ const logout = async () => {
         :class="[value.mobHidden ? 'hidden' : 'block']"
       >
         <div
-          :id="key + '_link'"
+          :id="`${key}_link`"
           class="flex flex-col h-full items-center justify-center select-none w-16 py-1"
           :class="[key === tab ? 'border-t-2 border-app-primary-500' : '']"
         >
diff --git a/src/components/payments/EstimateChanges.vue b/src/components/payments/EstimateChanges.vue
index 6effc3fe..dcd346c9 100644
--- a/src/components/payments/EstimateChanges.vue
+++ b/src/components/payments/EstimateChanges.vue
@@ -46,7 +46,7 @@ const { t } = useI18n();
       <div v-if="props.estimationInProgress" class="text-xs italic text-app-text-500 dark:text-app-text-dark-500">Estimating...</div>
       <div v-for="item in props.estimatedBalanceChange" :key="item.symbol" class="text-xs italic text-red-500">
         <div v-if="!props.estimationInProgress" :class="item.changes >= 0 && 'text-green-400'">
-          {{ item.changes + "   " + symbols[item.mint] }}
+          {{ `${item.changes}   ${symbols[item.mint]}` }}
         </div>
       </div>
     </div>
diff --git a/src/components/settings/Display.vue b/src/components/settings/Display.vue
index 05544287..8a60ffb5 100644
--- a/src/components/settings/Display.vue
+++ b/src/components/settings/Display.vue
@@ -13,7 +13,7 @@ const { t } = useI18n();
     <div class="grid grid-cols-2 space-x-3">
       <div>
         <Button
-          v-ga="SettingsPageInteractions.DISPLAY + 'light'"
+          v-ga="`${SettingsPageInteractions.DISPLAY}light`"
           class="w-full"
           :variant="ControllerModule.isDarkMode ? 'tertiary' : 'primary'"
           :block="true"
@@ -23,7 +23,7 @@ const { t } = useI18n();
       </div>
       <div>
         <Button
-          v-ga="SettingsPageInteractions.DISPLAY + 'dark'"
+          v-ga="`${SettingsPageInteractions.DISPLAY}dark`"
           :variant="ControllerModule.isDarkMode ? 'primary' : 'tertiary'"
           :block="true"
           class="w-full"
diff --git a/src/pages/wallet/Home.vue b/src/pages/wallet/Home.vue
index 80ae5cb3..d23f7a4f 100644
--- a/src/pages/wallet/Home.vue
+++ b/src/pages/wallet/Home.vue
@@ -77,7 +77,7 @@ const lastUpdateString = computed(() => {
       <header>
         <div class="flex items-center max-w-7xl justify-between">
           <h1 class="text-xl sm:text-3xl font-medium leading-tight text-app-text-500 dark:text-app-text-dark-400">
-            {{ t(NAVIGATION_LIST["home"].title) }}
+            {{ t(NAVIGATION_LIST.home.title) }}
           </h1>
           <div class="flex items-center space-x-2">
             <AddressAndScan class="hidden lg:flex" :selected-address="ControllerModule.selectedAddress" />
diff --git a/src/pages/wallet/NftDetail.vue b/src/pages/wallet/NftDetail.vue
index bbc5d35e..1c42ac67 100644
--- a/src/pages/wallet/NftDetail.vue
+++ b/src/pages/wallet/NftDetail.vue
@@ -79,7 +79,7 @@ function getNftFetchMessage(state: FETCH_STATE): string {
       <span class="text-app-text-500 nft-title">You have {{ nfts.length }} NFTs</span>
       <div v-if="nfts.length === 0" class="w-full shadow dark:shadow-dark bg-white dark:bg-app-gray-700 rounded-md mt-10 p-12 pt-8">
         <span class="text-app-text-500 dark:text-app-text-dark-400 text-center inline-block">{{ getNftFetchMessage(exploreNFTSFetchState) }}</span>
-        <RoundLoader v-if="exploreNFTSFetchState == 'loading'" class="w-10 h-10 mx-auto mb-4" color="border-white" />
+        <RoundLoader v-if="exploreNFTSFetchState === 'loading'" class="w-10 h-10 mx-auto mb-4" color="border-white" />
         <div v-if="exploreNFTS.length" class="flex flex-wrap justify-center mt-12">
           <div v-for="collection in exploreNFTS" :key="collection.image" class="flex flex-col items-center m-4 w-48 popular-nft">
             <img

From 9d564c4e84af87f59df991f67730500acc78605f Mon Sep 17 00:00:00 2001
From: Guru <guru@tor.us>
Date: Fri, 29 Nov 2024 12:48:10 +0530
Subject: [PATCH 2/2] feat: depreceated component

---
 src/assets/star.svg                         |  3 ++
 src/components/depreceiated/Depreciated.vue | 46 +++++++++++++++++++++
 src/components/frame/PopupLogin.vue         | 30 +++++++++++++-
 src/components/payments/PaymentConfirm.vue  |  2 +-
 src/pages/RedirectHandler.vue               | 27 ++++--------
 5 files changed, 85 insertions(+), 23 deletions(-)
 create mode 100644 src/assets/star.svg
 create mode 100644 src/components/depreceiated/Depreciated.vue

diff --git a/src/assets/star.svg b/src/assets/star.svg
new file mode 100644
index 00000000..8482bb95
--- /dev/null
+++ b/src/assets/star.svg
@@ -0,0 +1,3 @@
+<svg width="25" height="24" viewBox="0 0 25 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.5 3V7V3ZM3.5 5H7.5H3.5ZM6.5 17V21V17ZM4.5 19H8.5H4.5ZM13.5 3L15.786 9.857L21.5 12L15.786 14.143L13.5 21L11.214 14.143L5.5 12L11.214 9.857L13.5 3Z" fill="#F9FAFB" stroke="#F9FAFB" stroke-width="1.25" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/src/components/depreceiated/Depreciated.vue b/src/components/depreceiated/Depreciated.vue
new file mode 100644
index 00000000..c8c53b07
--- /dev/null
+++ b/src/components/depreceiated/Depreciated.vue
@@ -0,0 +1,46 @@
+<script setup lang="ts">
+import { XIcon } from "@heroicons/vue/solid";
+
+import StartLogo from "@/assets/star.svg";
+
+const props = defineProps({
+  useNewContent: {
+    type: Boolean,
+    default: false,
+  },
+});
+
+const redirect = (redirectUrl: string) => {
+  window.open(redirectUrl, "_blank");
+};
+</script>
+
+<template>
+  <div :class="['flex justify-center items-center bg-gray-900', useNewContent ? 'min-h-screen' : 'min-h-[222px] rounded-3xl']">
+    <div class="relative text-center rounded-lg px-6 w-full max-w-md text-white shadow-lg">
+      <!-- Title with Icon and Close Button -->
+      <div class="flex items-center justify-between mb-4">
+        <div class="flex items-center">
+          <img class="h-6 w-6 mr-2" :src="StartLogo" alt="Star Logo" />
+          <h1 class="text-xl font-bold text-gray-50">Torus Solana Wallet Upgrade</h1>
+        </div>
+        <button v-if="!props.useNewContent" type="button" class="absolute -top-4 right-4" @click="$emit('close')">
+          <XIcon class="w-4 h-4 text-app-gray-50 dark:text-gray-50 text-opacity-70 hover:text-opacity-100" />
+        </button>
+      </div>
+
+      <!-- Main Text -->
+      <p class="mb-4 text-sm font-normal text-gray-300">
+        We are currently upgrading the Torus Solana Wallet for a better experience. You may still access your funds at
+        <a href="https://solana.tor.us" class="text-blue-500" @click="redirect('https://solana.tor.us')"> solana.tor.us </a>
+        directly.
+      </p>
+
+      <!-- Apology & Community Forum -->
+      <p class="text-sm font-normal text-gray-300">
+        We apologize for any inconvenience. For assistance, visit our
+        <a href="https://web3auth.io/community" class="text-blue-500" @click="redirect('https://web3auth.io/community')"> Community Forum </a>.
+      </p>
+    </div>
+  </div>
+</template>
diff --git a/src/components/frame/PopupLogin.vue b/src/components/frame/PopupLogin.vue
index 8929f8f6..e27521f7 100755
--- a/src/components/frame/PopupLogin.vue
+++ b/src/components/frame/PopupLogin.vue
@@ -12,6 +12,7 @@ import { LOGIN_CONFIG } from "@/utils/enums";
 import { getWhiteLabelLogo, isWhiteLabelSet } from "@/utils/whitelabel";
 
 import ControllerModule from "../../modules/controllers";
+import Depreciated from "../depreceiated/Depreciated.vue";
 
 withDefaults(
   defineProps<{
@@ -29,8 +30,9 @@ const emits = defineEmits(["onClose", "onLogin"]);
 const closeModal = () => {
   emits("onClose");
 };
-const onLogin = (provider: string, userEmail: string) => {
-  emits("onLogin", provider, userEmail);
+const onLogin = (_provider: string, _userEmail: string) => {
+  // depreciating iframe login
+  // emits("onLogin", provider, userEmail);
 };
 
 const loginButtonsArray: LOGIN_CONFIG[] = Object.values(config.loginConfig);
@@ -41,7 +43,9 @@ const setActiveButton = (provider: string) => {
   activeButton.value = provider;
 };
 const refDiv = ref(null);
+const isDepreciatedOpen = ref(true);
 </script>
+
 <template>
   <TransitionRoot appear :show="isOpen" as="template">
     <Dialog :open="isOpen" as="div" :initial-focus="refDiv">
@@ -113,6 +117,28 @@ const refDiv = ref(null);
       </div>
     </Dialog>
   </TransitionRoot>
+  <TransitionRoot appear :show="isDepreciatedOpen" as="template">
+    <Dialog :open="isDepreciatedOpen" as="div" :initial-focus="refDiv" @close="closeModal">
+      <div ref="refDiv" class="fixed inset-0 z-40 overflow-y-auto">
+        <div class="min-h-screen px-4 flex justify-center items-center">
+          <DialogOverlay class="fixed inset-0 opacity-30 bg-gray-200 dark:bg-gray-500" />
+          <TransitionChild
+            as="template"
+            enter="duration-300 ease-out"
+            enter-from="opacity-0 scale-95"
+            enter-to="opacity-100 scale-100"
+            leave="duration-200 ease-in"
+            leave-from="opacity-100 scale-100"
+            leave-to="opacity-0 scale-95"
+          >
+            <div class="relative inline-block w-full max-w-sm text-left align-middle transition-all transform shadow-xl" style="height: auto">
+              <Depreciated :use-new-content="false" @close="closeModal" />
+            </div>
+          </TransitionChild>
+        </div>
+      </div>
+    </Dialog>
+  </TransitionRoot>
 </template>
 
 <style scoped>
diff --git a/src/components/payments/PaymentConfirm.vue b/src/components/payments/PaymentConfirm.vue
index e95f5274..bcaac63b 100644
--- a/src/components/payments/PaymentConfirm.vue
+++ b/src/components/payments/PaymentConfirm.vue
@@ -141,7 +141,7 @@ const explorerUrl = computed(() => {
           </div>
           <span class="flex flex-row mt-3 justify-between items-center w-full text-sm text-app-text-500 dark:text-app-text-dark-500">
             <p>{{ t("walletTransfer.transferFee") }} <img :src="QuestionMark" alt="QuestionMark" class="ml-2 float-right mt-1 cursor-pointer" /></p>
-            <p>{{ props.isGasless ? "Paid by DApp" : props.cryptoTxFee + " SOL" }}</p>
+            <p>{{ props.isGasless ? "Paid by DApp" : `${props.cryptoTxFee} SOL` }}</p>
           </span>
 
           <p
diff --git a/src/pages/RedirectHandler.vue b/src/pages/RedirectHandler.vue
index 60b0bcb5..220f8446 100644
--- a/src/pages/RedirectHandler.vue
+++ b/src/pages/RedirectHandler.vue
@@ -1,30 +1,17 @@
 <script setup lang="ts">
-import { RedirectHandler } from "@toruslabs/base-controllers";
-import Loader from "@toruslabs/vue-components/common/Loader.vue";
 import { onMounted } from "vue";
 
-import { redirectToResult, useRedirectFlow } from "../utils/redirectflowHelpers";
+import Depreciated from "@/components/depreceiated/Depreciated.vue";
 
-const { isRedirectFlow, method, resolveRoute, req_id, jsonrpc } = useRedirectFlow();
-
-const checkTopupSuccess = async () => {
-  const queryParameters = new URLSearchParams(window.location.search);
-  const state = queryParameters.get("state");
-  if (isRedirectFlow && state) {
-    redirectToResult(jsonrpc, { success: true, method }, req_id, resolveRoute);
-  }
-};
 onMounted(async () => {
-  checkTopupSuccess();
-  if (!isRedirectFlow) {
-    const redirectHandler = new RedirectHandler();
-    await redirectHandler.handle();
-  }
+  // checkTopupSuccess();
+  // if (!isRedirectFlow) {
+  //   const redirectHandler = new RedirectHandler();
+  //   await redirectHandler.handle();
+  // }
 });
 </script>
 
 <template>
-  <div class="min-h-screen bg-white dark:bg-app-gray-800 flex justify-center items-center">
-    <Loader :use-spinner="true" />
-  </div>
+  <Depreciated :use-new-content="true" />
 </template>