chore: add upgrade fixes

forbole · Nov 17, 2023 · 14c75da · 14c75da
1 parent 1bc6600
commit 14c75da
Show file tree

Hide file tree

Showing 33 changed files with 232 additions and 226 deletions.
diff --git a/src/components/Intro_panel/index.tsx b/src/components/Intro_panel/index.tsx
@@ -1,7 +1,7 @@
 import { Stack, Typography, useMediaQuery, useTheme } from "@mui/material";
 import Box from "@mui/material/Box";
 import type { StaticImageData } from "next/image";
-import Image from "next/image";
+import Image from "next/legacy/image";
 
 import CtaButton from "../cta-button";
 

diff --git a/src/components/footer/components/footer_items/index.tsx b/src/components/footer/components/footer_items/index.tsx
@@ -71,10 +71,8 @@ const FooterItems = ({ staking }: FooterProps) => {
           }}
           variant="middle"
         />
-        <Link href="/terms-and-conditions" passHref>
-          <Typography component="a" css={styles.word}>
-            {t("tnc")}
-          </Typography>
+        <Link css={styles.word} href="/terms-and-conditions">
+          <Typography component="span">{t("tnc")}</Typography>
         </Link>
         <Divider
           flexItem
@@ -90,10 +88,8 @@ const FooterItems = ({ staking }: FooterProps) => {
           }}
           variant="middle"
         />
-        <Link href="/privacy-policy" passHref>
-          <Typography component="a" css={styles.word}>
-            {t("policy")}
-          </Typography>
+        <Link css={styles.word} href="/privacy-policy">
+          <Typography component="span">{t("policy")}</Typography>
         </Link>
       </Box>
 
@@ -118,12 +114,10 @@ const FooterItems = ({ staking }: FooterProps) => {
           }}
         >
           <Link
+            css={styles.word}
             href="https://drive.google.com/drive/folders/1w93woI10nRmH3ei6rfFQm4eZxyvk_4-2"
-            passHref
           >
-            <Typography component="a" css={styles.word}>
-              {t("brand guide")}
-            </Typography>
+            <Typography component="span">{t("brand guide")}</Typography>
           </Link>
           <Divider
             flexItem
@@ -139,10 +133,8 @@ const FooterItems = ({ staking }: FooterProps) => {
             }}
             variant="middle"
           />
-          <Link href="/blog" passHref>
-            <Typography component="a" css={styles.word}>
-              {t("blog")}
-            </Typography>
+          <Link css={styles.word} href="/blog">
+            <Typography component="span">{t("blog")}</Typography>
           </Link>
         </Box>
       </Box>

diff --git a/src/components/footer/index.tsx b/src/components/footer/index.tsx
@@ -1,6 +1,6 @@
 import { Box, Container, Stack, Typography, useTheme } from "@mui/material";
 import useTranslation from "next-translate/useTranslation";
-import Image from "next/image";
+import Image from "next/legacy/image";
 import Link from "next/link";
 
 import { useWindowDimensions } from "@src/hooks";
@@ -87,19 +87,17 @@ const Footer = ({ red, itemColor }: FooterProps) => {
             >
               together today
             </Typography>
-            <Link href="/staking" passHref>
-              <a>
-                <CtaButton
-                  sx={{
-                    mt: "24px",
-                    [theme.breakpoints.down("laptop")]: {
-                      mb: "76px",
-                    },
-                  }}
-                >
-                  {t("StakeNow")}
-                </CtaButton>
-              </a>
+            <Link href="/staking">
+              <CtaButton
+                sx={{
+                  mt: "24px",
+                  [theme.breakpoints.down("laptop")]: {
+                    mb: "76px",
+                  },
+                }}
+              >
+                {t("StakeNow")}
+              </CtaButton>
             </Link>
           </Stack>
         </Container>

diff --git a/src/components/guide_nav/index.tsx b/src/components/guide_nav/index.tsx
@@ -77,26 +77,25 @@ const GuideNav = ({ staking }: GuideNavProps) => {
               },
             }}
           >
