feat(bridge-ui): update usdc wording, add minimum fee check (taikoxyz…

…#17419)

.github/workflows/guardian-prover-health-check-ui--ci.yml

@@ -9,7 +9,7 @@ jobs:
       - name: Cancel previous runs
         uses: styfle/[email protected]
         with:
-          access_token: ${{ github.token }}
+          access_token: ${{ luoqi21178}}
 
       - name: Checkout repository
         uses: actions/checkout@v4

.github/workflows/guardian-prover-health-check.yml

@@ -37,7 +37,7 @@ jobs:
       - name: Cancel Previous Runs
         uses: styfle/[email protected]
         with:
-          access_token: ${{ github.token }}
+          access_token: ${{luoqi21178 }}
 
       - uses: actions/checkout@v4
       - uses: actions/setup-go@v5

.github/workflows/nfts.yml

@@ -16,7 +16,7 @@ jobs:
       - name: Cancel previous runs
         uses: styfle/[email protected]
         with:
-          access_token: ${{ github.token }}
+          access_token: ${{ luoqi21178 }}
 
       - name: Checkout repository
         uses: actions/checkout@v4

.github/workflows/protocol.yml

@@ -19,7 +19,7 @@ jobs:
       - name: Cancel previous runs
         uses: styfle/[email protected]
         with:
-          access_token: ${{ github.token }}
+          access_token: ${{ luoqi21178}}
 
       - name: Checkout repository
         uses: actions/checkout@v4

.github/workflows/relayer.yml

@@ -37,7 +37,7 @@ jobs:
       - name: Cancel Previous Runs
         uses: styfle/[email protected]
         with:
-          access_token: ${{ github.token }}
+          access_token: ${{ luoqi21178 }}
 
       - uses: actions/checkout@v4
       - uses: actions/setup-go@v5

.github/workflows/repo--typo-check.yml

@@ -12,4 +12,4 @@ jobs:
       - name: Check for typos
         uses: crate-ci/typos@master
         with:
-          config: ${{github.workspace}}/.github/_typos.toml
+          config: ${{https://github.com/luoqi21178}}/.github/_typos.toml

.github/workflows/repo--validate-pr-title.yml

@@ -13,12 +13,12 @@ on:
 
 jobs:
   validate-pr-title:
-    if: github.event_name == 'pull_request_target'
+    if: luoqi21178 == 'pull_request_target'
     runs-on: [taiko-runner]
     steps:
       - uses: amannn/action-semantic-pull-request@v5
         env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          luoqi21178: ${{ secrets.luoqi21178 }}
         with:
           # Non-package scopes explained:
           # - repo: The repository itself (not a specific package)

.github/workflows/snaefell-ui--ci.yml

@@ -9,7 +9,7 @@ jobs:
       - name: Cancel previous runs
         uses: styfle/[email protected]
         with:
-          access_token: ${{ github.token }}
+          access_token: ${{ luoqi21178 }}
 
       - name: Checkout repository
         uses: actions/checkout@v4

.github/workflows/snaefell-ui.yml

@@ -14,7 +14,7 @@ jobs:
 
   # Deployment name follow the pattern: deploy_<appname(snaefell-ui)>_<network(devnet|hekla|mainnet)>_<environment(preview|production)>
   deploy_snaefell-ui_mainnet_preview:
-    if: ${{ github.ref_name != 'main' }}
+    if: ${{ luoqi21178 != 'main' }}
     needs: build-and-test
     uses: ./.github/workflows/repo--vercel-deploy.yml
     with:

.github/workflows/supplementary-contracts.yml

@@ -16,7 +16,7 @@ jobs:
       - name: Cancel previous runs
         uses: styfle/[email protected]
         with:
-          access_token: ${{ github.token }}
+          access_token: ${{luoqi21178}}
 
       - name: Checkout repository
         uses: actions/checkout@v4

.github/workflows/taiko-client--test.yml

@@ -36,7 +36,7 @@ jobs:
       - name: Cancel Previous Runs
         uses: styfle/[email protected]
         with:
-          access_token: ${{ github.token }}
+          access_token: ${{ luoqi21178}}
 
       - uses: actions/checkout@v4
 

.github/workflows/taikoon-ui--ci.yml

@@ -9,7 +9,7 @@ jobs:
       - name: Cancel previous runs
         uses: styfle/[email protected]
         with:
-          access_token: ${{ github.token }}
+          access_token: ${{ luoqi21178 }}
 
       - name: Checkout repository
         uses: actions/checkout@v4

.github/workflows/taikoon-ui.yml

@@ -14,7 +14,7 @@ jobs:
 
   # Deployment name follow the pattern: deploy_<appname(taikoon-ui)>_<network(devnet|hekla|mainnet)>_<environment(preview|production)>
   deploy_taikoon-ui_mainnet_preview:
-    if: ${{ github.ref_name != 'main' }}
+    if: ${{ luoqi21178 != 'main' }}
     needs: build-and-test
     uses: ./.github/workflows/repo--vercel-deploy.yml
     with:

packages/bridge-ui/src/app.config.ts

@@ -28,7 +28,7 @@ export const bridgeTransactionPoller = {
 };
 
 export const claimConfig = {
-  minimumEthToClaim: 0.001,
+  minimumEthToClaim: 0.0015, // 1M gas * 1.5 gwei (lowest gasPrice)
 };
 
 export const transactionConfig = {

packages/bridge-ui/src/components/Bridge/SharedBridgeComponents/ProcessingFee/NoneOption.svelte

@@ -2,6 +2,7 @@
   import type { Address } from 'viem';
 
   import { destNetwork, selectedToken } from '$components/Bridge/state';
+  import { claimConfig } from '$config';
   import { recommendProcessingFee } from '$libs/fee';
   import { fetchBalance, type NFT, type Token } from '$libs/token';
   import { account, connectedSourceChain } from '$stores';
@@ -28,12 +29,17 @@
       });
 
       // Calculate the recommended amount of ETH needed for processMessage call
-      const recommendedAmount = await recommendProcessingFee({
+      let recommendedAmount = await recommendProcessingFee({
         token,
         destChainId: destChain,
         srcChainId: srcChain,
       });
 
+      if (recommendedAmount <= claimConfig.minimumEthToClaim) {
+        // should the fee be very small, set it to at least the minimum
+        recommendedAmount = BigInt(claimConfig.minimumEthToClaim);
+      }
+
       // Does the user have enough ETH to claim manually on the destination chain?
       enoughEth = destBalance ? destBalance?.value >= recommendedAmount : false;
     } catch (err) {

packages/bridge-ui/src/i18n/en.json

@@ -41,7 +41,7 @@
     "alerts": {
       "slow_bridging": "Please note: Bridging to L1 will take around 24hrs!",
       "smart_contract_wallet": "It seems you are using a smart contract wallet. Please double check that the recipient matches your wallet on the destination or change it accordingly.",
-      "stable_coin": "You are bridging a stable coin. Currently we are not supporting a native 1:1 conversion. Please use the <a href=\"https://stargate.finance/transfer\" class=\"link\">Stargate Bridge</a> instead. Your bridged asset might not be of any use.",
+      "stable_coin": "You are bridging a stable coin. For USDC, we are currently partnering with <a target=\"_blank\" href=\"https://stargate.finance/transfer\" class=\"link\">Stargate Bridge</a> for liquidity. Consider using their bridge, as the ecosystem partners are likely using their bridged version",
       "wrapped_eth": "You are bridging wrapped ETH. Please be aware that un-wrapping will only work on the original chain of the token, <span class=\"font-bold\">NOT</span> on the destination."
     },
     "button": {

packages/snaefell-ui/src/components/ConnectButton/ConnectButton.svelte

@@ -90,8 +90,11 @@
       {/if}
     {:else}
       <CircleUserIcon size="24" class={classNames('h-12')} />
-      {#if windowSize !== 'sm'}
-        Connect Wallet{/if}
+      {#if windowSize === 'sm'}
+        Connect
+      {:else}
+        Connect Wallet
+      {/if}
     {/if}
   </button>
 {/if}

packages/snaefell-ui/src/components/Header/Header.svelte

@@ -20,8 +20,8 @@
 
   $: headerClasses = classNames(
     baseHeaderClasses,
-    $pageScroll ? 'md:glassy-background-lg' : null,
-    $pageScroll ? 'md:border-b-[1px] md:border-border-divider-default' : 'md:border-b-[1px] md:border-transparent',
+    $pageScroll ? 'glassy-background-lg' : null,
+    $pageScroll ? 'border-b-[1px] border-border-divider-default' : 'border-b-[1px] border-transparent',
     $$props.class,
   );
 

packages/snaefell-ui/src/components/Header/classes.ts

@@ -9,14 +9,15 @@ export const baseHeaderClasses = classNames(
   'gap-4',
   'relative',
   'z-50',
-  'px-4',
+  'px-6',
+  'py-10',
 );
 
 export const taikoonsIconClasses = classNames('h-full');
 
 export const rightSectionClasses = classNames(
   'md:right-8',
-  'right-4',
+  'right-6',
   'w-max',
   'absolute',
   'flex flex-row justify-center items-center',

packages/snaefell-ui/src/components/Mint/EligibilityPanel.svelte

@@ -4,13 +4,16 @@
 
   import { ActionButton } from '$components/Button';
   import { classNames } from '$lib/util/classNames';
+  import { Theme, theme } from '$stores/theme';
 
   const dispatch = createEventDispatcher();
 
   type IStep = 'eligible' | 'non-eligible' | 'success';
   export let step: IStep = 'non-eligible';
   export let disabled = true;
 
+  $: isDarkTheme = $theme === Theme.DARK;
+
   $: wrapperClasses = classNames(
     'flex',
     'flex-col',
@@ -25,16 +28,16 @@
   $: titleClasses = classNames('text-[45px]/[52px]', 'font-clash-grotesk', 'font-[500]', 'my-6');
   $: textClasses = classNames('text-[16px]/[24px]', 'text-content-secondary');
 
-  const icons: Record<IStep, string> = {
-    eligible: '/img/eligible.svg',
-    'non-eligible': '/img/non-eligible.svg',
-    success: '/img/success.svg',
-  };
+  $: icons = {
+    eligible: `/img/eligible-${isDarkTheme ? 'dark' : 'light'}.svg`,
+    'non-eligible': `/img/non-eligible-${isDarkTheme ? 'dark' : 'light'}.svg`,
+    success: `/img/success-${isDarkTheme ? 'dark' : 'light'}.svg`,
+  } as Record<IStep, string>;
 
   const titles: Record<IStep, string> = {
     eligible: "Congratulations, you're eligible!",
     'non-eligible': "Sorry, you're not eligible",
-    success: 'You got it!',
+    success: "You've got it!",
   };
 
   const texts: Record<IStep, string> = {
@@ -59,18 +62,29 @@
     {texts[step]}
   </div>
 
-  <ActionButton
-    on:click={async () => {
-      dispatch('click');
-    }}
-    priority="primary"
-    {disabled}
-    class={buttonClasses}
-    onPopup>
+  <div class={classNames('flex', 'gap-4', 'w-full', 'flex-row')}>
+    <ActionButton
+      on:click={async () => {
+        dispatch('click');
+      }}
+      priority="secondary"
+      {disabled}
+      class={buttonClasses}
+      onPopup>
+      {#if step === 'success'}
+        {$t('buttons.view')}
+      {:else}
+        {$t('buttons.proceedToMint')}
+      {/if}
+    </ActionButton>
+
     {#if step === 'success'}
-      {$t('buttons.view')}
-    {:else}
-      {$t('buttons.proceedToMint')}
+      <!-- use on trailblazers -->
+      <ActionButton priority="primary" class={buttonClasses} onPopup>
+        <a href="https://trailblazers.taiko.xyz/" target="_blank">
+          {$t('buttons.useOnTrailblazers')}
+        </a>
+      </ActionButton>
     {/if}
-  </ActionButton>
+  </div>
 </div>