fix conflicts

zkLinkProtocol · Apr 25, 2024 · 6949287 · 6949287
2 parents 45dd3d4 + 14bdb44
commit 6949287
Show file tree

Hide file tree

Showing 7 changed files with 128 additions and 28 deletions.
diff --git a/components/common/Timer.vue b/components/common/Timer.vue
@@ -49,7 +49,7 @@ const formatTimeDiff = (diff: number, onlyDays = false): string => {
 
   if (props.format === "human-readable") {
     if (onlyDays) {
-      return `~ ${day} day${day !== 1 ? "s" : ""}`
+      return `~ ${day + 1} day${day + 1 !== 1 ? "s" : ""}`;
     }
     let formattedString = "";
     if (hours > 0) formattedString += `${day} day ${hours} hour${hours > 1 ? "s" : ""} `;
@@ -70,7 +70,6 @@ const updateTimer = () => {
   diff.value = Math.max(targetTime - currentTime, 0);
   timer.value = formatTimeDiff(diff.value, props.onlyDays);
 
-
   if (diff.value === 0) {
     clearInterval(intervalId);
     return;

diff --git a/store/zksync/transactionStatus.ts b/store/zksync/transactionStatus.ts
@@ -47,10 +47,10 @@ export const getEstmatdDepositDelay = (networkKey: string): number => {
     return ESTIMATED_DEPOSIT_DELAY_SECONDARY;
   }
 };
-export const WITHDRAWAL_DELAY = 14 * 24 * 60 * 60 * 1000; // 7 * 24 hours
 
 export const WITHDRAWAL_CHECK_DELAY_DAYS = process.env.NODE_TYPE === "nexus-sepolia" ? 0.5 : 7;
 
+export const WITHDRAWAL_DELAY = 7 * 24 * 60 * 60 * 1000; // 7 * 24 hours
 export type Address = Hash;
 export type ForwardL2Request = {
   gateway: Address;

diff --git a/store/zksync/withdrawals.ts b/store/zksync/withdrawals.ts
@@ -214,10 +214,31 @@ export const useZkSyncWithdrawalsStore = defineStore("zkSyncWithdrawals", () =>
     );
     const withdrawals = transfers.items.filter((e) => e.type === "withdrawal" && e.token && e.amount);
     for (const withdrawal of withdrawals) {
-      if (isWithinDelayDays(withdrawal.timestamp)) continue;
       const { primaryNetwork, zkSyncNetworks, getNetworkInfo } = useNetworks();
+
       const transactionFromStorage = transactionStatusStore.getTransaction(withdrawal.transactionHash);
       if (transactionFromStorage) {
+        // check if tx.to.destination is matching with tx.token.networkKey for erc20
+        if (
+          transactionFromStorage.to.destination.key !== transactionFromStorage.token.networkKey &&
+          transactionFromStorage.token.symbol !== "ETH"
+        ) {
+          const { selectedNetwork } = storeToRefs(useNetworkStore());
+          const eraNetworks = getNetworkInfo(withdrawal) || selectedNetwork.value;
+          const obj = {
+            iconUrl: eraNetworks.logoUrl!,
+            key: "nova",
+            label: eraNetworks?.l1Network?.name ?? "",
+          };
+          transactionStatusStore.updateTransactionData(withdrawal.transactionHash, {
+            ...transactionFromStorage,
+            to: {
+              ...transactionFromStorage.to,
+              destination: obj,
+            },
+          });
+        }
+        if (isWithinDelayDays(withdrawal.timestamp)) continue;
         if (!transactionFromStorage.info.withdrawalFinalizationAvailable) {
           const status = await checkWithdrawalFinalizeAvailable(transactionFromStorage);
           if (status) {
@@ -280,7 +301,8 @@ export const useZkSyncWithdrawalsStore = defineStore("zkSyncWithdrawals", () =>
         },
         info: {
           expectedCompleteTimestamp: new Date(
-            new Date(withdrawalTransfer.timestamp).getTime() + WITHDRAWAL_DELAY
+            new Date(withdrawalTransfer.timestamp).getTime() +
+              getEstimateWithdrawalDelayDays(withdrawalTransfer.timestamp) * 24 * 3600 * 1000
           ).toISOString(),
           completed: withdrawal.status === "Finalized",
           withdrawalFinalizationAvailable: claimable,

diff --git a/utils/constants.ts b/utils/constants.ts
@@ -1,4 +1,3 @@
-import { WITHDRAWAL_DELAY } from "./../store/zksync/transactionStatus";
 import type { Token } from "@/types";
 
 export const ETH_TOKEN: Token = {
@@ -12,7 +11,13 @@ export const ETH_TOKEN: Token = {
 
 export const NOVA_CHAIN_ID = process.env.NODE_TYPE === "nexus" ? 810180 : 810181;
 
-export const WITHDRAWAL_DELAY_DAYS = 14;
+export const WITHDRAWAL_DELAY_DAYS = 7;
+
+// Last syncL2Requests tx on blast: Apr-20-2024 09:45:31 AM +UTC;
+// deposit before this time , estimate withdraw time is 14 days;
+// deposit after this time, estimate withdraw time is :
+// ( 14 days - (deposit time - this time)) < 7days ? 7days : ( 14 days - (deposit time - this time));
+export const LAST_BLAST_SYNCL2_TIME = 1713606331000;
 
 export const MERGE_TOKENS =
   process.env.NODE_TYPE === "nexus"

diff --git a/utils/helpers.ts b/utils/helpers.ts
@@ -58,3 +58,12 @@ export async function retry<T>(func: () => Promise<T>, options: RetryOptions = {
 export async function sleep(time: number) {
   return new Promise((resolve) => setTimeout(resolve, time));
 }
+export const getEstimateWithdrawalDelayDays = (txTime: string | number) => {
+  const transactionTime = new Date(txTime).getTime();
+  if (transactionTime < LAST_BLAST_SYNCL2_TIME) {
+    return 14;
+  } else {
+    const gap = Math.ceil(14 - (transactionTime - LAST_BLAST_SYNCL2_TIME) / (24 * 3600 * 1000));
+    return gap >= 8 ? gap : 8;
+  }
+};
diff --git a/views/transactions/Withdraw.vue b/views/transactions/Withdraw.vue
@@ -21,7 +21,24 @@
     >
       Confirm transaction
     </PageTitle>
-
+    <div class="tab">
+      <div class="box" :class="{ 'active': showBridge }" @click="showBridge =true">
+        <div class="name">
+          Use the official Bridge
+        </div>
+        <div class="time">
+          Up to 8 days, no additional fee
+        </div>
+      </div>
+      <div class="box" :class="{ 'active': !showBridge }" @click="showBridge =false">
+        <div class="name">
+          Use a third party bridge
+        </div>
+        <div class="time">
+          Usually takes under 20 mins
+        </div>
+      </div>
+    </div>
     <div class="warnBox flex" v-if="!route.query.s || route.query.s !== 'okx'">
       <div>
         Note: All LRT points will continue to be calculated after you request a withdrawal. They will appear in the next
@@ -184,11 +201,12 @@
             class="mb-block-padding-1/2 sm:mb-block-gap"
           >
             <p v-if="withdrawalManualFinalizationRequired">
-              You will be able to claim your withdrawal only after a {{ WITHDRAWAL_DELAY_DAYS }}-day withdrawal delay.
+              You will be able to claim your withdrawal only after a {{ displayEstimateWithdrawalDelayDays }}-day
+              withdrawal delay.
               <!-- <a class="underline underline-offset-2" :href="ZKSYNC_WITHDRAWAL_DELAY" target="_blank">Learn more</a> -->
             </p>
             <p v-else>
-              You will receive funds only after a {{ WITHDRAWAL_DELAY_DAYS }}-day withdrawal delay.
+              You will receive funds only after a {{ displayEstimateWithdrawalDelayDays }}-day withdrawal delay.
               <!-- <a class="underline underline-offset-2" :href="ZKSYNC_WITHDRAWAL_DELAY" target="_blank">Learn more</a> -->
             </p>
           </CommonAlert>
@@ -432,7 +450,7 @@
         </template>
       </form>
     </div>
-    <div class="mt-6 flex flex-col gap-block-gap">
+    <div class="mt-6 flex flex-col gap-block-gap" v-else>
       <CommonCardWithLineButtons v-for="(item, index) in thirdChainMethods" :key="index" class="relative">
         <DestinationItem v-bind="item.props">
           <template #image v-if="item.icon">
@@ -487,26 +505,19 @@ import { useOnboardStore } from "@/store/onboard";
 import { usePreferencesStore } from "@/store/preferences";
 import { useZkSyncProviderStore } from "@/store/zksync/provider";
 import { useZkSyncTokensStore } from "@/store/zksync/tokens";
-import { WITHDRAWAL_DELAY } from "@/store/zksync/transactionStatus";
 import { useZkSyncTransactionStatusStore } from "@/store/zksync/transactionStatus";
 import { useZkSyncTransfersHistoryStore } from "@/store/zksync/transfersHistory";
 import { useZkSyncWalletStore } from "@/store/zksync/wallet";
-import {
-  ETH_TOKEN,
-  isMergeToken,
-  isSupportedMergeToken,
-  MergeTokenContractUrl,
-  WITHDRAWAL_DELAY_DAYS,
-} from "@/utils/constants";
+import { ETH_TOKEN, isMergeToken, isSupportedMergeToken } from "@/utils/constants";
 import { ZKSYNC_WITHDRAWAL_DELAY } from "@/utils/doc-links";
 import { checksumAddress, decimalToBigNumber, formatRawTokenPrice, parseTokenAmount } from "@/utils/formatters";
-import { calculateFee } from "@/utils/helpers";
+import { calculateFee, getEstimateWithdrawalDelayDays } from "@/utils/helpers";
 import { silentRouterChange } from "@/utils/helpers";
 import { TransitionAlertScaleInOutTransition, TransitionOpacity } from "@/utils/transitions";
 import TransferSubmitted from "@/views/transactions/TransferSubmitted.vue";
 import WithdrawalSubmitted from "@/views/transactions/WithdrawalSubmitted.vue";
 import { ETH_ADDRESS } from "~/zksync-web3-nova/src/utils";
-const showBridge = true;
+const showBridge = ref(true);
 const chainList = [
   {
     name: "Meson Finance",
@@ -595,6 +606,8 @@ const fromNetworkSelected = (networkKey?: string) => {
 const step = ref<"form" | "withdrawal-finalization-warning" | "confirm" | "submitted">("form");
 const destination = computed(() => (props.type === "transfer" ? destinations.value.nova : destinations.value.arbitrum));
 
+const displayEstimateWithdrawalDelayDays = getEstimateWithdrawalDelayDays(Date.now());
+
 const availableTokens = computed(() => {
   if (!tokens.value) return [];
   if (props.type === "withdrawal") {
@@ -1071,7 +1084,9 @@ const makeTransaction = async () => {
       info: {
         expectedCompleteTimestamp:
           transaction.value?.type === "withdrawal"
-            ? new Date(new Date().getTime() + WITHDRAWAL_DELAY).toISOString()
+            ? new Date(
+                new Date().getTime() + getEstimateWithdrawalDelayDays(Date.now()) * 24 * 60 * 60 * 1000
+              ).toISOString()
             : undefined,
         completed: false,
       },
@@ -1168,4 +1183,50 @@ onBeforeUnmount(() => {
     color: #0bc48f;
   }
 }
+.tab{
+  width: 100%;
+  border-radius: 64px;
+  background: #262B33;
+  padding: 8px;
+  display: flex;
+  margin-bottom: 16px;
+  .box{
+    border-radius: 64px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 50%;
+    padding: 7px 0;
+    cursor: pointer;
+    .name{
+      color: #FFF;
+      font-size: 16px;
+      font-style: normal;
+      font-weight: 700;
+      line-height: normal;
+    }
+    .time{
+      color: #9DA3AE;
+      text-align: center;
+      font-size: 12px;
+      font-style: normal;
+      font-weight: 400;
+      line-height: normal;
+    }
+    @media screen and (max-width: 600px) {
+      .name{
+        font-size: 12px;
+      }
+      .time{
+        font-size: 10px;
+      }
+    }
+  }
+  .box:focus{
+    background: transparent;
+  }
+  .active{
+    background: #3D424D;
+  }
+}
 </style>
diff --git a/views/transactions/WithdrawalSubmitted.vue b/views/transactions/WithdrawalSubmitted.vue
@@ -11,8 +11,7 @@
         </template>
         <template v-else>
           Your funds will be available on <span class="font-medium">{{ transaction.to.destination.label }}</span> after
-          the {{WITHDRAWAL_DELAY_DAYS}}-day delay.
-          During this time, the transaction will be processed
+          the {{ displayEstimateWithdrawTime }}-day delay. During this time, the transaction will be processed
           {{
             withdrawalManualFinalizationRequired
               ? "and become available for claiming."
@@ -160,7 +159,8 @@ import { useNetworkStore } from "@/store/network";
 import { useOnboardStore } from "@/store/onboard";
 import { useZkSyncProviderStore } from "@/store/zksync/provider";
 import { useZkSyncTransactionStatusStore } from "@/store/zksync/transactionStatus";
-import { WITHDRAWAL_DELAY_DAYS } from '@/utils/constants'
+import { getEstimateWithdrawalDelayDays } from "@/utils/helpers";
+
 const props = defineProps({
   transaction: {
     type: Object as PropType<TransactionInfo>,
@@ -189,8 +189,8 @@ const getNetworkInfo = () => {
     return props.transaction ? newNetwork ?? primaryNetwork : obj;
   } else {
     let objs = zkSyncNetworks.find(
-      (item) => item.key && item.key.toLowerCase() === (props.transaction?.token?.networkKey || 'primary').toLowerCase()
-    )
+      (item) => item.key && item.key.toLowerCase() === (props.transaction?.token?.networkKey || "primary").toLowerCase()
+    );
     const obj = { l1Network: { id: l1Network.value?.id, blockExplorers: { default: { url: l1BlockExplorerUrl } } } };
     return props.transaction ? objs ?? primaryNetwork : obj;
   }
@@ -204,7 +204,7 @@ const { connectorName } = storeToRefs(onboardStore);
 
 const network = computed(() => {
   return onboardStore.network;
-})
+});
 
 const withdrawalManualFinalizationRequired = computed(() => {
   return (
@@ -216,6 +216,10 @@ const withdrawalFinalizationAvailable = computed(() => {
   return withdrawalManualFinalizationRequired.value && props.transaction.info.withdrawalFinalizationAvailable;
 });
 
+const displayEstimateWithdrawTime = computed(() => {
+  return getEstimateWithdrawalDelayDays(props.transaction.timestamp);
+});
+
 const {
   feeToken,
   totalFee: fee,