From d10ade44e0b72d74f14343ca8bd7a424a23eff4a Mon Sep 17 00:00:00 2001
From: rjpeterson <r.james.peterson@gmail.com>
Date: Sun, 9 Jan 2022 15:32:57 -0600
Subject: [PATCH 1/3] update swap translations, remove unused "rate" from
 common

---
 components/JupiterForm.tsx       |  6 ++---
 components/SwapTokenInfo.tsx     | 44 ++++++++++++++++++++------------
 public/locales/en/common.json    |  1 -
 public/locales/en/swap.json      | 11 ++++++++
 public/locales/es/common.json    |  1 -
 public/locales/es/swap.json      | 11 ++++++++
 public/locales/zh/common.json    |  1 -
 public/locales/zh/swap.json      | 21 +++++++++++----
 public/locales/zh_tw/common.json |  1 -
 public/locales/zh_tw/swap.json   | 21 +++++++++++----
 10 files changed, 84 insertions(+), 34 deletions(-)

diff --git a/components/JupiterForm.tsx b/components/JupiterForm.tsx
index 74180596..bd8ee781 100644
--- a/components/JupiterForm.tsx
+++ b/components/JupiterForm.tsx
@@ -728,9 +728,9 @@ const JupiterForm: FunctionComponent = () => {
                                   (formValue?.amount / outAmountUi)) *
                                   100 <=
                                 0
-                                  ? 'cheaper'
-                                  : 'more expensive'
-                              } than CoinGecko`}</span>
+                                  ? t('swap:cheaper')
+                                  : t('swap:more-expensive')
+                              } CoinGecko`}</span>
                             </div>
                           ) : null}
                         </div>
diff --git a/components/SwapTokenInfo.tsx b/components/SwapTokenInfo.tsx
index f33a0cf7..9b1c8a4b 100644
--- a/components/SwapTokenInfo.tsx
+++ b/components/SwapTokenInfo.tsx
@@ -8,6 +8,7 @@ import { AreaChart, Area, XAxis, YAxis, Tooltip } from 'recharts'
 import useDimensions from 'react-cool-dimensions'
 import { IconButton } from './Button'
 import { LineChartIcon } from './icons'
+import { useTranslation } from 'next-i18next'
 
 dayjs.extend(relativeTime)
 
