diff --git a/app/[locale]/layout.tsx b/app/[locale]/layout.tsx index 904a361d0..ddca055b9 100644 --- a/app/[locale]/layout.tsx +++ b/app/[locale]/layout.tsx @@ -7,8 +7,10 @@ import HolyLoader from 'holy-loader'; import { QueryProvider } from 'lib/hooks/QueryProvider'; import { EthereumProvider } from 'lib/hooks/ethereum/EthereumProvider'; import { ColorThemeProvider } from 'lib/hooks/useColorTheme'; +import NextIntlClientProvider from 'lib/i18n/NextIntlClientProvider'; import { locales } from 'lib/i18n/config'; import { Metadata } from 'next'; +import { useMessages } from 'next-intl'; import { getTranslations, unstable_setRequestLocale } from 'next-intl/server'; import 'react-lite-youtube-embed/dist/LiteYouTubeEmbed.css'; import 'react-toastify/dist/ReactToastify.css'; @@ -53,27 +55,31 @@ export const generateMetadata = async ({ params: { locale } }): Promise { unstable_setRequestLocale(params.locale); + const messages = useMessages(); + return ( - - - -
-
-
{children}
-
-
+ + + + +
+
+
{children}
+
+
+
-
- - - - - + + + + + + diff --git a/app/[locale]/learn/wallets/add-network/[slug]/page.tsx b/app/[locale]/learn/wallets/add-network/[slug]/page.tsx index 466495713..a93c29c03 100644 --- a/app/[locale]/learn/wallets/add-network/[slug]/page.tsx +++ b/app/[locale]/learn/wallets/add-network/[slug]/page.tsx @@ -63,9 +63,7 @@ const AddNewChainPage: NextPage = async ({ params }) => {

{t('learn.add_network.select_network')}

- - - +
diff --git a/app/[locale]/not-found.tsx b/app/[locale]/not-found.tsx index a95a5d2e2..b07fa723a 100644 --- a/app/[locale]/not-found.tsx +++ b/app/[locale]/not-found.tsx @@ -2,9 +2,8 @@ import { GlobeEuropeAfricaIcon, QuestionMarkCircleIcon } from '@heroicons/react/ import ContentPageLayout from 'app/layouts/ContentPageLayout'; import Href from 'components/common/Href'; import NotFoundLink from 'components/common/NotFoundLink'; -import NextIntlClientProvider from 'lib/i18n/NextIntlClientProvider'; import { NextPage } from 'next'; -import { useMessages, useTranslations } from 'next-intl'; +import { useTranslations } from 'next-intl'; import NotFoundLinkMyApprovals from './NotFoundLinkMyApprovals'; interface Props { @@ -18,7 +17,6 @@ const NotFoundPage: NextPage = ({ params }) => { // unstable_setRequestLocale(params.locale); const t = useTranslations(); - const messages = useMessages(); return ( @@ -45,9 +43,7 @@ const NotFoundPage: NextPage = ({ params }) => { description={t('common.errors.404.suggested_pages.extension.description')} icon={} /> - - - +

diff --git a/app/[locale]/token-approval-checker/[slug]/page.tsx b/app/[locale]/token-approval-checker/[slug]/page.tsx index 630de8401..6ed4a667f 100644 --- a/app/[locale]/token-approval-checker/[slug]/page.tsx +++ b/app/[locale]/token-approval-checker/[slug]/page.tsx @@ -2,7 +2,6 @@ import ChainDescription from 'components/common/ChainDescription'; import ChainLogo from 'components/common/ChainLogo'; import Href from 'components/common/Href'; import Prose from 'components/common/Prose'; -import NextIntlClientProvider from 'lib/i18n/NextIntlClientProvider'; import { locales } from 'lib/i18n/config'; import { SUPPORTED_CHAINS, getChainIdFromSlug, getChainName, getChainSlug } from 'lib/utils/chains'; import { Metadata, NextPage } from 'next'; @@ -58,9 +57,7 @@ const TokenApprovalCheckerPage: NextPage = ({ params }) => {

{t('token_approval_checker.different_chain')}:

- - - +
diff --git a/components/common/transaction-submitted-toast.tsx b/components/common/TransactionSubmittedToast.tsx similarity index 65% rename from components/common/transaction-submitted-toast.tsx rename to components/common/TransactionSubmittedToast.tsx index 6967e2954..f490f2d7d 100644 --- a/components/common/transaction-submitted-toast.tsx +++ b/components/common/TransactionSubmittedToast.tsx @@ -1,20 +1,23 @@ import { ArrowTopRightOnSquareIcon } from '@heroicons/react/24/outline'; import DonateButton from 'components/common/DonateButton'; import { getChainExplorerUrl } from 'lib/utils/chains'; -import { getTranslations } from 'next-intl/server'; +import { useTranslations } from 'next-intl'; import type { MutableRefObject, ReactText } from 'react'; import { toast } from 'react-toastify'; import Href from './Href'; -export const displayTransactionSubmittedToast = ( - chainId: number, - transactionHash: string, - ref: MutableRefObject, - t: Awaited>>, -) => { +interface Props { + chainId: number; + transactionHash: string; + ref: MutableRefObject; +} + +const TransactionSubmittedToast = ({ chainId, transactionHash, ref }: Props) => { + const t = useTranslations(); + const explorerUrl = getChainExplorerUrl(chainId); - const toastContent = ( + return (
{t('common.toasts.transaction_submitted')}
@@ -27,8 +30,19 @@ export const displayTransactionSubmittedToast = (
); +}; - ref.current = toast.info(toastContent, { - closeOnClick: false, - }); +export default TransactionSubmittedToast; + +export const displayTransactionSubmittedToast = ( + chainId: number, + transactionHash: string, + ref: MutableRefObject, +) => { + ref.current = toast.info( + , + { + closeOnClick: false, + }, + ); }; diff --git a/components/footer/Footer.tsx b/components/footer/Footer.tsx index 246f672de..dab903446 100644 --- a/components/footer/Footer.tsx +++ b/components/footer/Footer.tsx @@ -2,7 +2,6 @@ import Divider from 'components/common/Divider'; import Href from 'components/common/Href'; import ColorThemeSelect from 'components/footer/ColorThemeSelect'; import { DISCORD_URL, GITHUB_URL, TWITTER_URL } from 'lib/constants'; -import NextIntlClientProvider from 'lib/i18n/NextIntlClientProvider'; import { useMessages, useTranslations } from 'next-intl'; import { ReactNode } from 'react'; import LanguageSelect from './LanguageSelect'; @@ -12,81 +11,79 @@ const Footer = () => { const messages = useMessages(); return ( - -
- +
+ -
-
-
- - - {t('common.footer.token_approval_checker')} - - - {t('common.footer.extension')} - - - {t('common.footer.exploit_checker')} - - - - - {t('common.footer.knowledgebase')} - - - {t('common.footer.what_are_token_approvals')} - - - {t('common.footer.faq')} - - -
-
- - - {t('common.footer.blog')} - - - {t('common.footer.about')} - - - {t('common.footer.brand_assets')} - - - - - Twitter - - - Discord - - - GitHub - - -
+
+
+
+ + + {t('common.footer.token_approval_checker')} + + + {t('common.footer.extension')} + + + {t('common.footer.exploit_checker')} + + + + + {t('common.footer.knowledgebase')} + + + {t('common.footer.what_are_token_approvals')} + + + {t('common.footer.faq')} + +
- -
-
-

© 2023 Revoke.cash

-
    - {t('common.footer.privacy')} - • - {t('common.footer.terms')} -
-
-
- - -
+
+ + + {t('common.footer.blog')} + + + {t('common.footer.about')} + + + {t('common.footer.brand_assets')} + + + + + Twitter + + + Discord + + + GitHub + +
-
- + +
+
+

© 2023 Revoke.cash

+
    + {t('common.footer.privacy')} + • + {t('common.footer.terms')} +
+
+
+ + +
+
+ +
); }; diff --git a/components/header/Header.tsx b/components/header/Header.tsx index a16f07f44..a39b0aa9a 100644 --- a/components/header/Header.tsx +++ b/components/header/Header.tsx @@ -1,6 +1,5 @@ import Href from 'components/common/Href'; import WalletIndicator from 'components/header/WalletIndicator'; -import NextIntlClientProvider from 'lib/i18n/NextIntlClientProvider'; import { useMessages, useTranslations } from 'next-intl'; import Image from 'next/image'; import DonateButton from '../common/DonateButton'; @@ -13,37 +12,35 @@ const Header = () => { const messages = useMessages(); return ( - -
-
-
- - - - -
-
- - Revoke.cash logo - -
-
- -
-
- -
+
+
+
+ + + +
-
- +
+ + Revoke.cash logo + +
+
+ +
+
+ +
+
+
); }; diff --git a/components/header/HeaderAttachedSearchBar.tsx b/components/header/HeaderAttachedSearchBar.tsx index 39546680b..99fc1df72 100644 --- a/components/header/HeaderAttachedSearchBar.tsx +++ b/components/header/HeaderAttachedSearchBar.tsx @@ -1,4 +1,3 @@ -import NextIntlClientProvider from 'lib/i18n/NextIntlClientProvider'; import { useMessages } from 'next-intl'; import SearchBar from './SearchBar'; @@ -11,13 +10,11 @@ const HeaderAttachedSearchBar = ({ render = true }: Props) => { if (!render) return null; + // We add a negative margin so the SearchBar is grouped with the header return ( - - {/* We add a negative margin so the SearchBar is grouped with the header */} -
- -
- +
+ +
); }; diff --git a/lib/hooks/ethereum/useHandleTransaction.tsx b/lib/hooks/ethereum/useHandleTransaction.tsx index 3e0a01713..45b8ea735 100644 --- a/lib/hooks/ethereum/useHandleTransaction.tsx +++ b/lib/hooks/ethereum/useHandleTransaction.tsx @@ -1,4 +1,4 @@ -import { displayTransactionSubmittedToast } from 'components/common/transaction-submitted-toast'; +import { displayTransactionSubmittedToast } from 'components/common/TransactionSubmittedToast'; import { TransactionType } from 'lib/interfaces'; import { isRevertedError, isUserRejectionError, parseErrorMessage } from 'lib/utils/errors'; import { useTranslations } from 'next-intl'; @@ -43,7 +43,7 @@ export const useHandleTransaction = (chainId: number) => { const transactionHash = await transactionPromise; if (transactionHash) { - displayTransactionSubmittedToast(chainId, transactionHash, toastRef, t); + displayTransactionSubmittedToast(chainId, transactionHash, toastRef); } return transactionHash;