feat(ui-ux): add explore dex page hero banner (#560)

* feat(ui-ux): add explore dex page hero banner

* fix missing translation

* fix index of explore headers

Author: veralygit

public/locales/en-US/page-explore-dex.json

@@ -0,0 +1,7 @@
+{
+  "heroBanner": {
+    "title": "DECENTRALIZED EXCHANGE",
+    "subtitle": "Enter the world of dTokens",
+    "desc": "Inside DeFiChain’s DEX, you are in full control. Trade, Arbitrage, and Earn from your dTokens."
+  }
+}

src/layouts/components/Explore.tsx

@@ -23,20 +23,20 @@ export function Explore() {
         {
           icon: "dex",
           href: "/explore/dex",
-          title: entries[2].title,
-          subtitle: entries[2].subtitle,
+          title: entries[1].title,
+          subtitle: entries[1].subtitle,
         },
         {
           icon: "wallet",
           href: "/explore/wallets",
-          title: entries[3].title,
-          subtitle: entries[3].subtitle,
+          title: entries[2].title,
+          subtitle: entries[2].subtitle,
         },
         {
           icon: "masternode",
           href: "/explore/masternodes",
-          title: entries[4].title,
-          subtitle: entries[4].subtitle,
+          title: entries[3].title,
+          subtitle: entries[3].subtitle,
         },
       ],
     },

src/pages/explore/dex/index.page.tsx

@@ -0,0 +1,31 @@
+import { SSRConfig, useTranslation } from "next-i18next";
+import { serverSideTranslations } from "next-i18next/serverSideTranslations";
+import { HeroBanner, HeroBannerBg } from "@components/commons/HeroBanner";
+
+export default function ExploreWallets() {
+  const { t } = useTranslation("page-explore-dex");
+  return (
+    <HeroBanner
+      title={t("heroBanner.title")}
+      subtitle={t("heroBanner.subtitle")}
+      desc={t("heroBanner.desc")}
+      heroBg={HeroBannerBg.DIAMOND_COIN}
+      hasStartExploringButton
+      startExploringJumpLink=""
+    />
+  );
+}
+
+export async function getStaticProps({
+  locale,
+}): Promise<{ props: SSRConfig }> {
+  return {
+    props: {
+      ...(await serverSideTranslations(locale, [
+        "common",
+        "layout",
+        "page-explore-dex",
+      ])),
+    },
+  };
+}