Skip to content

Commit

Permalink
feat: deprecate warning for goerli (#126)
Browse files Browse the repository at this point in the history
# What ❔

Deprecate warning for Goerli network:
<img width="1279" alt="image"
src="https://github.com/matter-labs/block-explorer/assets/6553665/6f1e0117-3561-4d85-a2a4-dd8fc53b695a">


## Why ❔

To warn users that we are ending support of Goerli testnet.

## Checklist

<!-- Check your PR fulfills the following items. -->
<!-- For draft PRs check the boxes as you complete them. -->

- [X] PR title corresponds to the body of PR (we generate changelog
entries from PRs).
  • Loading branch information
vasyl-ivanchuk authored and pcheremu committed Feb 15, 2024
1 parent cdef776 commit 0aeb85f
Show file tree
Hide file tree
Showing 2 changed files with 24 additions and 9 deletions.
2 changes: 0 additions & 2 deletions packages/app/src/App.vue
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@
<the-header :class="$route?.name" />
<div class="container-app">
<NetworkDeprecated v-if="!currentNetwork.maintenance && currentNetwork.name === 'goerli'" />
<IndexerDelayAlert v-if="!currentNetwork.maintenance && currentNetwork.name === 'mainnet'" />
<MaintenanceView v-if="currentNetwork.maintenance" />
<router-view v-else />
</div>
Expand All @@ -14,7 +13,6 @@
<script setup lang="ts">
import { useTitle } from "@vueuse/core";
import IndexerDelayAlert from "@/components/IndexerDelayAlert.vue";
import NetworkDeprecated from "@/components/NetworkDeprecated.vue";
import TheFooter from "@/components/TheFooter.vue";
import TheHeader from "@/components/header/TheHeader.vue";
Expand Down
31 changes: 24 additions & 7 deletions packages/app/src/components/NetworkDeprecated.vue
Original file line number Diff line number Diff line change
@@ -1,23 +1,31 @@
<template v-if="newNetworkUrl">
<SystemAlert>
<div class="deprecated-alert">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path
d="M21.0907 18.7005C20.8457 19.1905 20.3449 19.5 19.7971 19.5H4.20288C3.65506 19.5 3.15426 19.1905 2.90927 18.7005C2.69455 18.2711 2.70694 17.7631 2.94232 17.3446L10.9455 3.11671C11.1598 2.73575 11.5629 2.5 12 2.5C12.4371 2.5 12.8402 2.73575 13.0545 3.11671L21.0577 17.3446C21.2931 17.7631 21.3054 18.2711 21.0907 18.7005Z"
stroke="#FFC81A"
/>
<circle cx="12" cy="16" r="1" fill="#FFC81A" />
<path d="M12 14V6" stroke="#FFC81A" />
</svg>
<span
>We are ending our support of Goerli testnet. Please <a :href="newNetworkUrl!">use Sepolia</a>. For more info see
<a target="_blank" href="https://github.com/zkSync-Community-Hub/zksync-developers/discussions/228"
<a target="_blank" href="https://github.com/zkSync-Community-Hub/zkync-developers/discussions/228"
>this announcement</a
>.</span
>
</SystemAlert>
</div>
</template>

<script lang="ts" setup>
import { computed } from "vue";
import SystemAlert from "@/components/common/SystemAlert.vue";
import { useRoute } from "vue-router";
import useContext from "@/composables/useContext";
import { getWindowLocation } from "@/utils/helpers";
const route = useRoute();
const { networks } = useContext();
const newNetworkUrl = computed(() => {
Expand All @@ -26,6 +34,7 @@ const newNetworkUrl = computed(() => {
const { hostname, origin } = getWindowLocation();
if (hostname === "localhost" || hostname.endsWith("web.app") || !network.hostnames?.length) {
console.log(route);
return `${origin}?network=${network.name}`;
}
return network.hostnames[0];
Expand All @@ -35,7 +44,15 @@ const newNetworkUrl = computed(() => {
</script>

<style scoped lang="scss">
a {
@apply text-inherit;
.deprecated-alert {
@apply flex text-white rounded-2xl border border-amber-400/50 bg-amber-400/10 mb-6 py-3 px-4;
svg {
@apply mr-2;
}
a {
@apply text-inherit;
}
}
</style>

0 comments on commit 0aeb85f

Please sign in to comment.