Feature/remove deprecated networks (#1430)

* remove zKyoto from bridges * remove zKyoto from network selection * remove zKatana code * fix hover styles * restore native bridge * remove zKyoto refs
AstarNetwork · Dec 31, 2024 · 556405d · 556405d
1 parent 9430ca6
commit 556405d
Show file tree

Hide file tree

Showing 8 changed files with 22 additions and 89 deletions.
diff --git a/src/components/assets/EvmNativeToken.vue b/src/components/assets/EvmNativeToken.vue
@@ -121,16 +121,6 @@
           </q-tooltip>
         </a>
 
-        <a v-if="isZkyoto" :href="faucetSethLink" target="_blank" rel="noopener noreferrer">
-          <button class="btn btn--icon">
-            <astar-icon-faucet />
-          </button>
-          <span class="text--mobile-menu">{{ $t('assets.faucet') }}</span>
-          <q-tooltip>
-            <span class="text--tooltip">{{ $t('assets.faucet') }}</span>
-          </q-tooltip>
-        </a>
-
         <div v-else-if="isFaucet">
           <button class="btn btn--icon" @click="handleModalFaucet({ isOpen: true })">
             <astar-icon-faucet />
@@ -152,21 +142,21 @@ import { ethers } from 'ethers';
 import { $web3 } from 'src/boot/api';
 import { cbridgeAppLink } from 'src/c-bridge';
 import ModalFaucet from 'src/components/assets/modals/ModalFaucet.vue';
+import Balloon from 'src/components/common/Balloon.vue';
+import { LOCAL_STORAGE } from 'src/config/localStorage';
+import { ccipMinatoBridgeEnabled, layerZeroBridgeEnabled, nativeBridgeEnabled } from 'src/features';
 import { useAccount, useBreakpoints, useFaucet, useNetworkInfo } from 'src/hooks';
 import { faucetSethLink } from 'src/links';
 import { getTokenImage } from 'src/modules/token';
 import {
+  buildCcipBridgePageLink,
   buildEthereumBridgePageLink,
-  buildTransferPageLink,
   buildLzBridgePageLink,
-  buildCcipBridgePageLink,
+  buildTransferPageLink,
 } from 'src/router/routes';
 import { useStore } from 'src/store';
 import { computed, defineComponent, ref, watch, watchEffect } from 'vue';
-import { nativeBridgeEnabled, layerZeroBridgeEnabled, ccipMinatoBridgeEnabled } from 'src/features';
 import CustomRouterLink from '../common/CustomRouterLink.vue';
-import Balloon from 'src/components/common/Balloon.vue';
-import { LOCAL_STORAGE } from 'src/config/localStorage';
 
 export default defineComponent({
   components: { ModalFaucet, CustomRouterLink, Balloon },
@@ -188,7 +178,7 @@ export default defineComponent({
     const isCcipBalloon = ref<boolean>(false);
     const isBalloonClosing = ref<boolean>(false);
 
-    const { currentNetworkName, nativeTokenSymbol, isZkEvm, isZkyoto, isAstar, isShibuyaEvm } =
+    const { currentNetworkName, nativeTokenSymbol, isZkEvm, isAstar, isShibuyaEvm } =
       useNetworkInfo();
 
     const closeCcipBalloon = () => {
@@ -263,7 +253,6 @@ export default defineComponent({
       isFaucet,
       isModalFaucet,
       isZkEvm,
-      isZkyoto,
       faucetSethLink,
       width,
       screenSize,

diff --git a/src/components/bridge/BridgeSelection.vue b/src/components/bridge/BridgeSelection.vue
@@ -40,6 +40,7 @@
             {{ $t('bridge.ccipMinatoBridge.remark') }}
           </p>
         </div>
+
         <div class="column--selection">
           <button :disabled="!isEnableEthBridge">
             <component
@@ -117,39 +118,6 @@
             {{ $t('bridge.bridgeMaintenanceMode') }}
           </p>
         </div>
-        <div v-if="isZkyoto" class="column--selection">
-          <button :disabled="!isEnableEthBridge">
-            <a
-              :href="zKatanaBridgeUrl"
-              target="_blank"
-              rel="noopener noreferrer"
-              class="button--bridge"
-            >
-              <div class="row--logo-bg">
-                <div class="img--logo-bg">
-                  <img
-                    class="img--logo"
-                    :src="require('src/assets/img/ethereum.png')"
-                    alt="ethereum"
-                  />
-                </div>
-              </div>
-              <div class="row--bridge-title">
-                <div class="text--bridge-tag">
-                  <q-chip outline>
-                    {{ $t('bridge.zKatanaBridge.tag') }}
-                  </q-chip>
-                </div>
-                <span class="text--bridge-title">{{ $t('bridge.zKatanaBridge.title') }}</span>
-                <div class="box--text-bridge">
-                  <span class="text--bridge">
-                    {{ $t('bridge.zKatanaBridge.text') }}
-                  </span>
-                </div>
-              </div>
-            </a>
-          </button>
-        </div>
       </div>
       <div class="container--selection">
         <div class="column--selection">
@@ -225,24 +193,24 @@
 </template>
 <script lang="ts">
 import { cbridgeAppLink } from 'src/c-bridge';
+import {
+  ccipMinatoBridgeEnabled,
+  celerBridgeEnabled,
+  layerSwapBridgeEnabled,
+  layerZeroBridgeEnabled,
+  nativeBridgeEnabled,
+} from 'src/features';
 import { useAccount, useNetworkInfo } from 'src/hooks';
 import { EthBridgeNetworkName } from 'src/modules/zk-evm-bridge';
+import { layerSwapLink, zKatanaBridgeUrl } from 'src/modules/zk-evm-bridge/index';
 import {
   Path as RoutePath,
+  buildCcipBridgePageLink,
   buildEthereumBridgePageLink,
   buildLzBridgePageLink,
-  buildCcipBridgePageLink,
 } from 'src/router/routes';
-import { computed, defineComponent } from 'vue';
-import { layerSwapLink, zKatanaBridgeUrl } from 'src/modules/zk-evm-bridge/index';
-import {
-  celerBridgeEnabled,
-  layerSwapBridgeEnabled,
-  nativeBridgeEnabled,
-  layerZeroBridgeEnabled,
-  ccipMinatoBridgeEnabled,
-} from 'src/features';
 import { navigateInNewTab } from 'src/util-general';
+import { computed, defineComponent } from 'vue';
 
 export default defineComponent({
   components: {},
@@ -252,19 +220,18 @@ export default defineComponent({
       isZkEvm,
       networkNameSubstrate,
       isMainnet,
-      isZkyoto,
       isAstarZkEvm,
       isAstar,
       isH160,
       isShibuyaEvm,
     } = useNetworkInfo();
 
     const l1Name = computed<string>(() => {
-      return isZkyoto.value ? EthBridgeNetworkName.Sepolia : EthBridgeNetworkName.Ethereum;
+      return EthBridgeNetworkName.Ethereum;
     });
 
     const l2Name = computed<string>(() => {
-      return isZkyoto.value ? EthBridgeNetworkName.Zkyoto : EthBridgeNetworkName.AstarZk;
+      return EthBridgeNetworkName.AstarZk;
     });
 
     const cbridgeNetworkName = computed<string>(() => {
@@ -292,7 +259,6 @@ export default defineComponent({
       cbridgeNetworkName,
       layerSwapLink,
       zKatanaBridgeUrl,
-      isZkyoto,
       isEnableLzBridge,
       celerBridgeEnabled,
       layerSwapBridgeEnabled,

diff --git a/src/components/bridge/styles/bridge-selection.scss b/src/components/bridge/styles/bridge-selection.scss
@@ -78,7 +78,7 @@
   width: 100%;
 }
 
-.column--selection button:not([disabled]) .button--bridge:hover {
+.column--selection :is(button, a):not([disabled]).button--bridge:hover {
   border: 1px solid $astar-blue !important;
   transition: all 0.3s ease 0s;
 }
@@ -206,11 +206,6 @@
     }
   }
 
-  .column--selection button:not([disabled]) .button--bridge:hover {
-    border: 1px solid $astar-blue !important;
-    transition: all 0.3s ease 0s;
-  }
-
   .img--logo-bg {
     background-color: $navy-3;
   }

diff --git a/src/components/header/mobile/MobileNav.vue b/src/components/header/mobile/MobileNav.vue
@@ -114,7 +114,6 @@ export default defineComponent({
     const showNav = ref<boolean>(false);
     const router = useRouter();
     const path = computed(() => router.currentRoute.value.path.split('/')[2]);
-    const { isZkyoto } = useNetworkInfo();
     const { isGovernanceEnabled, governanceUrl } = useGovernance();
 
     const store = useStore();
@@ -128,7 +127,6 @@ export default defineComponent({
       path,
       RoutePath,
       network,
-      isZkyoto,
       surgeUrl,
       socialUrl,
       isGovernanceEnabled,

diff --git a/src/components/header/modals/SelectNetwork.vue b/src/components/header/modals/SelectNetwork.vue
@@ -57,18 +57,6 @@
           />
           <span class="text--network">{{ $t('drawer.astarTestnet') }}</span>
         </button>
-        <button
-          class="row--network box--hover--active"
-          :class="selNetworkId === endpointKey.ZKYOTO && 'border--active'"
-          @click="setSelNetwork(endpointKey.ZKYOTO)"
-        >
-          <img
-            class="img--network-logo"
-            :src="require('src/assets/img/chain/astar-zkevm-logo-white.svg')"
-            alt="logo-zkatana"
-          />
-          <span class="text--network">{{ $t('drawer.zkTestnet') }}</span>
-        </button>
       </div>
       <div v-if="!isZkEvm" class="container--advanced">
         <div class="row--title-advanced">

diff --git a/src/components/header/styles/modal-network-wallet.scss b/src/components/header/styles/modal-network-wallet.scss
@@ -118,7 +118,7 @@
   display: flex;
   column-gap: 8px;
   display: grid;
-  grid-template-columns: 1fr 1fr;
+  grid-template-columns: 1fr;
   width: 100%;
   margin-bottom: 20px;
 }

diff --git a/src/components/sidenav/SidebarDesktop.vue b/src/components/sidenav/SidebarDesktop.vue
@@ -125,7 +125,7 @@ export default defineComponent({
   },
   setup() {
     const { isOpen } = useSidebar();
-    const { isZkEvm, isZkyoto } = useNetworkInfo();
+    const { isZkEvm } = useNetworkInfo();
     const { isGovernanceEnabled, governanceUrl } = useGovernance();
 
     const store = useStore();
@@ -162,7 +162,6 @@ export default defineComponent({
       path,
       RoutePath,
       socialUrl,
-      isZkyoto,
       surgeUrl,
       isGovernanceEnabled,
       governanceUrl,

diff --git a/src/hooks/useNetworkInfo.ts b/src/hooks/useNetworkInfo.ts
@@ -31,7 +31,6 @@ export function useNetworkInfo() {
       currentNetworkIdx.value === endpointKey.ASTAR_ZKEVM
   );
 
-  const isZkyoto = computed<boolean>(() => currentNetworkIdx.value === endpointKey.ZKYOTO);
   const isAstarZkEvm = computed<boolean>(() => currentNetworkIdx.value === endpointKey.ASTAR_ZKEVM);
   const isAstar = computed<boolean>(() => currentNetworkIdx.value === endpointKey.ASTAR);
   const isShibuya = computed<boolean>(() => currentNetworkIdx.value === endpointKey.SHIBUYA);
@@ -127,7 +126,6 @@ export function useNetworkInfo() {
     polkadotJsLink,
     isZkEvm,
     networkNameSubstrate,
-    isZkyoto,
     isAstarZkEvm,
     isAstar,
     dappStakingCurrency,