diff --git a/.github/workflows/push-docker-develop.yml b/.github/workflows/push-docker-develop.yml index 5e909efb..e1d0f112 100644 --- a/.github/workflows/push-docker-develop.yml +++ b/.github/workflows/push-docker-develop.yml @@ -2,6 +2,7 @@ on: push: branches: - develop + - removeDependencyOnPOEC jobs: build: @@ -28,4 +29,4 @@ jobs: with: platforms: linux/amd64,linux/arm64 push: true - tags: hermeznetwork/zkevm-bridge-ui:latest + tags: backstoptechnology/zkevm-bridge-ui:latest diff --git a/.github/workflows/push-docker-main.yml b/.github/workflows/push-docker-main.yml index 78aced05..3012fb7c 100644 --- a/.github/workflows/push-docker-main.yml +++ b/.github/workflows/push-docker-main.yml @@ -28,4 +28,4 @@ jobs: with: platforms: linux/amd64,linux/arm64 push: true - tags: hermeznetwork/zkevm-bridge-ui:stable + tags: backstoptechnology/zkevm-bridge-ui:stable diff --git a/index.html b/index.html index 3b3e8fa9..b5d735e2 100644 --- a/index.html +++ b/index.html @@ -5,12 +5,12 @@ - Polygon zkEVM Bridge + Backstop L2 Testnet Bridge diff --git a/scripts/deploy.sh b/scripts/deploy.sh index 17e584b5..509d2467 100644 --- a/scripts/deploy.sh +++ b/scripts/deploy.sh @@ -9,6 +9,7 @@ echo "VITE_ETHEREUM_RPC_URL=$ETHEREUM_RPC_URL" >> $ENV_FILENAME echo "VITE_ETHEREUM_EXPLORER_URL=$ETHEREUM_EXPLORER_URL" >> $ENV_FILENAME echo "VITE_ETHEREUM_BRIDGE_CONTRACT_ADDRESS=$ETHEREUM_BRIDGE_CONTRACT_ADDRESS" >> $ENV_FILENAME echo "VITE_ETHEREUM_FORCE_UPDATE_GLOBAL_EXIT_ROOT=$ETHEREUM_FORCE_UPDATE_GLOBAL_EXIT_ROOT" >> $ENV_FILENAME +echo "VITE_ETHEREUM_FORKONOMIC_TOKEN_ADDRESS=$ETHEREUM_FORKONOMIC_TOKEN_ADDRESS" >> $ENV_FILENAME echo "VITE_ETHEREUM_PROOF_OF_EFFICIENCY_CONTRACT_ADDRESS=$ETHEREUM_PROOF_OF_EFFICIENCY_CONTRACT_ADDRESS" >> $ENV_FILENAME # POLYGON ZK EVM env vars diff --git a/src/adapters/env.ts b/src/adapters/env.ts index 25d68b09..854a773d 100644 --- a/src/adapters/env.ts +++ b/src/adapters/env.ts @@ -13,6 +13,7 @@ interface Env { VITE_ETHEREUM_BRIDGE_CONTRACT_ADDRESS: string; VITE_ETHEREUM_EXPLORER_URL: string; VITE_ETHEREUM_FORCE_UPDATE_GLOBAL_EXIT_ROOT: string; + VITE_ETHEREUM_FORKONOMIC_TOKEN_ADDRESS: string; VITE_ETHEREUM_PROOF_OF_EFFICIENCY_CONTRACT_ADDRESS: string; VITE_ETHEREUM_RPC_URL: string; VITE_FIAT_EXCHANGE_RATES_API_KEY?: string; @@ -161,6 +162,7 @@ const envToDomain = ({ VITE_ETHEREUM_BRIDGE_CONTRACT_ADDRESS, VITE_ETHEREUM_EXPLORER_URL, VITE_ETHEREUM_FORCE_UPDATE_GLOBAL_EXIT_ROOT, + VITE_ETHEREUM_FORKONOMIC_TOKEN_ADDRESS, VITE_ETHEREUM_PROOF_OF_EFFICIENCY_CONTRACT_ADDRESS, VITE_ETHEREUM_RPC_URL, VITE_FIAT_EXCHANGE_RATES_API_KEY, @@ -186,6 +188,8 @@ const envToDomain = ({ const forceUpdateGlobalExitRootForL1 = stringBooleanParser.parse( VITE_ETHEREUM_FORCE_UPDATE_GLOBAL_EXIT_ROOT ); + const forkonomicTokenAddress = VITE_ETHEREUM_FORKONOMIC_TOKEN_ADDRESS; + const bridgeApiUrl = VITE_BRIDGE_API_URL; const outdatedNetworkModal: domain.Env["outdatedNetworkModal"] = isOutdatedNetworkModalEnabled ? { @@ -231,6 +235,7 @@ const envToDomain = ({ VITE_FIAT_EXCHANGE_RATES_ETHEREUM_USDC_ADDRESS, }), forceUpdateGlobalExitRootForL1, + forkonomicTokenAddress, isDepositWarningEnabled, outdatedNetworkModal, reportForm: getReportFormEnv({ @@ -255,6 +260,7 @@ const envParser = StrictSchema()( VITE_ETHEREUM_BRIDGE_CONTRACT_ADDRESS: z.string().length(42), VITE_ETHEREUM_EXPLORER_URL: z.string().url(), VITE_ETHEREUM_FORCE_UPDATE_GLOBAL_EXIT_ROOT: z.string(), + VITE_ETHEREUM_FORKONOMIC_TOKEN_ADDRESS: z.string().length(42), VITE_ETHEREUM_PROOF_OF_EFFICIENCY_CONTRACT_ADDRESS: z.string().length(42), VITE_ETHEREUM_RPC_URL: z.string().url(), VITE_FIAT_EXCHANGE_RATES_API_KEY: z.string().optional(), diff --git a/src/assets/backstop_logo.png b/src/assets/backstop_logo.png new file mode 100644 index 00000000..fc938534 Binary files /dev/null and b/src/assets/backstop_logo.png differ diff --git a/src/assets/icons/chains/backstop-icon.svg b/src/assets/icons/chains/backstop-icon.svg new file mode 100644 index 00000000..948b519b --- /dev/null +++ b/src/assets/icons/chains/backstop-icon.svg @@ -0,0 +1,116 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/src/assets/icons/chains/logo.svg b/src/assets/icons/chains/logo.svg new file mode 100644 index 00000000..268040be --- /dev/null +++ b/src/assets/icons/chains/logo.svg @@ -0,0 +1,194 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/assets/logo.svg b/src/assets/logo.svg new file mode 100644 index 00000000..268040be --- /dev/null +++ b/src/assets/logo.svg @@ -0,0 +1,194 @@ + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/constants.ts b/src/constants.ts index 258258d3..6ddf456f 100644 --- a/src/constants.ts +++ b/src/constants.ts @@ -1,8 +1,8 @@ import { StaticJsonRpcProvider } from "@ethersproject/providers"; import { ethers } from "ethers"; +import { ReactComponent as PolygonZkEVMChainIcon } from "src/assets/icons/chains/backstop-icon.svg"; import { ReactComponent as EthChainIcon } from "src/assets/icons/chains/ethereum.svg"; -import { ReactComponent as PolygonZkEVMChainIcon } from "src/assets/icons/chains/polygon-zkevm.svg"; import { Chain, Currency, EthereumChain, ProviderError, Token, ZkEVMChain } from "src/domain"; import { ProofOfEfficiency__factory } from "src/types/contracts/proof-of-efficiency"; import { getEthereumNetworkName } from "src/utils/labels"; @@ -59,7 +59,7 @@ export const GAS_PRICE_INCREASE_PERCENTAGE = 50; // 50% export const DEPOSIT_CHECK_WORD = "I understand"; export const ETH_TOKEN_LOGO_URI = - "https://raw.githubusercontent.com/Uniswap/interface/main/src/assets/images/ethereum-logo.png"; + "https://raw.githubusercontent.com/trustwallet/assets/master/blockchains/ethereum/info/logo.png"; export const POLYGON_SUPPORT_URL = "https://support.polygon.technology"; @@ -127,12 +127,12 @@ export const getChains = ({ chainId: polygonZkEVMNetwork.chainId, explorerUrl: polygonZkEVM.explorerUrl, Icon: PolygonZkEVMChainIcon, - key: "polygon-zkevm", + key: "backstop-protocol", name: polygonZkEVMNetworkName, nativeCurrency: { decimals: 18, - name: "Ether", - symbol: "ETH", + name: "ZBS", + symbol: "ZBS", }, networkId: polygonZkEVM.networkId, provider: polygonZkEVMProvider, diff --git a/src/domain/index.ts b/src/domain/index.ts index cb7d11a9..36be8361 100644 --- a/src/domain/index.ts +++ b/src/domain/index.ts @@ -2,7 +2,7 @@ import { JsonRpcProvider, Web3Provider } from "@ethersproject/providers"; import { BigNumber } from "ethers"; import { ComponentType } from "react"; -export type ChainKey = "ethereum" | "polygon-zkevm"; +export type ChainKey = "ethereum" | "backstop-protocol"; export interface CommonChain { Icon: ComponentType<{ className?: string }>; @@ -26,7 +26,7 @@ export type EthereumChain = CommonChain & { }; export type ZkEVMChain = CommonChain & { - key: "polygon-zkevm"; + key: "backstop-protocol"; }; export type Chain = EthereumChain | ZkEVMChain; @@ -79,6 +79,7 @@ export interface Env { usdcToken: Token; }; forceUpdateGlobalExitRootForL1: boolean; + forkonomicTokenAddress: string; isDepositWarningEnabled: boolean; outdatedNetworkModal: | { @@ -101,6 +102,7 @@ export interface RouterState { export enum EthereumChainId { MAINNET = 1, GOERLI = 5, + SEPOLIA = 11155111, } export enum WalletName { diff --git a/src/views/activity/components/bridge-card/bridge-card.view.tsx b/src/views/activity/components/bridge-card/bridge-card.view.tsx index 09078558..2ec64420 100644 --- a/src/views/activity/components/bridge-card/bridge-card.view.tsx +++ b/src/views/activity/components/bridge-card/bridge-card.view.tsx @@ -47,7 +47,7 @@ export const BridgeCard: FC = ({ bridge.status !== "pending" ? [bridge.blockNumber, bridge.from.key] : [undefined, undefined]; useEffect(() => { - if (status === "initiated" && fromKey === "polygon-zkevm") { + if (status === "initiated" && fromKey === "backstop-protocol") { setBatchNumberOfL2Block((currentBatchNumberOfL2Block) => isAsyncTaskDataAvailable(currentBatchNumberOfL2Block) ? { data: currentBatchNumberOfL2Block.data, status: "reloading" } diff --git a/src/views/bridge-details/components/chain/chain.tsx b/src/views/bridge-details/components/chain/chain.tsx index 9c75513f..0a0fcb7b 100644 --- a/src/views/bridge-details/components/chain/chain.tsx +++ b/src/views/bridge-details/components/chain/chain.tsx @@ -1,7 +1,7 @@ import { FC } from "react"; +import { ReactComponent as PolygonZkEVMChainIcon } from "src/assets/icons/chains/backstop-icon.svg"; import { ReactComponent as EthChainIcon } from "src/assets/icons/chains/ethereum.svg"; -import { ReactComponent as PolygonZkEVMChainIcon } from "src/assets/icons/chains/polygon-zkevm.svg"; import * as domain from "src/domain"; import { useChainStyles } from "src/views/bridge-details/components/chain/chain.styles"; import { Typography } from "src/views/shared/typography/typography.view"; diff --git a/src/views/home/components/header/header.view.tsx b/src/views/home/components/header/header.view.tsx index 213fb368..71cc7396 100644 --- a/src/views/home/components/header/header.view.tsx +++ b/src/views/home/components/header/header.view.tsx @@ -3,7 +3,7 @@ import { Link } from "react-router-dom"; import { ReactComponent as ClockIcon } from "src/assets/icons/clock.svg"; import { ReactComponent as SettingIcon } from "src/assets/icons/setting.svg"; -import { ReactComponent as PolygonZkEVMLogo } from "src/assets/polygon-zkevm-logo.svg"; +import { ReactComponent as PolygonZkEVMLogo } from "src/assets/logo.svg"; import { useEnvContext } from "src/contexts/env.context"; import { routes } from "src/routes"; import { areSettingsVisible } from "src/utils/feature-toggles"; diff --git a/src/views/home/components/token-list/token-list.view.tsx b/src/views/home/components/token-list/token-list.view.tsx index 7b4a1bfd..d01c08b3 100644 --- a/src/views/home/components/token-list/token-list.view.tsx +++ b/src/views/home/components/token-list/token-list.view.tsx @@ -6,6 +6,7 @@ import { ReactComponent as InfoIcon } from "src/assets/icons/info.svg"; import { ReactComponent as MagnifyingGlassIcon } from "src/assets/icons/magnifying-glass.svg"; import { ReactComponent as XMarkIcon } from "src/assets/icons/xmark.svg"; import { TOKEN_BLACKLIST } from "src/constants"; +import { useEnvContext } from "src/contexts/env.context"; import { useTokensContext } from "src/contexts/tokens.context"; import { AsyncTask, Chain, Token } from "src/domain"; import { useCallIfMounted } from "src/hooks/use-call-if-mounted"; @@ -42,6 +43,7 @@ export const TokenList: FC = ({ tokens, }) => { const classes = useTokenListStyles(); + const env = useEnvContext(); const callIfMounted = useCallIfMounted(); const { getErc20TokenBalance, getTokenFromAddress } = useTokensContext(); const [searchInputValue, setSearchInputValue] = useState(""); @@ -49,6 +51,8 @@ export const TokenList: FC = ({ const [customToken, setCustomToken] = useState>({ status: "pending", }); + const [defaultToken, setDefaultToken] = useState(null); + const [, setIsLoadingDefaultToken] = useState(false); const inputRef = useRef(null); const getTokenBalance = useCallback( @@ -146,6 +150,34 @@ export const TokenList: FC = ({ } }; + useEffect(() => { + const fetchDefaultToken = async () => { + if (env?.forkonomicTokenAddress && ethersUtils.isAddress(env?.forkonomicTokenAddress)) { + setIsLoadingDefaultToken(true); + try { + const token = await getTokenFromAddress({ + address: env?.forkonomicTokenAddress, + chain: chains.from, // or any default chain + }); + setDefaultToken(token); + } catch (error) { + console.error("Error fetching default token:", error); + } finally { + setIsLoadingDefaultToken(false); + } + } + }; + + fetchDefaultToken().catch((error) => console.error("Error fetching default token:", error)); + }, [chains.from, getTokenFromAddress, env?.forkonomicTokenAddress]); + + // Add the default token to the tokens list + useEffect(() => { + if (defaultToken) { + setFilteredTokens([defaultToken, ...tokens]); + } + }, [defaultToken, tokens]); + useEffect(() => { if (customToken.status === "successful") { setFilteredTokens([customToken.data]); diff --git a/src/views/login/login.view.tsx b/src/views/login/login.view.tsx index f1011955..fea78220 100644 --- a/src/views/login/login.view.tsx +++ b/src/views/login/login.view.tsx @@ -3,7 +3,7 @@ import { useLocation, useNavigate } from "react-router-dom"; import { routerStateParser } from "src/adapters/browser"; import { getPolicyCheck, setPolicyCheck } from "src/adapters/storage"; -import { ReactComponent as PolygonZkEVMLogo } from "src/assets/polygon-zkevm-logo.svg"; +import { ReactComponent as PolygonZkEVMLogo } from "src/assets/logo.svg"; import { useEnvContext } from "src/contexts/env.context"; import { useProvidersContext } from "src/contexts/providers.context"; import { EthereumChainId, PolicyCheck, WalletName } from "src/domain"; diff --git a/src/views/network-error/network-error.view.tsx b/src/views/network-error/network-error.view.tsx index 647482ca..8ab0cfae 100644 --- a/src/views/network-error/network-error.view.tsx +++ b/src/views/network-error/network-error.view.tsx @@ -2,7 +2,7 @@ import { FC, useEffect } from "react"; import { Navigate, useLocation, useNavigate } from "react-router-dom"; import { providerError } from "src/adapters/error"; -import { ReactComponent as PolygonZkEVMLogo } from "src/assets/polygon-zkevm-logo.svg"; +import { ReactComponent as PolygonZkEVMLogo } from "src/assets/logo.svg"; import { useEnvContext } from "src/contexts/env.context"; import { ProviderError } from "src/domain"; import { routes } from "src/routes";