chore: fix formatting

Co-authored-by: bwallacee <ben@vega.xyz>

apps/trading/client-pages/market/market.tsx

@@ -114,7 +114,7 @@ export const MarketPage = () => {
           </p>
           <p className="justify-center text-sm">
             <Trans
-              defaults="Please choose another market from the <0>market list<0>"
+              defaults="Please choose another market from the <0>market list</0>"
               ns={ns}
               components={[
                 <ExternalLink

apps/trading/client-pages/referrals/apply-code-form.tsx

@@ -152,8 +152,8 @@ export const ApplyCodeForm = () => {
   // show "code applied" message when successfully applied
   if (status === 'successful') {
     return (
-      <div className="w-1/2 mx-auto">
-        <h3 className="mb-5 text-xl text-center uppercase calt flex flex-row gap-2 justify-center items-center">
+      <div className="mx-auto w-1/2">
+        <h3 className="calt mb-5 flex flex-row items-center justify-center gap-2 text-center text-xl uppercase">
           <span className="text-vega-green-500">
             <VegaIcon name={VegaIconNames.TICK} size={20} />
           </span>{' '}
@@ -205,15 +205,15 @@ export const ApplyCodeForm = () => {
 
   return (
     <>
-      <div className="w-2/3 max-w-md mx-auto bg-vega-clight-800 dark:bg-vega-cdark-800 p-8 rounded-lg">
-        <h3 className="mb-4 text-2xl text-center calt">
+      <div className="bg-vega-clight-800 dark:bg-vega-cdark-800 mx-auto w-2/3 max-w-md rounded-lg p-8">
+        <h3 className="calt mb-4 text-center text-2xl">
           {t('Apply a referral code')}
         </h3>
         <p className="mb-4 text-center text-base">
           {t('Enter a referral code to get trading discounts.')}
         </p>
         <form
-          className={classNames('w-full flex flex-col gap-4', {
+          className={classNames('flex w-full flex-col gap-4', {
             'animate-shake': Boolean(errors.code),
           })}
           onSubmit={handleSubmit(onSubmit)}
@@ -227,13 +227,13 @@ export const ApplyCodeForm = () => {
                 validate: (value) => validateCode(value, t),
               })}
               placeholder="Enter a code"
-              className="mb-2 bg-vega-clight-900 dark:bg-vega-cdark-700"
+              className="bg-vega-clight-900 dark:bg-vega-cdark-700 mb-2"
             />
           </label>
           <RainbowButton variant="border" {...getButtonProps()} />
         </form>
         {errors.code && (
-          <InputError className="break-words overflow-auto">
+          <InputError className="overflow-auto break-words">
             {errors.code.message?.toString()}
           </InputError>
         )}
@@ -245,10 +245,10 @@ export const ApplyCodeForm = () => {
       ) : null}
       {previewData ? (
         <div className="mt-10">
-          <h2 className="text-2xl mb-5">
+          <h2 className="mb-5 text-2xl">
             {t(
-              'You are joining the group shown, but will not have access to benefits until you have completed at least %s epochs.',
-              [nextBenefitTierEpochsValue.toString()]
+              'You are joining the group shown, but will not have access to benefits until you have completed at least {{count}} epochs.',
+              { count: nextBenefitTierEpochsValue }
             )}
           </h2>
           <Statistics data={previewData} program={program} as="referee" />

apps/trading/client-pages/rewards/rewards.tsx

@@ -1,7 +1,8 @@
-import { t } from '@vegaprotocol/i18n';
+import { useT } from '../../lib/use-t';
 import { RewardsContainer } from '../../components/rewards-container';
 
 export const Rewards = () => {
+  const t = useT();
   return (
     <div className="container mx-auto p-4">
       <h1 className="px-4 pb-4 text-2xl">{t('Rewards')}</h1>

apps/trading/components/rewards-container/rewards-container.tsx

@@ -1,7 +1,6 @@
 import groupBy from 'lodash/groupBy';
 import type { Account } from '@vegaprotocol/accounts';
 import { useAccounts } from '@vegaprotocol/accounts';
-import { t } from '@vegaprotocol/i18n';
 import {
   NetworkParams,
   useNetworkParams,
@@ -31,8 +30,10 @@ import { addDecimalsFormatNumberQuantum } from '@vegaprotocol/utils';
 import { ViewType, useSidebar } from '../sidebar';
 import { useGetCurrentRouteId } from '../../lib/hooks/use-get-current-route-id';
 import { RewardsHistoryContainer } from './rewards-history';
+import { useT } from '../../lib/use-t';
 
 export const RewardsContainer = () => {
+  const t = useT();
   const { pubKey } = useVegaWallet();
   const { params, loading: paramsLoading } = useNetworkParams([
     NetworkParams.reward_asset,
@@ -121,7 +122,9 @@ export const RewardsContainer = () => {
         return (
           <Card
             key={assetId}
-            title={t('%s Reward pot', asset.symbol)}
+            title={t('{{assetSymbol}} Reward pot', {
+              assetSymbol: asset.symbol,
+            })}
             className="lg:col-span-3 xl:col-span-2"
             loading={loading}
           >
@@ -167,6 +170,7 @@ export const RewardPot = ({
   assetId,
   vestingBalancesSummary,
 }: RewardPotProps) => {
+  const t = useT();
   // TODO: Opening the sidebar for the first time works, but then clicking on redeem
   // for a different asset does not update the form
   const currentRouteId = useGetCurrentRouteId();
@@ -242,7 +246,9 @@ export const RewardPot = ({
             <CardTable>
               <tr>
                 <CardTableTH className="flex items-center gap-1">
-                  {t(`Locked ${rewardAsset.symbol}`)}
+                  {t('Locked {{assetSymbol}}', {
+                    assetSymbol: rewardAsset.symbol,
+                  })}
                   <VegaIcon name={VegaIconNames.LOCK} size={12} />
                 </CardTableTH>
                 <CardTableTD>
@@ -254,7 +260,11 @@ export const RewardPot = ({
                 </CardTableTD>
               </tr>
               <tr>
-                <CardTableTH>{t(`Vesting ${rewardAsset.symbol}`)}</CardTableTH>
+                <CardTableTH>
+                  {t('Vesting {{assetSymbol}}', {
+                    assetSymbol: rewardAsset.symbol,
+                  })}
+                </CardTableTH>
                 <CardTableTD>
                   {addDecimalsFormatNumberQuantum(
                     totalVesting.toString(),
@@ -309,6 +319,7 @@ export const Vesting = ({
   baseRate: string;
   multiplier?: string;
 }) => {
+  const t = useT();
   const rate = new BigNumber(baseRate).times(multiplier);
   const rateFormatted = formatPercentage(Number(rate));
   const baseRateFormatted = formatPercentage(Number(baseRate));
@@ -341,6 +352,7 @@ export const Multipliers = ({
   streakMultiplier?: string;
   hoarderMultiplier?: string;
 }) => {
+  const t = useT();
   const combinedMultiplier = new BigNumber(streakMultiplier).times(
     hoarderMultiplier
   );

apps/trading/components/rewards-container/rewards-history.tsx

@@ -16,12 +16,12 @@ import {
   VegaIcon,
   VegaIconNames,
 } from '@vegaprotocol/ui-toolkit';
-import { t } from '@vegaprotocol/i18n';
 import {
   useRewardsHistoryQuery,
   type RewardsHistoryQuery,
 } from './__generated__/Rewards';
 import { useRewardsRowData } from './use-reward-row-data';
+import { useT } from '../../lib/use-t';
 
 export const RewardsHistoryContainer = ({
   epoch,
@@ -140,6 +140,7 @@ export const RewardHistoryTable = ({
   onEpochChange: (epochVariables: { from: number; to: number }) => void;
   loading: boolean;
 }) => {
+  const t = useT();
   const [isParty, setIsParty] = useState(false);
 
   const rowData = useRewardsRowData({

apps/trading/e2e/tests/iceberg_orders/test_iceberg_orders.py

@@ -52,7 +52,7 @@ class TestIcebergOrdersValidations:
         vega.wait_fn(1)
         vega.wait_for_total_catchup()
         expect(page.get_by_test_id("toast-content")).to_have_text(
-            "Order filledYour transaction has been confirmed View in block explorerSubmit order - filledBTC:DAI_2023+3 @ 107.00 tDAI"
+            "Order filledYour transaction has been confirmedView in block explorerSubmit order - filledBTC:DAI_2023+3 @ 107.00 tDAI"
         )
         page.get_by_test_id("All").click()
         expect(

apps/trading/e2e/tests/market/test_markets_proposed.py

@@ -54,7 +54,6 @@ def test_can_see_table_headers(proposed_market, page: Page):
         "Settlement asset",
         "State",
         "Parent market",
-        "Voting",
         "Closing date",
         "Enactment date",
         "",
@@ -83,10 +82,6 @@ def test_renders_markets_correctly(proposed_market, page: Page):
         row.locator('[col-id="terms.change.successorConfiguration.parentMarketId"]')
     ).to_have_text("-")
 
-    # 6001-MARK-054
-    # 6001-MARK-055
-    expect(row.get_by_test_id("vote-progress-bar-against")).to_be_visible()
-
     # 6001-MARK-056
     expect(row.locator('[col-id="closing-date"]')).not_to_be_empty()
 
@@ -124,8 +119,8 @@ def test_can_drag_and_drop_columns(proposed_market, page: Page):
     page.goto("/#/markets/all")
     page.click('[data-testid="Proposed markets"]')
     col_market = page.locator('[col-id="market"]').first
-    col_vote = page.locator('[col-id="voting"]').first
-    col_market.drag_to(col_vote)
+    col_state = page.locator('[col-id="state"]').first
+    col_market.drag_to(col_state)
 
     # Check the attribute of the dragged element
     attribute_value = col_market.get_attribute("aria-colindex")

apps/trading/e2e/tests/settings/test_settings.py

@@ -32,12 +32,12 @@ def test_share_usage_data(page: Page):
 
 # Define a mapping of icon selectors to toast selectors
 ICON_TO_TOAST = {
-    'aria-label="arrow-top-left icon"': 'class="group absolute z-20 top-0 left-0 max-w-full max-h-full overflow-x-hidden overflow-y-auto p-4"',
-    'aria-label="arrow-up icon"': 'class="group absolute z-20 top-0 left-[50%] translate-x-[-50%] max-w-full max-h-full overflow-x-hidden overflow-y-auto p-4"',
-    'aria-label="arrow-top-right icon"': 'class="group absolute z-20 top-0 right-0 max-w-full max-h-full overflow-x-hidden overflow-y-auto p-4"',
-    'aria-label="arrow-bottom-left icon"': 'class="group absolute z-20 bottom-0 left-0 max-w-full max-h-full overflow-x-hidden overflow-y-auto p-4"',
-    'aria-label="arrow-down icon"': 'class="group absolute z-20 bottom-0 left-[50%] translate-x-[-50%] max-w-full max-h-full overflow-x-hidden overflow-y-auto p-4"',
-    'aria-label="arrow-bottom-right icon"': 'class="group absolute z-20 bottom-0 right-0 max-w-full max-h-full overflow-x-hidden overflow-y-auto p-4"',
+    'aria-label="arrow-top-left icon"': 'class="relative flex-1 overflow-auto p-4 pr-[40px] [&>p]:mb-[2.5px]"',
+    'aria-label="arrow-up icon"': 'class="relative flex-1 overflow-auto p-4 pr-[40px] [&>p]:mb-[2.5px]"',
+    'aria-label="arrow-top-right icon"': 'class="relative flex-1 overflow-auto p-4 pr-[40px] [&>p]:mb-[2.5px]"',
+    'aria-label="arrow-bottom-left icon"': 'class="relative flex-1 overflow-auto p-4 pr-[40px] [&>p]:mb-[2.5px]"',
+    'aria-label="arrow-down icon"': 'class="relative flex-1 overflow-auto p-4 pr-[40px] [&>p]:mb-[2.5px]"',
+    'aria-label="arrow-bottom-right icon"': 'class="relative flex-1 overflow-auto p-4 pr-[40px] [&>p]:mb-[2.5px]"',
 }
 
 

apps/trading/e2e/tests/transfer/test_transfer_key_to_key.py

@@ -42,7 +42,7 @@ def test_transfer_submit(continuous_market, vega: VegaService, page: Page):
     vega.forward("10s")
     vega.wait_fn(1)
     vega.wait_for_total_catchup()
-    expected_confirmation_text = re.compile(r"Transfer completeYour transaction has been confirmed View in block explorerTransferTo .{6}….{6}1\.00 tDAI")
+    expected_confirmation_text = re.compile(r"Transfer completeYour transaction has been confirmedView in block explorerTransferTo .{6}….{6}1\.00 tDAI")
     actual_confirmation_text = page.get_by_test_id('toast-content').text_content()
     assert expected_confirmation_text.search(actual_confirmation_text), f"Expected pattern not found in {actual_confirmation_text}"
     
@@ -129,6 +129,6 @@ def test_transfer_vesting_below_minimum(continuous_market, vega: VegaService, pa
     vega.forward("10s")
     vega.wait_fn(1)
     vega.wait_for_total_catchup()
-    expected_confirmation_text = re.compile(r"Transfer completeYour transaction has been confirmed View in block explorerTransferTo .{6}….{6}0\.00001 tDAI")
+    expected_confirmation_text = re.compile(r"Transfer completeYour transaction has been confirmedView in block explorerTransferTo .{6}….{6}0\.00001 tDAI")
     actual_confirmation_text = page.get_by_test_id('toast-content').text_content()
     assert expected_confirmation_text.search(actual_confirmation_text), f"Expected pattern not found in {actual_confirmation_text}"

apps/trading/lib/i18n/index.ts

@@ -66,7 +66,18 @@ i18n
       'environment',
       'fills',
       'funding-payments',
+      'ledger',
+      'liquidity',
+      'market-depth',
+      'markets',
+      'orders',
+      'positions',
+      'trades',
       'trading',
+      'ui-toolkit',
+      'utils',
+      'wallet',
+      'web3',
     ],
     defaultNS: 'trading',
     nsSeparator: false,

libs/i18n/src/locales/en/markets.json

@@ -139,5 +139,5 @@
   "View settlement data specification": "View settlement data specification",
   "View settlement schedule specification": "View settlement schedule specification",
   "View termination specification": "View termination specification",
-  "Within %s seconds": "Within %s seconds"
+  "Within {{horizonSecs}} seconds": "Within {{horizonSecs}} seconds"
 }

libs/i18n/src/locales/en/trading.json

@@ -2,6 +2,7 @@
   "(Combined set volume {{runningVolume}} over last {{epochs}} epochs)": "(Combined set volume {{runningVolume}} over last {{epochs}} epochs)",
   "(Created at: {{createdAt}})": "(Created at: {{createdAt}})",
   "{{amount}} $VEGA staked": "{{amount}} $VEGA staked",
+  "{{assetSymbol}} Reward pot": "{{assetSymbol}} Reward pot",
   "{{checkedAssets}} Assets": "{{checkedAssets}} Assets",
   "{{distance}} ago": "{{distance}} ago",
   "{{instrumentCode}} liquidity provision": "{{instrumentCode}} liquidity provision",
@@ -17,7 +18,9 @@
   "Anyone with the referral link can apply it to their key(s) of choice via an on chain transaction": "Anyone with the referral link can apply it to their key(s) of choice via an on chain transaction",
   "Asset (1)": "Asset (1)",
   "Assets": "Assets",
+  "Available to withdraw this epoch": "Available to withdraw this epoch",
   "Base commission rate": "Base commission rate",
+  "Base rate": "Base rate",
   "Best bid": "Best bid",
   "Best offer": "Best offer",
   "Browse": "Browse",
@@ -71,6 +74,7 @@
   "Discounts are applied automatically during trading based on the key(s) used": "Discounts are applied automatically during trading based on the key(s) used",
   "Docs": "Docs",
   "Earn commission & stake rewards": "Earn commission & stake rewards",
+  "Earned by me": "Earned by me",
   "Enactment date reached and usual auction exit checks pass": "Enactment date reached and usual auction exit checks pass",
   "Environment not configured": "Environment not configured",
   "epochs in referral set": "epochs in referral set",
@@ -96,6 +100,7 @@
   "Funding Rate": "Funding Rate",
   "Funding rate": "Funding rate",
   "Futures": "Futures",
+  "From epoch": "From epoch",
   "Generate a referral code to share with your friends and start earning commission.": "Generate a referral code to share with your friends and start earning commission.",
   "Generate code": "Generate code",
   "Get started": "Get started",
@@ -109,6 +114,7 @@
   "Help identify bugs and improve the service by sharing anonymous usage data.": "Help identify bugs and improve the service by sharing anonymous usage data.",
   "Help us identify bugs and improve Vega Governance by sharing anonymous usage data.": "Help us identify bugs and improve Vega Governance by sharing anonymous usage data.",
   "Hide closed markets": "Hide closed markets",
+  "Hoarder reward multiplier": "Hoarder reward multiplier",
   "How it works": "How it works",
   "I want a code": "I want a code",
   "Improve vega console": "Improve vega console",
@@ -122,6 +128,7 @@
   "Liquidity": "Liquidity",
   "Liquidity fees": "Liquidity fees",
   "Liquidity supplied": "Liquidity supplied",
+  "Locked {{assetSymbol}}": "Locked {{assetSymbol}}",
   "Low fees and no cost to place orders": "Low fees and no cost to place orders",
   "Mainnet status & incidents": "Mainnet status & incidents",
   "Make withdrawal": "Make withdrawal",
@@ -157,6 +164,7 @@
   "No perpetual markets.": "No perpetual markets.",
   "No referral program active": "No referral program active",
   "No rejected orders": "No rejected orders",
+  "No rewards": "No rewards",
   "No thanks": "No thanks",
   "No third party has access to your funds.": "No third party has access to your funds.",
   "No volume discount program active": "No volume discount program active",
@@ -165,6 +173,7 @@
   "Non-custodial and pseudonymous": "Non-custodial and pseudonymous",
   "None": "None",
   "Number of traders": "Number of traders",
+  "Not connected": "Not connected",
   "Open": "Open",
   "Open a position": "Open a position",
   "Open markets": "Open markets",
@@ -176,7 +185,7 @@
   "Parent of a market": "Parent of a market",
   "Past {{count}} epochs": "Past {{count}} epochs",
   "Perpetuals": "Perpetuals",
-  "Please choose another market from the <0>market list<0>": "Please choose another market from the <0>market list<0>",
+  "Please choose another market from the <0>market list</0>": "Please choose another market from the <0>market list</0>",
   "Please connect Vega wallet": "Please connect Vega wallet",
   "Portfolio": "Portfolio",
   "Positions": "Positions",
@@ -193,6 +202,7 @@
   "Read the terms": "Read the terms",
   "Ready to trade": "Ready to trade",
   "Ready to trade with real funds? <0>Switch to Mainnet</0>": "Ready to trade with real funds? <0>Switch to Mainnet</0>",
+  "Redeem rewards": "Redeem rewards",
   "Referral benefits": "Referral benefits",
   "Referral discount": "Referral discount",
   "referral-statistics-commission": "Commission earned in <0>qUSD</0> (last {{count}} epochs)",
@@ -205,6 +215,9 @@
   "Required epochs": "Required epochs",
   "Required for next tier": "Required for next tier",
   "Resources": "Resources",
+  "Rewards": "Rewards",
+  "Rewards history": "Rewards history",
+  "Rewards multipliers": "Rewards multipliers",
   "SCCR": "SCCR",
   "Search": "Search",
   "See all markets": "See all markets",
@@ -229,10 +242,12 @@
   "Status": "Status",
   "Stop": "Stop",
   "Stop orders": "Stop orders",
+  "Streak reward multiplier": "Streak reward multiplier",
   "Successor of a market": "Successor of a market",
   "Successors to this market have been proposed": "Successors to this market have been proposed",
   "Supplied stake": "Supplied stake",
   "Suspended due to price or liquidity monitoring trigger": "Suspended due to price or liquidity monitoring trigger",
+  "to": "to",
   "Target stake": "Target stake",
   "The amount of fees paid to liquidity providers across the whole market during the last epoch {{epoch}}.": "The amount of fees paid to liquidity providers across the whole market during the last epoch {{epoch}}.",
   "The commission is taken from the infrastructure fee, maker fee, and liquidity provider fee, not from the referee": "The commission is taken from the infrastructure fee, maker fee, and liquidity provider fee, not from the referee",
@@ -254,6 +269,7 @@
   "Toast location": "Toast location",
   "Total commission (last {{count}}} epochs)": "Total commission (last {{count}}} epochs)",
   "Total discount": "Total discount",
+  "Total distributed": "Total distributed",
   "Total fee after discount": "Total fee after discount",
   "Total fee before discount": "Total fee before discount",
   "Trader": "Trader",
@@ -267,6 +283,10 @@
   "Transfer": "Transfer",
   "Unknown": "Unknown",
   "Unknown settlement date": "Unknown settlement date",
+  "Vega Reward pot": "Vega Reward pot",
+  "Vesting": "Vesting",
+  "Vesting {{assetSymbol}}": "Vesting {{assetSymbol}}",
+  "Vesting multiplier": "Vesting multiplier",
   "View as party": "View as party",
   "View liquidity provision table": "View liquidity provision table",
   "View on Explorer": "View on Explorer",
@@ -284,6 +304,7 @@
   "We're sorry but we don't have an active referral programme currently running. You can propose a new programme <0>here</0>.": "We're sorry but we don't have an active referral programme currently running. You can propose a new programme <0>here</0>.",
   "Welcome to Vega trading!": "Welcome to Vega trading!",
   "Withdraw": "Withdraw",
+  "You are joining the group shown, but will not have access to benefits until you have completed at least {{count}} epochs.": "You are joining the group shown, but will not have access to benefits until you have completed at least {{count}} epochs.",
   "You can opt out any time via settings": "You can opt out any time via settings",
   "You may encounter bugs, loss of functionality or loss of assets.": "You may encounter bugs, loss of functionality or loss of assets.",
   "You must be connected to the Vega wallet.": "You must be connected to the Vega wallet.",

libs/i18n/src/locales/en/withdraws.json

@@ -0,0 +1,49 @@
+{
+  "All {{symbol}} withdrawals are subject to a {{delay}} delay.": "All {{symbol}} withdrawals are subject to a {{delay}} delay.",
+  "Amount": "Amount",
+  "Asset": "Asset",
+  "Available to withdraw in {{availableTimestamp}}": "Available to withdraw in {{availableTimestamp}}",
+  "Balance available": "Balance available",
+  "Complete the withdrawal to release your funds": "Complete the withdrawal to release your funds",
+  "Complete these {{count}} withdrawals to release your funds": "Complete these {{count}} withdrawals to release your funds",
+  "Complete withdrawal": "Complete withdrawal",
+  "Completed": "Completed",
+  "Connect Ethereum wallet to complete": "Connect Ethereum wallet to complete",
+  "Connect": "Connect",
+  "Created": "Created",
+  "Delay time": "Delay time",
+  "Delayed (ready in {{readyIn}})": "Delayed (ready in {{readyIn}})",
+  "Delayed withdrawal threshold": "Delayed withdrawal threshold",
+  "Disconnect": "Disconnect",
+  "Failed": "Failed",
+  "Insufficient amount in account": "Insufficient amount in account",
+  "Invalid asset source: {{source}}": "Invalid asset source: {{source}}",
+  "No withdrawals": "No withdrawals",
+  "None": "None",
+  "Pending": "Pending",
+  "Please select an asset": "Please select an asset",
+  "Read more": "Read more",
+  "Ready to complete": "Ready to complete",
+  "Recipient": "Recipient",
+  "Rejected": "Rejected",
+  "Release funds": "Release funds",
+  "Status": "Status",
+  "Step 1 - Release funds from Vega": "Step 1 - Release funds from Vega",
+  "Step 2 - Transfer funds to your Ethereum wallet": "Step 2 - Transfer funds to your Ethereum wallet",
+  "There are two steps required to make a withdrawal": "There are two steps required to make a withdrawal",
+  "This app only works on {{chainName}}. Please change chain.": "This app only works on {{chainName}}. Please change chain.",
+  "To (Ethereum address)": "To (Ethereum address)",
+  "Transaction": "Transaction",
+  "Use maximum": "Use maximum",
+  "Verifying withdrawal approval": "Verifying withdrawal approval",
+  "View withdrawal details": "View withdrawal details",
+  "View withdrawals": "View withdrawals",
+  "Withdraw {{amount}} {{symbol}}": "Withdraw {{amount}} {{symbol}}",
+  "Withdraw funds": "Withdraw funds",
+  "Withdraw": "Withdraw",
+  "Withdrawal ready": "Withdrawal ready",
+  "Withdrawals of {{threshold}} {{symbol}} or more will be delayed for {{delay}}.": "Withdrawals of {{threshold}} {{symbol}} or more will be delayed for {{delay}}.",
+  "Withdrawals ready": "Withdrawals ready",
+  "You have no assets to withdraw": "You have no assets to withdraw",
+  "Your funds have been unlocked for withdrawal - <0>View in block explorer<0>": "Your funds have been unlocked for withdrawal - <0>View in block explorer<0>"
+}

libs/markets/src/lib/components/market-info/market-info-panels.tsx

@@ -723,7 +723,7 @@ export const PriceMonitoringBoundsInfoPanel = ({
           })}
         </p>
         <p className="col-span-1 text-right">
-          {t('Within %s seconds', {
+          {t('Within {{horizonSecs}} seconds', {
             horizonSecs: formatNumber(trigger.horizonSecs),
           })}
         </p>

libs/markets/src/lib/components/oracle-full-profile/oracle-full-profile.tsx

@@ -189,7 +189,7 @@ export const OracleFullProfile = ({
                         'verifyProofs',
                         'Verify {{count}} proofs of ownership',
                         {
-                          proofs: signedMessageProofs,
+                          count: signedMessageProofs.length,
                         }
                       )}{' '}
                       <VegaIcon name={VegaIconNames.OPEN_EXTERNAL} size={13} />

libs/markets/src/lib/use-t.jsx

@@ -1,3 +1,3 @@
 import { useTranslation } from 'react-i18next';
 
-export const useT = () => useTranslation('funding-payments').t;
+export const useT = () => useTranslation('markets').t;

libs/web3/src/lib/use-vega-transaction-toasts.tsx

@@ -677,10 +677,8 @@ const VegaTxRequestedToastContent = ({ tx }: VegaTxToastContentProps) => {
   );
 };
 
-const VegaTxPendingToastContentProps = (
-  { tx }: VegaTxToastContentProps,
-  t: ReturnType<typeof useT>
-) => {
+const VegaTxPendingToastContent = ({ tx }: VegaTxToastContentProps) => {
+  const t = useT();
   const explorerLink = useLinks(DApp.Explorer);
   return (
     <>
@@ -750,7 +748,7 @@ const VegaTxCompleteToastsContent = ({ tx }: VegaTxToastContentProps) => {
               // eslint-disable-next-line jsx-a11y/anchor-is-valid
               <a
                 href="#"
-                className="inline underline underline-offset-4 cursor-pointer text-inherit break-words"
+                className="inline cursor-pointer break-words text-inherit underline underline-offset-4"
                 data-testid="toast-withdrawal-details"
                 onClick={(e) => {
                   e.preventDefault();
@@ -993,7 +991,7 @@ export const getVegaTransactionContentIntent = (tx: VegaStoredTxState) => {
     content = <VegaTxRequestedToastContent tx={tx} />;
   }
   if (tx.status === VegaTxStatus.Pending) {
-    content = <VegaTxPendingToastContentProps tx={tx} />;
+    content = <VegaTxPendingToastContent tx={tx} />;
   }
   if (tx.status === VegaTxStatus.Complete) {
     content = <VegaTxCompleteToastsContent tx={tx} />;

libs/withdraws/__mocks__/react-i18next.ts

@@ -0,0 +1,14 @@
+export const useTranslation = () => ({
+  t: (label: string, replacements?: Record<string, string>) => {
+    let translatedLabel = label;
+    if (typeof replacements === 'object' && replacements !== null) {
+      Object.keys(replacements).forEach((key) => {
+        translatedLabel = translatedLabel.replace(
+          `{{${key}}}`,
+          replacements[key]
+        );
+      });
+    }
+    return translatedLabel;
+  },
+});

libs/withdraws/src/lib/create-withdrawal-dialog.tsx

@@ -1,12 +1,13 @@
-import { t } from '@vegaprotocol/i18n';
 import { Dialog } from '@vegaprotocol/ui-toolkit';
 import { useVegaWallet } from '@vegaprotocol/wallet';
 import { WithdrawFormContainer } from './withdraw-form-container';
 import { useWeb3ConnectStore } from '@vegaprotocol/web3';
 import { useWithdrawalDialog } from './withdrawal-dialog';
 import { useVegaTransactionStore } from '@vegaprotocol/web3';
+import { useT } from './use-t';
 
 export const CreateWithdrawalDialog = () => {
+  const t = useT();
   const { assetId, isOpen, open, close } = useWithdrawalDialog();
   const { pubKey } = useVegaWallet();
   const createTransaction = useVegaTransactionStore((state) => state.create);

libs/withdraws/src/lib/use-ready-to-complete-withdrawals-toast.tsx

@@ -5,7 +5,6 @@ import type { Toast } from '@vegaprotocol/ui-toolkit';
 import { Button, Intent, Panel, ToastHeading } from '@vegaprotocol/ui-toolkit';
 import { useToasts } from '@vegaprotocol/ui-toolkit';
 import { useCallback, useEffect, useMemo, useState } from 'react';
-import { t } from '@vegaprotocol/i18n';
 import { formatNumber, toBigNum } from '@vegaprotocol/utils';
 import { useNavigate } from 'react-router-dom';
 import {
@@ -17,6 +16,7 @@ import {
 import { withdrawalProvider } from './withdrawals-provider';
 import type { WithdrawalFieldsFragment } from './__generated__/Withdrawal';
 import uniqBy from 'lodash/uniqBy';
+import { useT } from './use-t';
 
 const CHECK_INTERVAL = 1000;
 const ON_APP_START_TOAST_ID = `ready-to-withdraw`;
@@ -199,15 +199,15 @@ const MultipleReadyToWithdrawToastContent = ({
   count: number;
   withdrawalsLink?: string;
 }) => {
+  const t = useT();
   const navigate = useNavigate();
   return (
     <>
       <ToastHeading>{t('Withdrawals ready')}</ToastHeading>
       <p>
-        {t(
-          'Complete these %s withdrawals to release your funds',
-          count.toString()
-        )}
+        {t('Complete these {{count}} withdrawals to release your funds', {
+          count,
+        })}
       </p>
       <p className="mt-2">
         <Button
@@ -229,6 +229,7 @@ const SingleReadyToWithdrawToastContent = ({
 }: {
   withdrawal: WithdrawalFieldsFragment;
 }) => {
+  const t = useT();
   const { createEthWithdrawalApproval } = useEthWithdrawApprovalsStore(
     (state) => ({
       createEthWithdrawalApproval: state.create,
@@ -266,7 +267,10 @@ const SingleReadyToWithdrawToastContent = ({
       <p>{t('Complete the withdrawal to release your funds')}</p>
       <Panel>
         <strong>
-          {t('Withdraw')} {amount} {withdrawal.asset.symbol}
+          {t('Withdraw {{amount}} {{symbol}}', {
+            amount,
+            symbol: withdrawal.asset.symbol,
+          })}
         </strong>
       </Panel>
       {completeButton}

libs/withdraws/src/lib/use-t.ts

@@ -0,0 +1,3 @@
+import { useTranslation } from 'react-i18next';
+export const ns = 'withdraws';
+export const useT = () => useTranslation(ns).t;

libs/withdraws/src/lib/use-verify-withdrawal.ts

@@ -2,7 +2,6 @@ import { useCallback, useState } from 'react';
 import BigNumber from 'bignumber.js';
 import { addDecimal } from '@vegaprotocol/utils';
 import { localLoggerFactory } from '@vegaprotocol/logger';
-import { t } from '@vegaprotocol/i18n';
 import {
   ApprovalStatus,
   useGetWithdrawDelay,
@@ -15,6 +14,7 @@ import {
   type Erc20ApprovalQueryVariables,
 } from './__generated__/Erc20Approval';
 import { useApolloClient } from '@apollo/client';
+import { useT } from './use-t';
 
 export interface VerifyState {
   status: ApprovalStatus;
@@ -33,6 +33,7 @@ const initialState = {
 };
 
 export const useVerifyWithdrawal = () => {
+  const t = useT();
   const client = useApolloClient();
   const getThreshold = useGetWithdrawThreshold();
   const getDelay = useGetWithdrawDelay();
@@ -62,9 +63,9 @@ export const useVerifyWithdrawal = () => {
         if (withdrawal.asset.source.__typename !== 'ERC20') {
           setState({
             status: ApprovalStatus.Error,
-            message: t(
-              `Invalid asset source: ${withdrawal.asset.source.__typename}`
-            ),
+            message: t('Invalid asset source: {{source}}', {
+              source: withdrawal.asset.source.__typename,
+            }),
           });
           return false;
         }
@@ -132,7 +133,7 @@ export const useVerifyWithdrawal = () => {
         return false;
       }
     },
-    [getThreshold, getDelay, client, setState]
+    [getThreshold, getDelay, client, setState, t]
   );
 
   return { verify, state, reset };

libs/withdraws/src/lib/withdraw-form-container.tsx

@@ -1,6 +1,5 @@
 import { useMemo } from 'react';
 import { toBigNum } from '@vegaprotocol/utils';
-import { t } from '@vegaprotocol/i18n';
 import { useDataProvider } from '@vegaprotocol/data-provider';
 import { AsyncRendererInline } from '@vegaprotocol/ui-toolkit';
 import { accountsDataProvider } from '@vegaprotocol/accounts';
@@ -8,6 +7,7 @@ import { accountsDataProvider } from '@vegaprotocol/accounts';
 import { WithdrawManager } from './withdraw-manager';
 import * as Types from '@vegaprotocol/types';
 import type { WithdrawalArgs } from './withdraw-form';
+import { useT } from './use-t';
 
 interface WithdrawFormContainerProps {
   partyId?: string;
@@ -20,6 +20,7 @@ export const WithdrawFormContainer = ({
   partyId,
   submit,
 }: WithdrawFormContainerProps) => {
+  const t = useT();
   const { data, loading, error } = useDataProvider({
     dataProvider: accountsDataProvider,
     variables: { partyId: partyId || '' },

libs/withdraws/src/lib/withdraw-form.tsx

@@ -8,7 +8,6 @@ import {
   isAssetTypeERC20,
   formatNumber,
 } from '@vegaprotocol/utils';
-import { t } from '@vegaprotocol/i18n';
 import { useLocalStorage } from '@vegaprotocol/react-helpers';
 import {
   TradingFormGroup,
@@ -33,6 +32,7 @@ import {
 } from '@vegaprotocol/web3';
 import { AssetBalance } from './asset-balance';
 import { DocsLinks } from '@vegaprotocol/environment';
+import { useT } from './use-t';
 
 export interface WithdrawalArgs {
   amount: string;
@@ -69,10 +69,11 @@ const WithdrawDelayNotification = ({
   symbol: string;
   decimals: number;
 }) => {
-  const replacements = [
+  const t = useT();
+  const replacements = {
     symbol,
-    delay ? formatDistanceToNow(Date.now() + delay * 1000) : ' ',
-  ];
+    delay: delay ? formatDistanceToNow(Date.now() + delay * 1000) : ' ',
+  };
   return (
     <Notification
       intent={Intent.Warning}
@@ -84,11 +85,17 @@ const WithdrawDelayNotification = ({
       }
       message={[
         threshold.isEqualTo(0)
-          ? t('All %s withdrawals are subject to a %s delay.', replacements)
-          : t('Withdrawals of %s %s or more will be delayed for %s.', [
-              formatNumber(threshold, decimals),
-              ...replacements,
-            ]),
+          ? t(
+              'All {{symbol}} withdrawals are subject to a {{delay}} delay.',
+              replacements
+            )
+          : t(
+              'Withdrawals of {{threshold}} {{symbol}} or more will be delayed for {{delay}}.',
+              {
+                threshold: formatNumber(threshold, decimals),
+                ...replacements,
+              }
+            ),
         DocsLinks?.WITHDRAWAL_LIMITS ? (
           <ExternalLink className="ml-1" href={DocsLinks.WITHDRAWAL_LIMITS}>
             {t('Read more')}
@@ -111,10 +118,10 @@ export const WithdrawForm = ({
   onSelectAsset,
   submitWithdraw,
 }: WithdrawFormProps) => {
+  const t = useT();
   const ethereumAddress = useEthereumAddress();
   const required = useRequired();
   const minSafe = useMinSafe();
-
   const { account: address } = useWeb3React();
   const {
     register,
@@ -315,6 +322,7 @@ const UseButton = (props: UseButtonProps) => {
 };
 
 const EthereumButton = ({ clearAddress }: { clearAddress: () => void }) => {
+  const t = useT();
   const openDialog = useWeb3ConnectStore((state) => state.open);
   const { isActive, connector } = useWeb3React();
   const [, , removeEagerConnector] = useLocalStorage(ETHEREUM_EAGER_CONNECT);

libs/withdraws/src/lib/withdraw-limits.tsx

@@ -1,5 +1,4 @@
 import type { Asset } from '@vegaprotocol/assets';
-import { t } from '@vegaprotocol/i18n';
 import { CompactNumber } from '@vegaprotocol/react-helpers';
 import { WITHDRAW_THRESHOLD_TOOLTIP_TEXT } from '@vegaprotocol/assets';
 import {
@@ -9,6 +8,7 @@ import {
 } from '@vegaprotocol/ui-toolkit';
 import BigNumber from 'bignumber.js';
 import { formatDistanceToNow } from 'date-fns';
+import { useT } from './use-t';
 
 interface WithdrawLimitsProps {
   amount: string;
@@ -25,6 +25,7 @@ export const WithdrawLimits = ({
   delay,
   asset,
 }: WithdrawLimitsProps) => {
+  const t = useT();
   const delayTime =
     new BigNumber(amount).isGreaterThan(threshold) && delay
       ? formatDistanceToNow(Date.now() + delay * 1000)

libs/withdraws/src/lib/withdrawal-feedback.tsx

@@ -1,6 +1,5 @@
 import { useEnvironment } from '@vegaprotocol/environment';
 import { addDecimalsFormatNumber, truncateByChars } from '@vegaprotocol/utils';
-import { t } from '@vegaprotocol/i18n';
 import {
   Button,
   KeyValueTable,
@@ -11,6 +10,8 @@ import { getChainName, useWeb3ConnectStore } from '@vegaprotocol/web3';
 import { useWeb3React } from '@web3-react/core';
 import { formatDistanceToNow } from 'date-fns';
 import type { WithdrawalFieldsFragment } from './__generated__/Withdrawal';
+import { useT } from './use-t';
+import { Trans } from 'react-i18next';
 
 export const WithdrawalFeedback = ({
   transaction,
@@ -23,6 +24,7 @@ export const WithdrawalFeedback = ({
   submitWithdraw: (withdrawalId: string) => void;
   availableTimestamp: number | null;
 }) => {
+  const t = useT();
   const { VEGA_EXPLORER_URL } = useEnvironment();
   const isAvailable =
     availableTimestamp === null || Date.now() > availableTimestamp;
@@ -30,16 +32,20 @@ export const WithdrawalFeedback = ({
   return (
     <div>
       <p className="mb-2">
-        {t('Your funds have been unlocked for withdrawal')} -{' '}
-        <a
-          className="underline"
-          data-testid="tx-block-explorer"
-          href={`${VEGA_EXPLORER_URL}/txs/0x${transaction.txHash}`}
-          target="_blank"
-          rel="noreferrer"
-        >
-          {t('View in block explorer')}
-        </a>
+        <Trans
+          defaults="Your funds have been unlocked for withdrawal - <0>View in block explorer<0>"
+          components={[
+            <a
+              className="underline"
+              data-testid="tx-block-explorer"
+              href={`${VEGA_EXPLORER_URL}/txs/0x${transaction.txHash}`}
+              target="_blank"
+              rel="noreferrer"
+            >
+              View in block explorer
+            </a>,
+          ]}
+        />
       </p>
       {withdrawal && (
         <KeyValueTable>
@@ -78,11 +84,9 @@ export const WithdrawalFeedback = ({
         <ActionButton withdrawal={withdrawal} submitWithdraw={submitWithdraw} />
       ) : (
         <p className="text-danger">
-          {t(
-            `Available to withdraw in ${formatDistanceToNow(
-              availableTimestamp
-            )}`
-          )}
+          {t('Available to withdraw in {{availableTimestamp}}', {
+            availableTimestamp: formatDistanceToNow(availableTimestamp),
+          })}
         </p>
       )}
     </div>
@@ -96,6 +100,7 @@ const ActionButton = ({
   withdrawal: WithdrawalFieldsFragment | null;
   submitWithdraw: (withdrawalId: string) => void;
 }) => {
+  const t = useT();
   const { isActive, chainId } = useWeb3React();
   const { open, desiredChainId } = useWeb3ConnectStore((store) => ({
     open: store.open,
@@ -115,7 +120,9 @@ const ActionButton = ({
     return (
       <>
         <p className="text-danger mb-2">
-          {t(`This app only works on ${chainName}. Please change chain.`)}
+          {t('This app only works on {{chainName}}. Please change chain.', {
+            chainName,
+          })}
         </p>
         <Button disabled={true}>{t('Withdraw funds')}</Button>
       </>

libs/withdraws/src/lib/withdrawals-table.tsx

@@ -7,7 +7,6 @@ import {
   isNumeric,
   truncateByChars,
 } from '@vegaprotocol/utils';
-import { t } from '@vegaprotocol/i18n';
 import {
   ActionsDropdown,
   ButtonLink,
@@ -30,6 +29,7 @@ import {
 import * as Schema from '@vegaprotocol/types';
 import { type TimestampedWithdrawals } from './use-ready-to-complete-withdrawals-toast';
 import classNames from 'classnames';
+import { useT } from './use-t';
 
 export const WithdrawalsTable = ({
   delayed,
@@ -39,13 +39,14 @@ export const WithdrawalsTable = ({
   ready?: TimestampedWithdrawals;
   delayed?: TimestampedWithdrawals;
 }) => {
+  const t = useT();
   const createWithdrawApproval = useEthWithdrawApprovalsStore(
     (store) => store.create
   );
 
   const columnDefs = useMemo<ColDef[]>(
     () => [
-      { headerName: 'Asset', field: 'asset.symbol' },
+      { headerName: t('Asset'), field: 'asset.symbol' },
       {
         headerName: t('Amount'),
         field: 'amount',
@@ -128,7 +129,7 @@ export const WithdrawalsTable = ({
         }),
       },
     ],
-    [createWithdrawApproval, delayed, ready]
+    [createWithdrawApproval, delayed, ready, t]
   );
   return (
     <AgGrid
@@ -151,6 +152,7 @@ export type CompleteCellProps = {
   complete: (withdrawal: WithdrawalFieldsFragment) => void;
 };
 export const CompleteCell = ({ data, complete }: CompleteCellProps) => {
+  const t = useT();
   const open = useWithdrawalApprovalDialog((state) => state.open);
   const ref = useRef<HTMLButtonElement>(null);
 
@@ -206,8 +208,8 @@ export const StatusCell = ({
   ready?: TimestampedWithdrawals;
   delayed?: TimestampedWithdrawals;
 }) => {
+  const t = useT();
   const READY_TO_COMPLETE = t('Ready to complete');
-  const DELAYED = (readyIn: string) => t('Delayed (ready in %s)', readyIn);
   const PENDING = t('Pending');
   const COMPLETED = t('Completed');
   const REJECTED = t('Rejected');
@@ -246,7 +248,11 @@ export const StatusCell = ({
       if (isDelayed.timestamp == null) return;
       const remaining = Date.now() - isDelayed.timestamp;
       if (remaining < 0) {
-        setLabel(DELAYED(convertToCountdownString(remaining, '0:00:00:00')));
+        setLabel(
+          t('Delayed (ready in {{readyIn}})', {
+            readyIn: convertToCountdownString(remaining, '0:00:00:00'),
+          })
+        );
       } else {
         setLabel(READY_TO_COMPLETE);
       }
@@ -254,7 +260,7 @@ export const StatusCell = ({
     return () => {
       clearInterval(interval);
     };
-  }, [READY_TO_COMPLETE, data, delayed, isDelayed, isPending]);
+  }, [READY_TO_COMPLETE, data, delayed, isDelayed, isPending, t]);
 
   return data ? (
     <span