-            <Link href="/">
-              <a
-                style={{
-                  display: "flex",
-                  alignItems: "center",
-                  height: "100%",
-                }}
-              >
-                {staking ? (
-                  <ForboleShadowIcon />
-                ) : (
-                  <ForboleLogo
-                    color={
-                      theme.palette.mode === "dark"
-                        ? theme.palette.primary.main
-                        : theme.palette.custom.forbole.red
-                    }
-                  />
-                )}
-              </a>
+            <Link
+              href="/"
+              style={{
+                display: "flex",
+                alignItems: "center",
+                height: "100%",
+              }}
+            >
+              {staking ? (
+                <ForboleShadowIcon />
+              ) : (
+                <ForboleLogo
+                  color={
+                    theme.palette.mode === "dark"
+                      ? theme.palette.primary.main
+                      : theme.palette.custom.forbole.red
+                  }
+                />
+              )}
             </Link>
           </Box>
           <Button

diff --git a/src/components/header-card/index.tsx b/src/components/header-card/index.tsx
@@ -1,5 +1,5 @@
 import { Box, Stack, Typography, useTheme } from "@mui/material";
-import Image from "next/image";
+import Image from "next/legacy/image";
 
 type Props = {
   title: string;

diff --git a/src/components/nav/components/company_menu_button/index.tsx b/src/components/nav/components/company_menu_button/index.tsx
@@ -39,9 +39,9 @@ const CompanyMenuButton = () => {
     <List component="div" disablePadding>
       {menuCompanyList?.map((l, i) => (
         <div key={i}>
-          <Link href={l.link} passHref>
+          <Link href={l.link} style={{ textDecoration: "none" }}>
             <MenuItem
-              component="a"
+              component="span"
               sx={{
                 "display": "flex",
                 "filter": l.link ? "" : "opacity(0.1)",
@@ -77,9 +77,9 @@ const CompanyMenuButton = () => {
     >
       {menuCompanyList?.map((l, i) => (
         <div key={i}>
-          <Link href={l.link} passHref>
+          <Link href={l.link} style={{ textDecoration: "none" }}>
             <MenuItem
-              component="a"
+              component="span"
               onClick={handleClose}
               sx={{
                 "display": "flex",

diff --git a/src/components/nav/components/desktop_nav_menu/index.tsx b/src/components/nav/components/desktop_nav_menu/index.tsx
@@ -43,7 +43,8 @@ const DesktopNavMenu = () => {
           key={i}
           className={classes.navItem}
           sx={{
-            "color": "white",
+            "color": theme.palette.common.white,
+            "textDecoration": "none",
             "fontWeight": 600,
             "fontSize": theme.spacing(2),
             "&:hover": {
@@ -54,13 +55,11 @@ const DesktopNavMenu = () => {
             "userSelect": "none",
           }}
         >
-          <Link href={item.link} passHref>
-            <Box
-              component="a"
-              style={{ color: "inherit", textDecoration: "none" }}
-            >
-              {item.display}
-            </Box>
+          <Link
+            href={item.link}
+            style={{ color: "inherit", textDecoration: "none" }}
+          >
+            <Box component="span">{item.display}</Box>
           </Link>
           {i === 0 && (
             <Box className={classes.boxItem}>
@@ -79,10 +78,8 @@ const DesktopNavMenu = () => {
         </Box>
       ))}
       <Box>
-        <Link href="/staking" passHref>
-          <a>
-            <CtaButton>{t("StakeNow")}</CtaButton>
-          </a>
+        <Link href="/staking">
+          <CtaButton>{t("StakeNow")}</CtaButton>
         </Link>
       </Box>
       <Box>

diff --git a/src/components/nav/components/lang_menu_button/index.tsx b/src/components/nav/components/lang_menu_button/index.tsx
@@ -111,9 +111,9 @@ const LangMenuButton = () => {
         >
           {locales?.map((l) => (
             <div key={l}>
-              <Link href={{ pathname, query }} locale={l} passHref>
+              <Link href={{ pathname, query }} locale={l}>
                 <MenuItem
-                  component="a"
+                  component="span"
                   sx={{
                     "display": "flex",
                     "color": theme.palette.custom.forbole.indigo,
@@ -150,9 +150,9 @@ const LangMenuButton = () => {
       >
         {locales?.map((l) => (
           <div key={l} style={{ display: lang !== l ? "block" : "none" }}>
-            <Link href={{ pathname, query }} locale={l} passHref>
+            <Link href={{ pathname, query }} locale={l}>
               <MenuItem
-                component="a"
+                component="span"
                 onClick={handleClose}
                 sx={{
                   "display": "flex",

diff --git a/src/components/nav/components/products_menu_button/index.tsx b/src/components/nav/components/products_menu_button/index.tsx
@@ -48,9 +48,9 @@ const ProductsMenuButton = () => {
     <List component="div" disablePadding>
       {menuProductsList?.map((l, i) => (
         <div key={i}>
-          <Link href={l.link} passHref>
+          <Link href={l.link} style={{ textDecoration: "none" }}>
             <MenuItem
-              component="a"
+              component="span"
               sx={{
                 "display": "flex",
                 "padding": "0px 32px",
@@ -84,9 +84,9 @@ const ProductsMenuButton = () => {
       sx={{ background: "rgba(107, 97, 254, 0.24)" }}
     >
       {menuProductsList?.map((l, i) => (
-        <Link key={i} href={l.link} passHref>
+        <Link key={i} href={l.link} style={{ textDecoration: "none" }}>
           <MenuItem
-            component="a"
+            component="span"
             onClick={handleClose}
             sx={{
               "display": "flex",

diff --git a/src/components/nav/index.tsx b/src/components/nav/index.tsx
@@ -104,21 +104,20 @@ const Nav = ({ staking, stakeNowRef, itemColor }: NavProps) => {
               },
             }}
           >
-            <Link href="/">
-              <a
-                aria-label={t("common:forboleLogo")}
-                style={{
-                  display: "flex",
-                  alignItems: "center",
-                  height: "100%",
-                }}
-              >
-                {staking ? (
-                  <ForboleShadowIcon />
-                ) : (
-                  <ForboleLogo color={itemColor || colors.primary} />
-                )}
-              </a>
+            <Link
+              aria-label={t("common:forboleLogo")}
+              href="/"
+              style={{
+                display: "flex",
+                alignItems: "center",
+                height: "100%",
+              }}
+            >
+              {staking ? (
+                <ForboleShadowIcon />
+              ) : (
+                <ForboleLogo color={itemColor || colors.primary} />
+              )}
             </Link>
           </Box>
           {staking ? (

diff --git a/src/components/scroll_logo/Card.tsx b/src/components/scroll_logo/Card.tsx
@@ -1,6 +1,6 @@
 import type { SxProps, Theme } from "@mui/material";
 import { Box, Typography, useTheme } from "@mui/material";
-import Image from "next/image";
+import Image from "next/legacy/image";
 import SwiperCore, { Autoplay } from "swiper";
 import "swiper/swiper.min.css";
 

diff --git a/src/components/success-modal/index.tsx b/src/components/success-modal/index.tsx
@@ -6,7 +6,7 @@ import {
   useMediaQuery,
   useTheme,
 } from "@mui/material";
-import Image from "next/image";
+import Image from "next/legacy/image";
 import { forwardRef } from "react";
 
 import { Close } from "../icons";

diff --git a/src/components/tags/index.tsx b/src/components/tags/index.tsx
@@ -39,7 +39,7 @@ const Tags = (props: TagsProps) => {
         {tags.map((tag: any) => (
           <Box key={tag.slug} component="li" sx={styles.listCSS}>
             <Link as={`/tag/${tag.slug}`} href="/tag/[tag]">
-              <a>{tag.name}</a>
+              {tag.name}
             </Link>
           </Box>
         ))}

diff --git a/src/screens/about/index.tsx b/src/screens/about/index.tsx
@@ -162,7 +162,8 @@ const About = () => {
                   }}
                 />,
               ]}
-              i18nKey={t("headercard_2nd_desc")}
+              i18nKey="headercard_2nd_desc"
+              ns="about"
             />
           </Stack>
           <Box
@@ -416,7 +417,8 @@ const About = () => {
                   }}
                 />,
               ]}
-              i18nKey={t("section_2nd_large_title")}
+              i18nKey="section_2nd_large_title"
+              ns="about"
             />
 
             <Typography