@@ -34,6 +35,7 @@ const SwapTokenInfo: FunctionComponent<SwapTokenInfoProps> = ({
   const [mouseData, setMouseData] = useState<string | null>(null)
   const [daysToShow, setDaysToShow] = useState(1)
   const { observe, width, height } = useDimensions()
+  const { t } = useTranslation(['common', 'swap'])
 
   const handleMouseMove = (coords) => {
     if (coords.activePayload) {
@@ -278,7 +280,7 @@ const SwapTokenInfo: FunctionComponent<SwapTokenInfoProps> = ({
       ) : (
         <div className="bg-th-bkg-3 mt-4 md:mt-0 p-4 rounded-md text-center text-th-fgd-3">
           <LineChartIcon className="h-6 mx-auto text-th-primary w-6" />
-          Chart not available
+          {t('swap:chart-not-available')}
         </div>
       )}
 
@@ -351,7 +353,7 @@ const SwapTokenInfo: FunctionComponent<SwapTokenInfoProps> = ({
                     {inputTokenInfo.market_cap_rank ? (
                       <div className="border border-th-bkg-4 m-1 p-3 rounded-md">
                         <div className="text-th-fgd-3 text-xs">
-                          Market Cap Rank
+                          {t('swap:market-cap-rank')}
                         </div>
                         <div className="font-bold text-th-fgd-1 text-lg">
                           #{inputTokenInfo.market_cap_rank}
@@ -360,7 +362,9 @@ const SwapTokenInfo: FunctionComponent<SwapTokenInfoProps> = ({
                     ) : null}
                     {inputTokenInfo.market_data?.market_cap ? (
                       <div className="border border-th-bkg-4 m-1 p-3 rounded-md">
-                        <div className="text-th-fgd-3 text-xs">Market Cap</div>
+                        <div className="text-th-fgd-3 text-xs">
+                          {t('swap:market-cap')}
+                        </div>
                         <div className="font-bold text-th-fgd-1 text-lg">
                           $
                           {numberFormatter.format(
@@ -371,7 +375,9 @@ const SwapTokenInfo: FunctionComponent<SwapTokenInfoProps> = ({
                     ) : null}
                     {inputTokenInfo.market_data.total_volume?.usd ? (
                       <div className="border border-th-bkg-4 m-1 p-3 rounded-md">
-                        <div className="text-th-fgd-3 text-xs">24h Volume</div>
+                        <div className="text-th-fgd-3 text-xs">
+                          {t('daily-volume')}
+                        </div>
                         <div className="font-bold text-th-fgd-1 text-lg">
                           $
                           {numberFormatter.format(
@@ -383,7 +389,7 @@ const SwapTokenInfo: FunctionComponent<SwapTokenInfoProps> = ({
                     {inputTokenInfo.market_data?.circulating_supply ? (
                       <div className="border border-th-bkg-4 m-1 p-3 rounded-md">
                         <div className="text-th-fgd-3 text-xs">
-                          Token Supply
+                          {t('swap:token-supply')}
                         </div>
                         <div className="font-bold text-th-fgd-1 text-lg">
                           {numberFormatter.format(
@@ -392,7 +398,7 @@ const SwapTokenInfo: FunctionComponent<SwapTokenInfoProps> = ({
                         </div>
                         {inputTokenInfo.market_data?.max_supply ? (
                           <div className="text-th-fgd-2 text-xs">
-                            Max Supply:{' '}
+                            {t('swap:max-supply')}:{' '}
                             {numberFormatter.format(
                               inputTokenInfo.market_data.max_supply
                             )}
@@ -403,7 +409,7 @@ const SwapTokenInfo: FunctionComponent<SwapTokenInfoProps> = ({
                     {inputTokenInfo.market_data?.ath?.usd ? (
                       <div className="border border-th-bkg-4 m-1 p-3 rounded-md">
                         <div className="text-th-fgd-3 text-xs">
-                          All-Time High
+                          {t('swap:ath')}
                         </div>
                         <div className="flex">
                           <div className="font-bold text-th-fgd-1 text-lg">
@@ -441,7 +447,7 @@ const SwapTokenInfo: FunctionComponent<SwapTokenInfoProps> = ({
                     {inputTokenInfo.market_data?.atl?.usd ? (
                       <div className="border border-th-bkg-4 m-1 p-3 rounded-md">
                         <div className="text-th-fgd-3 text-xs">
-                          All-Time Low
+                          {t('swap:atl')}
                         </div>
                         <div className="flex">
                           <div className="font-bold text-th-fgd-1 text-lg">
@@ -488,7 +494,7 @@ const SwapTokenInfo: FunctionComponent<SwapTokenInfoProps> = ({
         </div>
       ) : (
         <div className="bg-th-bkg-3 mt-3 p-4 rounded-md text-center text-th-fgd-3">
-          Input token information is not available.
+          {t('swap:input-info-unavailable')}
         </div>
       )}
 
@@ -561,7 +567,7 @@ const SwapTokenInfo: FunctionComponent<SwapTokenInfoProps> = ({
                     {outputTokenInfo.market_cap_rank ? (
                       <div className="border border-th-bkg-4 m-1 p-3 rounded-md">
                         <div className="text-th-fgd-3 text-xs">
-                          Market Cap Rank
+                          {t('swap:market-cap-rank')}
                         </div>
                         <div className="font-bold text-th-fgd-1 text-lg">
                           #{outputTokenInfo.market_cap_rank}
@@ -570,7 +576,9 @@ const SwapTokenInfo: FunctionComponent<SwapTokenInfoProps> = ({
                     ) : null}
                     {outputTokenInfo.market_data?.market_cap ? (
                       <div className="border border-th-bkg-4 m-1 p-3 rounded-md">
-                        <div className="text-th-fgd-3 text-xs">Market Cap</div>
+                        <div className="text-th-fgd-3 text-xs">
+                          {t('swap:market-cap')}
+                        </div>
                         <div className="font-bold text-th-fgd-1 text-lg">
                           $
                           {numberFormatter.format(
@@ -581,7 +589,9 @@ const SwapTokenInfo: FunctionComponent<SwapTokenInfoProps> = ({
                     ) : null}
                     {outputTokenInfo.market_data.total_volume?.usd ? (
                       <div className="border border-th-bkg-4 m-1 p-3 rounded-md">
-                        <div className="text-th-fgd-3 text-xs">24h Volume</div>
+                        <div className="text-th-fgd-3 text-xs">
+                          {t('daily-volume')}
+                        </div>
                         <div className="font-bold text-th-fgd-1 text-lg">
                           $
                           {numberFormatter.format(
@@ -593,7 +603,7 @@ const SwapTokenInfo: FunctionComponent<SwapTokenInfoProps> = ({
                     {outputTokenInfo.market_data?.circulating_supply ? (
                       <div className="border border-th-bkg-4 m-1 p-3 rounded-md">
                         <div className="text-th-fgd-3 text-xs">
-                          Token Supply
+                          {t('swap:token-supply')}
                         </div>
                         <div className="font-bold text-th-fgd-1 text-lg">
                           {numberFormatter.format(
@@ -602,7 +612,7 @@ const SwapTokenInfo: FunctionComponent<SwapTokenInfoProps> = ({
                         </div>
                         {outputTokenInfo.market_data?.max_supply ? (
                           <div className="text-th-fgd-2 text-xs">
-                            Max Supply:{' '}
+                            {t('swap:max-supply')}:{' '}
                             {numberFormatter.format(
                               outputTokenInfo.market_data.max_supply
                             )}
@@ -613,7 +623,7 @@ const SwapTokenInfo: FunctionComponent<SwapTokenInfoProps> = ({
                     {outputTokenInfo.market_data?.ath?.usd ? (
                       <div className="border border-th-bkg-4 m-1 p-3 rounded-md">
                         <div className="text-th-fgd-3 text-xs">
-                          All-Time High
+                          {t('swap:ath')}
                         </div>
                         <div className="flex">
                           <div className="font-bold text-th-fgd-1 text-lg">
@@ -651,7 +661,7 @@ const SwapTokenInfo: FunctionComponent<SwapTokenInfoProps> = ({
                     {outputTokenInfo.market_data?.atl?.usd ? (
                       <div className="border border-th-bkg-4 m-1 p-3 rounded-md">
                         <div className="text-th-fgd-3 text-xs">
-                          All-Time Low
+                          {t('swap:atl')}
                         </div>
                         <div className="flex">
                           <div className="font-bold text-th-fgd-1 text-lg">
@@ -698,7 +708,7 @@ const SwapTokenInfo: FunctionComponent<SwapTokenInfoProps> = ({
         </div>
       ) : (
         <div className="bg-th-bkg-3 mt-3 p-4 rounded-md text-center text-th-fgd-3">
-          Output token information is not available.
+          {t('swap:output-info-unavailable')}
         </div>
       )}
     </div>
diff --git a/public/locales/en/common.json b/public/locales/en/common.json
index 998d5933..3f4fae32 100644
--- a/public/locales/en/common.json
+++ b/public/locales/en/common.json
@@ -272,7 +272,6 @@
   "profile-menu-tip-title": "Profile Menu",
   "profit-price": "Profit Price",
   "quantity": "Quantity",
-  "rate": "Rate",
   "rates": "Deposit/Borrow Rates",
   "read-more": "Read More",
   "recent": "Recent",
diff --git a/public/locales/en/swap.json b/public/locales/en/swap.json
index 3d5f0bb1..5fc60f29 100644
--- a/public/locales/en/swap.json
+++ b/public/locales/en/swap.json
@@ -2,17 +2,27 @@
   "ata-deposit": "Deposit",
   "ata-deposit-details": "{{cost}} SOL for {{count}} ATA Account",
   "ata-deposit-details_plural": "{{cost}} SOL for {{count}} ATA Accounts",
+  "ath": "All-Time High",
+  "atl": "All-Time Low",
   "bal": "Bal:",
   "best-swap": "Best Swap",
+  "chart-not-available": "Chart not available",
+  "cheaper": "cheaper than",
   "fees-paid-to": "Fees paid to {{feeRecipient}}",
   "from": "from",
   "get-started": "Before you get started...",
   "got-it": "Got It",
   "heres-how": "Here's how",
+  "input-info-unavailable": "Input token information is not available.",
   "jupiter-error": "Error in Jupiter – Try changing your input",
+  "market-cap": "Market Cap",
+  "market-cap-rank": "Market Cap Rank",
+  "max-supply": "Max Supply",
   "minimum-received": "Minimum Received",
+  "more-expensive": "more expensive than",
   "need-ata-account": "You need to have an Associated Token Account.",
   "other-routes": "{{numberOfRoutes}} other routes",
+  "output-info-unavailable": "Output token information is not available.",
   "pay": "Pay",
   "price-impact": "Price Impact",
   "price-info": "Price Info",
@@ -28,6 +38,7 @@
   "swap-successful": "Swap Successful",
   "swapping": "Swapping...",
   "to": "to",
+  "token-supply": "Token Supply",
   "transaction-fee": "Transaction Fee",
   "unavailable": "Unavailable",
   "you-pay": "You pay",
diff --git a/public/locales/es/common.json b/public/locales/es/common.json
index 93b697aa..65b39c0e 100644
--- a/public/locales/es/common.json
+++ b/public/locales/es/common.json
@@ -270,7 +270,6 @@
   "profile-menu-tip-title": "Menú de perfil",
   "profit-price": "Precio de beneficio",
   "quantity": "Cantidad",
-  "rate": "Rate",
   "rates": "Tasas de depósito / préstamo",
   "read-more": "Leer más",
   "recent": "Reciente",
diff --git a/public/locales/es/swap.json b/public/locales/es/swap.json
index 209dd436..ae7ef94a 100644
--- a/public/locales/es/swap.json
+++ b/public/locales/es/swap.json
@@ -2,17 +2,27 @@
   "ata-deposit": "Deposit",
   "ata-deposit-details": "{{cost}} SOL for {{count}} ATA Account",
   "ata-deposit-details_plural": "{{cost}} SOL for {{count}} ATA Accounts",
+  "ath": "All-Time High",
+  "atl": "All-Time Low",
   "bal": "Bal:",
   "best-swap": "Best Swap",
+  "chart-not-available": "Chart not available",
+  "cheaper": "cheaper than",
   "fees-paid-to": "Fees paid to {{feeRecipient}}",
   "from": "from",
   "get-started": "Before you get started...",
   "got-it": "Got It",
   "heres-how": "Here's how",
+  "input-info-unavailable": "Input token information is not available.",
   "jupiter-error": "Error in Jupiter – try changing your input",
+  "market-cap": "Market Cap",
+  "market-cap-rank": "Market Cap Rank",
+  "max-supply": "Max Supply",
   "minimum-received": "Minimum Received",
+  "more-expensive": "more expensive than",
   "need-ata-account": "You need to have an Associated Token Account.",
   "other-routes": "{{numberOfRoutes}} other routes",
+  "output-info-unavailable": "Output token information is not available.",
   "pay": "Pay",
   "price-impact": "Price Impact",
   "price-info": "Price Info",
@@ -28,6 +38,7 @@
   "swap-successful": "Swap Successful",
   "swapping": "Swapping...",
   "to": "to",
+  "token-supply": "Token Supply",
   "transaction-fee": "Transaction Fee",
   "unavailable": "Unavailable",
   "you-pay": "You pay",
diff --git a/public/locales/zh/common.json b/public/locales/zh/common.json
index 91375878..9c530229 100644
--- a/public/locales/zh/common.json
+++ b/public/locales/zh/common.json
@@ -270,7 +270,6 @@
     "profile-menu-tip-title": "个人资料菜单",
     "profit-price": "止盈价格",
     "quantity": "数量",
-    "rate": "排放率",
     "rates": "存款/借贷利率",
     "read-more": "看更多资料",
     "recent": "最近",
diff --git a/public/locales/zh/swap.json b/public/locales/zh/swap.json
index 2220dea3..3708008a 100644
--- a/public/locales/zh/swap.json
+++ b/public/locales/zh/swap.json
@@ -2,32 +2,43 @@
   "ata-deposit": "押金",
   "ata-deposit-details": "{{cost}} SOL为 {{count}} ATA帐户",
   "ata-deposit-details_plural": "{{cost}} SOL为 {{count}} ATA帐户",
+  "ath": "历史高价",
+  "atl": "历史低价",
   "bal": "余额:",
-  "best-swap": "Best Swap",
+  "best-swap": "最佳换币",
+  "chart-not-available": "无法显示图表",
+  "cheaper": "低于",
   "fees-paid-to": "费用缴给{{feeRecipient}}",
   "from": "从",
   "get-started": "开始前...",
   "got-it": "明白",
   "heres-how": "了解更多",
+  "input-info-unavailable": "获取付出币种资料时出错",
   "jupiter-error": "Jupiter出错，请更改输入",
+  "market-cap": "总市值",
+  "market-cap-rank": "总市值排名",
+  "max-supply": "最大供应量",
   "minimum-received": "最好获得",
+  "more-expensive": "高于",
   "need-ata-account": "您必有一个关联币种帐户（ATA）。",
-  "other-routes": "{{numberOfRoutes}} other routes",
+  "other-routes": "{{numberOfRoutes}}条其他路线",
+  "output-info-unavailable": "获取收到币种资料时出错",
   "pay": "付出",
-  "price-impact": "Price Impact",
+  "price-impact": "价格影响",
   "price-info": "价格细节",
-  "rate": "Rate",
+  "rate": "率",
   "receive": "收到",
   "routes-found": "找到{{numberOfRoutes}}条路线",
   "serum-details": "{{cost}} SOL为 {{count}} Serum OpenOrders帐户",
   "serum-details_plural": "{{cost}} SOL为 {{count}} Serum OpenOrders帐户",
   "serum-requires-openorders": "Serum要求每个币种有一个OpenOrders帐户。以后可以关闭帐户二恢复SOL押金。",
-  "swap-details": "Swap Details",
+  "swap-details": "换币细节",
   "swap-fee": "换币费用",
   "swap-in-wallet": "换币会在您被连结的钱包中进行而不在您的Mango帐户中。",
   "swap-successful": "交易成功",
   "swapping": "正在交易...",
   "to": "到",
+  "token-supply": "流通供应量",
   "transaction-fee": "交易费用",
   "unavailable": "无资料",
   "you-pay": "您付出",
diff --git a/public/locales/zh_tw/common.json b/public/locales/zh_tw/common.json
index 3011d099..7975f908 100644
--- a/public/locales/zh_tw/common.json
+++ b/public/locales/zh_tw/common.json
@@ -270,7 +270,6 @@
   "profile-menu-tip-title": "個人資料菜單",
   "profit-price": "止盈價格",
   "quantity": "數量",
-  "rate": "排放率",
   "rates": "存款/借貸利率",
   "read-more": "看更多資料",
   "recent": "最近",
diff --git a/public/locales/zh_tw/swap.json b/public/locales/zh_tw/swap.json
index 421f3847..8cf603fb 100644
--- a/public/locales/zh_tw/swap.json
+++ b/public/locales/zh_tw/swap.json
@@ -2,32 +2,43 @@
   "ata-deposit": "押金",
   "ata-deposit-details": "{{cost}} SOL為 {{count}} ATA帳戶",
   "ata-deposit-details_plural": "{{cost}} SOL為 {{count}} ATA帳戶",
+  "ath": "歷史高價",
+  "atl": "歷史低價",
   "bal": "餘額:",
-  "best-swap": "Best Swap",
+  "best-swap": "最佳換幣",
+  "chart-not-available": "無法顯示圖表",
+  "cheaper": "低於",
   "fees-paid-to": "費用繳給{{feeRecipient}}",
   "from": "從",
   "get-started": "開始前...",
   "got-it": "明白",
   "heres-how": "了解更多",
+  "input-info-unavailable": "獲取付出幣種資料時出錯",
   "jupiter-error": "Jupiter出錯，請更改輸入",
+  "market-cap": "總市值",
+  "market-cap-rank": "總市值排名",
+  "max-supply": "最大供應量",
   "minimum-received": "最好獲得",
+  "more-expensive": "高於",
   "need-ata-account": "您必有一個關聯幣種帳戶（ATA）。",
-  "other-routes": "{{numberOfRoutes}} other routes",
+  "other-routes": "{{numberOfRoutes}}條其他路線",
+  "output-info-unavailable": "獲取收到幣種資料時出錯",
   "pay": "付出",
-  "price-impact": "Price Impact",
+  "price-impact": "價格影響",
   "price-info": "價格細節",
-  "rate": "Rate",
+  "rate": "率",
   "receive": "收到",
   "routes-found": "找到{{numberOfRoutes}}條路線",
   "serum-details": "{{cost}} SOL為 {{count}} Serum OpenOrders帳戶",
   "serum-details_plural": "{{cost}} SOL為 {{count}} Serum OpenOrders帳戶",
   "serum-requires-openorders": "Serum要求每個幣種有一個OpenOrders帳戶。以後可以關閉帳戶二恢復SOL押金。",
-  "swap-details": "Swap Details",
+  "swap-details": "換幣細節",
   "swap-fee": "換幣費用",
   "swap-in-wallet": "換幣會在您被連結的錢包中進行而不在您的Mango帳戶中。",
   "swap-successful": "換幣成功",
   "swapping": "正在換幣...",
   "to": "到",
+  "token-supply": "流通供應量",
   "transaction-fee": "交易費用",
   "unavailable": "無資料",
   "you-pay": "您付出",

From 1e7374fd3c2c8eab59dfe634145dfededd106b1f Mon Sep 17 00:00:00 2001
From: rjpeterson <r.james.peterson@gmail.com>
Date: Sun, 9 Jan 2022 16:06:05 -0600
Subject: [PATCH 2/3] add dayjs locales

---
 components/LanguageSwitch.tsx | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/components/LanguageSwitch.tsx b/components/LanguageSwitch.tsx
index 01fbdc8c..69a862da 100644
--- a/components/LanguageSwitch.tsx
+++ b/components/LanguageSwitch.tsx
@@ -2,9 +2,15 @@ import { useEffect, useState } from 'react'
 import { TranslateIcon } from '@heroicons/react/outline'
 import DropMenu from './DropMenu'
 import { useRouter } from 'next/router'
+import dayjs from 'dayjs'
 import useLocalStorageState from '../hooks/useLocalStorageState'
 import { useTranslation } from 'next-i18next'
 
+require('dayjs/locale/en')
+require('dayjs/locale/es')
+require('dayjs/locale/zh')
+require('dayjs/locale/zh-tw')
+
 export const LANGS = [
   { locale: 'en', name: 'english', description: 'english' },
   { locale: 'es', name: 'spanish', description: 'spanish' },
@@ -29,6 +35,7 @@ const LanguageSwitch = () => {
   const handleLangChange = (e) => {
     setSavedLanguage(e)
     router.push({ pathname, query }, asPath, { locale: e })
+    dayjs.locale(e == 'zh_tw' ? 'zh-tw' : e)
   }
 
   return (

From 0663c321e446c2ea85659407a5873490a0a2befd Mon Sep 17 00:00:00 2001
From: rjpeterson <r.james.peterson@gmail.com>
Date: Sun, 9 Jan 2022 16:31:56 -0600
Subject: [PATCH 3/3] add missed translations. rename common:slippage key

---
 components/SwapSettingsModal.tsx         | 10 ++++++----
 components/trade_form/EstPriceImpact.tsx |  2 +-
 pages/swap.tsx                           |  8 ++++----
 public/locales/en/common.json            |  6 +++---
 public/locales/en/swap.json              |  3 +++
 public/locales/es/common.json            |  6 +++---
 public/locales/es/swap.json              |  3 +++
 public/locales/zh/common.json            |  6 +++---
 public/locales/zh/swap.json              |  3 +++
 public/locales/zh_tw/common.json         |  6 +++---
 public/locales/zh_tw/swap.json           |  3 +++
 11 files changed, 35 insertions(+), 21 deletions(-)

diff --git a/components/SwapSettingsModal.tsx b/components/SwapSettingsModal.tsx
index 84b6e0ea..c879986a 100644
--- a/components/SwapSettingsModal.tsx
+++ b/components/SwapSettingsModal.tsx
@@ -19,7 +19,7 @@ const SwapSettingsModal = ({
   slippage: number
   setSlippage: (x) => void
 }) => {
-  const { t } = useTranslation('common')
+  const { t } = useTranslation(['common', 'swap'])
   const [tempSlippage, setTempSlippage] = useState(slippage)
   const [inputValue, setInputValue] = useState(
     tempSlippage ? tempSlippage.toString() : ''
@@ -45,10 +45,12 @@ const SwapSettingsModal = ({
   return (
     <Modal isOpen={isOpen} onClose={onClose} hideClose>
       <Modal.Header>
-        <h2 className="font-bold text-th-fgd-1 text-lg">Slippage Settings</h2>
+        <h2 className="font-bold text-th-fgd-1 text-lg">
+          {t('swap:slippage-settings')}
+        </h2>
       </Modal.Header>
       <div className="flex justify-between mb-2">
-        <div className="text-th-fgd-1 text-xs">Slippage</div>
+        <div className="text-th-fgd-1 text-xs">{t('swap:slippage')}</div>
         <LinkButton
           className="font-normal text-th-fgd-3 text-xs"
           onClick={() => setShowCustomSlippageForm(!showCustomSlippageForm)}
@@ -75,7 +77,7 @@ const SwapSettingsModal = ({
         />
       )}
       <Button className="mt-6 w-full" onClick={handleSave}>
-        Save
+        {t('save')}
       </Button>
     </Modal>
   )
diff --git a/components/trade_form/EstPriceImpact.tsx b/components/trade_form/EstPriceImpact.tsx
index 95487e12..14562262 100644
--- a/components/trade_form/EstPriceImpact.tsx
+++ b/components/trade_form/EstPriceImpact.tsx
@@ -13,7 +13,7 @@ const EstPriceImpact = ({
   return (
     <div className={`text-th-fgd-3 text-xs`}>
       <div className="flex justify-between mb-1">
-        {t('slippage')}
+        {t('est-slippage')}
         <span
           className={`font-bold opacity-80 ml-2 ${
             priceImpactRel <= 0.005
diff --git a/pages/swap.tsx b/pages/swap.tsx
index eab7e814..7e425268 100644
--- a/pages/swap.tsx
+++ b/pages/swap.tsx
@@ -4,7 +4,6 @@ import useMangoStore from '../stores/useMangoStore'
 import PageBodyContainer from '../components/PageBodyContainer'
 import TopBar from '../components/TopBar'
 import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
-// import { useTranslation } from 'next-i18next'
 import {
   actionsSelector,
   connectionSelector,
@@ -13,6 +12,7 @@ import {
 } from '../stores/selectors'
 import JupiterForm from '../components/JupiterForm'
 import { zeroKey } from '@blockworks-foundation/mango-client'
+import { useTranslation } from 'next-i18next'
 
 export async function getStaticProps({ locale }) {
   return {
@@ -24,7 +24,7 @@ export async function getStaticProps({ locale }) {
 }
 
 export default function Swap() {
-  // const { t } = useTranslation(['common', 'swap'])
+  const { t } = useTranslation(['common', 'swap'])
   const connection = useMangoStore(connectionSelector)
   const connected = useMangoStore(walletConnectedSelector)
   const wallet = useMangoStore(walletSelector)
@@ -58,11 +58,11 @@ export default function Swap() {
                 <h1
                   className={`mb-1.5 md:mb-0 text-th-fgd-1 text-2xl font-semibold`}
                 >
-                  Swap
+                  {t('swap')}
                 </h1>
                 <div className="flex flex-col md:items-end">
                   <p className="mb-0 text-xs">
-                    Swap between 100s of tokens at the best rates.
+                    {t('swap:swap-between-hundreds')}
                   </p>
                   <a
                     className="mb-0 text-th-fgd-2 text-xs"
diff --git a/public/locales/en/common.json b/public/locales/en/common.json
index 3f4fae32..8ce80b9e 100644
--- a/public/locales/en/common.json
+++ b/public/locales/en/common.json
@@ -121,6 +121,7 @@
   "enter-name": "Enter an account name",
   "equity": "Equity",
   "est-period-end": "Est Period End",
+  "est-slippage": "Est. Slippage",
   "estimated-liq-price": "Est. Liq. Price",
   "explorer": "Explorer",
   "export-data": "Export CSV",
@@ -214,11 +215,11 @@
   "name-your-account": "Name Your Account",
   "net": "Net",
   "net-balance": "Net Balance",
-  "new": "New",
-  "new-alert": "New Alert",
   "net-interest-value": "Net Interest Value",
   "net-interest-value-desc": "Calculated at the time it was earned/paid. This might be useful at tax time.",
+  "new": "New",
   "new-account": "New",
+  "new-alert": "New Alert",
   "next": "Next",
   "no-account-found": "No Account Found",
   "no-address": "No {{tokenSymbol}} wallet address found",
@@ -308,7 +309,6 @@
   "show-zero": "Show zero balances",
   "side": "Side",
   "size": "Size",
-  "slippage": "Est. Slippage",
   "spanish": "Español",
   "spread": "Spread",
   "stats": "Stats",
diff --git a/public/locales/en/swap.json b/public/locales/en/swap.json
index 5fc60f29..d7516e61 100644
--- a/public/locales/en/swap.json
+++ b/public/locales/en/swap.json
@@ -32,6 +32,9 @@
   "serum-details": "{{cost}} SOL for {{count}} Serum OpenOrders Account",
   "serum-details_plural": "{{cost}} SOL for {{count}} Serum OpenOrders Accounts",
   "serum-requires-openorders": "Serum requires an OpenOrders account for each token. You can close the account and recover the SOL later.",
+  "slippage": "Slippage",
+  "slippage-settings": "Slippage Settings",
+  "swap-between-hundreds": "Swap between 100s of tokens at the best rates.",
   "swap-details": "Swap Details",
   "swap-fee": "Swap Fee",
   "swap-in-wallet": "Swaps interact directly with your connected wallet, not your Mango Account.",
diff --git a/public/locales/es/common.json b/public/locales/es/common.json
index 65b39c0e..f2ddfbfa 100644
--- a/public/locales/es/common.json
+++ b/public/locales/es/common.json
@@ -120,6 +120,7 @@
   "enter-name": "Ingrese un nombre de cuenta",
   "equity": "Capital",
   "est-period-end": "Est Period End",
+  "est-slippage": "Deslizamiento estimado",
   "estimated-liq-price": "Est. Liq. Price",
   "explorer": "Explorador",
   "export-data": "Export CSV",
@@ -212,11 +213,11 @@
   "name-your-account": "Nombra tu cuenta",
   "net": "Neto",
   "net-balance": "Balance neto",
-  "new": "Nuevo",
-  "new-alert": "New Alert",
   "net-interest-value": "Valor de interés neto",
   "net-interest-value-desc": "Calculado en el momento en que se ganó / pagó. Esto podría ser útil al momento de impuestos.",
+  "new": "Nuevo",
   "new-account": "Nuevo",
+  "new-alert": "New Alert",
   "next": "Próximo",
   "no-account-found": "No Account Found",
   "no-address": "No ${tokenSymbol} dirección de billetera encontrada",
@@ -306,7 +307,6 @@
   "show-zero": "Mostrar saldos cero",
   "side": "Lado",
   "size": "Tamaño",
-  "slippage": "Deslizamiento estimado",
   "spanish": "Español",
   "spread": "Propago",
   "stats": "Estadisticas",
diff --git a/public/locales/es/swap.json b/public/locales/es/swap.json
index ae7ef94a..64139d05 100644
--- a/public/locales/es/swap.json
+++ b/public/locales/es/swap.json
@@ -32,6 +32,9 @@
   "serum-details": "{{cost}} SOL for {{count}} Serum OpenOrders Account",
   "serum-details_plural": "{{cost}} SOL for {{count}} Serum OpenOrders Accounts",
   "serum-requires-openorders": "Serum requires an OpenOrders account for each token. You can close the account and recover the SOL later.",
+  "slippage": "Slippage",
+  "slippage-settings": "Slippage Settings",
+  "swap-between-hundreds": "Swap between 100s of tokens at the best rates.",
   "swap-details": "Swap Details",
   "swap-fee": "Swap Fee",
   "swap-in-wallet": "Swaps interact directly with your connected wallet, not your Mango Account.",
diff --git a/public/locales/zh/common.json b/public/locales/zh/common.json
index 9c530229..bab6f8f1 100644
--- a/public/locales/zh/common.json
+++ b/public/locales/zh/common.json
@@ -120,6 +120,7 @@
     "enter-name": "输入帐户标签",
     "equity": "余额",
     "est-period-end": "预计期末时间",
+    "est-slippage": "预计下滑",
     "estimated-liq-price": "预计清算价格",
     "explorer": "浏览器",
     "export-data": "Export CSV",
@@ -212,11 +213,11 @@
     "name-your-account": "给帐户标签",
     "net": "净",
     "net-balance": "净余额",
-    "new": "新子帐户",
-    "new-alert": "创建警报",
     "net-interest-value": "Net Interest Value",
     "net-interest-value-desc": "Calculated at the time it was earned/paid. This might be useful at tax time.",
+    "new": "新子帐户",
     "new-account": "新子帐户",
+    "new-alert": "创建警报",
     "next": "前往",
     "no-account-found": "您没有帐户",
     "no-address": "没有{{tokenSymbol}}钱包地址",
@@ -306,7 +307,6 @@
     "show-zero": "显示零余额",
     "side": "方向",
     "size": "数量",
-    "slippage": "预计下滑",
     "spanish": "Español",
     "spread": "点差",
     "stats": "统计",
diff --git a/public/locales/zh/swap.json b/public/locales/zh/swap.json
index 3708008a..fbaf793c 100644
--- a/public/locales/zh/swap.json
+++ b/public/locales/zh/swap.json
@@ -32,6 +32,9 @@
   "serum-details": "{{cost}} SOL为 {{count}} Serum OpenOrders帐户",
   "serum-details_plural": "{{cost}} SOL为 {{count}} Serum OpenOrders帐户",
   "serum-requires-openorders": "Serum要求每个币种有一个OpenOrders帐户。以后可以关闭帐户二恢复SOL押金。",
+  "slippage": "滑点",
+  "slippage-settings": "滑点设定",
+  "swap-between-hundreds": "以最好价格来换几百个币种。",
   "swap-details": "换币细节",
   "swap-fee": "换币费用",
   "swap-in-wallet": "换币会在您被连结的钱包中进行而不在您的Mango帐户中。",
diff --git a/public/locales/zh_tw/common.json b/public/locales/zh_tw/common.json
index 7975f908..fa7dbbe9 100644
--- a/public/locales/zh_tw/common.json
+++ b/public/locales/zh_tw/common.json
@@ -120,6 +120,7 @@
   "enter-name": "輸入帳戶標籤",
   "equity": "餘額",
   "est-period-end": "預計期末時間",
+  "est-slippage": "預計下滑",
   "estimated-liq-price": "預計清算價格",
   "explorer": "瀏覽器",
   "export-data": "Export CSV",
@@ -212,11 +213,11 @@
   "name-your-account": "給帳戶標籤",
   "net": "淨",
   "net-balance": "淨餘額",
-  "new": "新子帳戶",
-  "new-alert": "創建警報",
   "net-interest-value": "Net Interest Value",
   "net-interest-value-desc": "Calculated at the time it was earned/paid. This might be useful at tax time.",
+  "new": "新子帳戶",
   "new-account": "新子帳戶",
+  "new-alert": "創建警報",
   "next": "前往",
   "no-account-found": "您沒有帳戶",
   "no-address": "沒有{{tokenSymbol}}錢包地址",
@@ -306,7 +307,6 @@
   "show-zero": "顯示零餘額",
   "side": "方向",
   "size": "數量",
-  "slippage": "預計下滑",
   "spanish": "Español",
   "spread": "點差",
   "stats": "統計",
diff --git a/public/locales/zh_tw/swap.json b/public/locales/zh_tw/swap.json
index 8cf603fb..b7bae21c 100644
--- a/public/locales/zh_tw/swap.json
+++ b/public/locales/zh_tw/swap.json
@@ -32,6 +32,9 @@
   "serum-details": "{{cost}} SOL為 {{count}} Serum OpenOrders帳戶",
   "serum-details_plural": "{{cost}} SOL為 {{count}} Serum OpenOrders帳戶",
   "serum-requires-openorders": "Serum要求每個幣種有一個OpenOrders帳戶。以後可以關閉帳戶二恢復SOL押金。",
+  "slippage": "滑點",
+  "slippage-settings": "滑點設定",
+  "swap-between-hundreds": "以最好價格來換幾百個幣種。",
   "swap-details": "換幣細節",
   "swap-fee": "換幣費用",
   "swap-in-wallet": "換幣會在您被連結的錢包中進行而不在您的Mango帳戶中。",