[Feat][Lixi] Fix bug router

aura-nw · Jan 20, 2025 · 059df05 · 059df05
1 parent 00257e4
commit 059df05
Show file tree

Hide file tree

Showing 9 changed files with 36 additions and 87 deletions.
diff --git a/...pages/events/li-xi/comming-soon/index.tsx → src/pages/events/li-xi/coming-soon/index.tsx b/...pages/events/li-xi/comming-soon/index.tsx → src/pages/events/li-xi/coming-soon/index.tsx
@@ -1,7 +1,7 @@
 import HeadComponent from "components/Head";
 import { serverSideTranslations } from "next-i18next/serverSideTranslations";
 import Layout from "components/Layout";
-import KaiaIsland from "./page";
+import ComingSoon from "./page";
 
 export default function Page(props) {
   if (props.justHead || props.pageProps?.justHead) {
@@ -10,7 +10,7 @@ export default function Page(props) {
   return (
     <>
       <HeadComponent data={props.pageProps?.metadata || props.metadata} />
-      <KaiaIsland />
+      <ComingSoon />
     </>
   );
 }

diff --git a/src/pages/events/li-xi/comming-soon/page.tsx → src/pages/events/li-xi/coming-soon/page.tsx b/src/pages/events/li-xi/comming-soon/page.tsx → src/pages/events/li-xi/coming-soon/page.tsx
@@ -1,20 +1,15 @@
-import BannerMobile from "components/pages/event/kaia-island/assets/mobile-banner.png";
-import BannerMobileVN from "components/pages/event/kaia-island/assets/mobile-banner-vn.png";
 import LIXI from "../assets/LIXI.png";
 import Year from "../assets/2025.png";
 import Mai from "../assets/mai.png";
 import lixi1 from "../assets/lixi1.png";
 import podium from "../assets/podium.png";
 import star_bg from "../assets/star_bg.png";
-import moment from "moment";
 import Image from "next/image";
-import Link from "next/link";
 import { useRouter } from "next/router";
-import { useState } from "react";
 import { useTranslation } from "react-i18next";
-import useSWR from "swr";
 import CountdownTimer from "../components/CountdownTimer";
-export default function Lixi() {
+
+export default function ComingSoon() {
   const { locale } = useRouter();
   const { t } = useTranslation();
 

diff --git a/src/pages/events/li-xi/enroll/index.tsx b/src/pages/events/li-xi/enroll/index.tsx
@@ -1,7 +1,7 @@
 import HeadComponent from "components/Head";
 import { serverSideTranslations } from "next-i18next/serverSideTranslations";
 import Layout from "components/Layout";
-import KaiaIsland from "./page";
+import Enroll from "./page";
 
 export default function Page(props) {
   if (props.justHead || props.pageProps?.justHead) {
@@ -10,7 +10,7 @@ export default function Page(props) {
   return (
     <>
       <HeadComponent data={props.pageProps?.metadata || props.metadata} />
-      <KaiaIsland />
+      <Enroll />
     </>
   );
 }

diff --git a/src/pages/events/li-xi/enroll/page.tsx b/src/pages/events/li-xi/enroll/page.tsx
@@ -17,12 +17,12 @@ import TextField from "components/Input/TextField";
 import useSWR from "swr";
 import { eventService } from "src/services/eventService";
 import { toast } from "react-toastify";
-export default function Lixi() {
+
+export default function Enroll() {
   const { account } = useContext(Context);
   const { setSignInOpen } = useContext(ModalContext);
   const [fortuneNumber, setFortuneNumber] = useState("");
-  const { locale } = useRouter();
-  const router = useRouter();
+  const { locale, replace } = useRouter();
   const { t } = useTranslation();
 
   const { data, mutate, isLoading } = useSWR(
@@ -40,7 +40,7 @@ export default function Lixi() {
             hideProgressBar: true,
             autoClose: 3000,
           });
-          router.push("/events/li-xi");
+          replace("/events/li-xi");
         }
         toast("User already applied fortune number", {
           type: "error",
@@ -75,7 +75,7 @@ export default function Lixi() {
     }
   );
   if (!fetchingStatus && referralStatus) {
-    router.push("/events/li-xi");
+    replace("/events/li-xi");
     return;
   }
   return (

diff --git a/src/pages/events/li-xi/index.tsx b/src/pages/events/li-xi/index.tsx
@@ -1,7 +1,7 @@
 import HeadComponent from "components/Head";
 import { serverSideTranslations } from "next-i18next/serverSideTranslations";
 import Layout from "components/Layout";
-import KaiaIsland from "./page";
+import Lixi from "./page";
 
 export default function Page(props) {
   if (props.justHead || props.pageProps?.justHead) {
@@ -10,7 +10,7 @@ export default function Page(props) {
   return (
     <>
       <HeadComponent data={props.pageProps?.metadata || props.metadata} />
-      <KaiaIsland />
+      <Lixi />
     </>
   );
 }

diff --git a/src/pages/events/li-xi/my-prize/index.tsx b/src/pages/events/li-xi/my-prize/index.tsx
@@ -1,7 +1,7 @@
 import HeadComponent from "components/Head";
 import { serverSideTranslations } from "next-i18next/serverSideTranslations";
 import Layout from "components/Layout";
-import KaiaIsland from "./page";
+import MyPrize from "./page";
 
 export default function Page(props) {
   if (props.justHead || props.pageProps?.justHead) {
@@ -10,7 +10,7 @@ export default function Page(props) {
   return (
     <>
       <HeadComponent data={props.pageProps?.metadata || props.metadata} />
-      <KaiaIsland />
+      <MyPrize />
     </>
   );
 }

diff --git a/src/pages/events/li-xi/my-prize/page.tsx b/src/pages/events/li-xi/my-prize/page.tsx
@@ -1,36 +1,13 @@
-import BannerMobile from "components/pages/event/kaia-island/assets/mobile-banner.png";
-import BannerMobileVN from "components/pages/event/kaia-island/assets/mobile-banner-vn.png";
-import LIXI from "../assets/LIXI.png";
-import Year from "../assets/2025.png";
-import Snake from "../assets/snake1.png";
-import podium from "../assets/podium.png";
-import lixi_do from "../assets/lixi_do.png";
-import lixi_xanh from "../assets/lixi_xanh.png";
-import lixi_vang from "../assets/lixi_vang.png";
 import info from "../assets/svg/info.svg";
-import gold_medal from "../assets/svg/gold_medal.svg";
-import silver_medal from "../assets/svg/silver_medal.svg";
-import bronze_medal from "../assets/svg/bronze_medal.svg";
 import star_bg from "../assets/star_bg.png";
 import den_long from "../assets/den_long.png";
 import cane from "../assets/cane.png";
-import moment from "moment";
 import Image from "next/image";
-import Link from "next/link";
 import { useRouter } from "next/router";
-import { useContext, useState } from "react";
+import { useContext, useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
-import useSWR from "swr";
 import { Context } from "src/context";
 import { ModalContext } from "src/context/modals";
-import EventButton from "../components/EventButton";
-import { ArrowRightIcon } from "@heroicons/react/24/outline";
-import TextField from "components/Input/TextField";
-import Copy2Clipboard from "components/Copy2Clipboard";
-
-import ic_check from "../assets/svg/checked.svg";
-import ic_copy from "../assets/svg/copy.svg";
-
 import VND from "../assets/svg/vnd.svg";
 import AURA from "../assets/svg/aura.svg";
 import DP from "../assets/svg/dp.svg";
@@ -44,15 +21,8 @@ import {
   TableRow,
   Tooltip,
 } from "@mui/material";
-import { eventService } from "src/services/eventService";
 import ClaimDialogs from "../components/ClaimDialog";
 
-const BulletPoint = ({ className }: { className?: string }) => (
-  <div
-    className={`${className} w-[10px] h-[10px]  rotate-45 rounded-sm bg-[#F0C865]`}
-  ></div>
-);
-
 const StyledTableCell = styled(TableCell)(({ theme }) => ({
   "&.MuiTableCell-head": {
     backgroundColor: "transparent",
@@ -92,19 +62,6 @@ const StyledTable = styled(Table)({
   width: "100%",
 });
 
-const data = [
-  { rank: 1, participant: "John Doe", points: 100 },
-  { rank: 2, participant: "Jane Doe", points: 90 },
-  { rank: 3, participant: "Alice Smith", points: 80 },
-  { rank: 4, participant: "Bob Johnson", points: 70 },
-  { rank: 5, participant: "Charlie Brown", points: 60 },
-  { rank: 6, participant: "David Wilson", points: 50 },
-  { rank: 7, participant: "Eva Davis", points: 40 },
-  { rank: 8, participant: "Frank Miller", points: 30 },
-  { rank: 9, participant: "Grace Lee", points: 20 },
-  { rank: 10, participant: "Hannah White", points: 10 },
-];
-
 export interface FortuneNumber {
   id: number;
   code: string;
@@ -133,13 +90,20 @@ export interface UserLixi {
   };
 }
 
-export default function Lixi() {
+export default function MyPrize() {
   const { account } = useContext(Context);
   const { setSignInOpen } = useContext(ModalContext);
-  const { locale } = useRouter();
+  const [fortuneNumber, setFortuneNumber] = useState("");
   const router = useRouter();
   const { t } = useTranslation();
 
+  useEffect(() => {
+    if (!account) {
+      router.push("/events/li-xi/enroll");
+      return;
+    }
+  }, []);
+
   const columns = [
     { id: "rank", label: t("Rank"), minWidth: 60 },
     { id: "participant", label: t("Participant"), minWidth: 100 },
@@ -212,10 +176,6 @@ export default function Lixi() {
       amount: 80,
     },
   ];
-  if (!account) {
-    router.push("/events/li-xi/enroll");
-    return;
-  }
 
   return (
     <div

diff --git a/src/pages/events/li-xi/page.tsx b/src/pages/events/li-xi/page.tsx
@@ -1,7 +1,3 @@
-import BannerMobile from "components/pages/event/kaia-island/assets/mobile-banner.png";
-import BannerMobileVN from "components/pages/event/kaia-island/assets/mobile-banner-vn.png";
-import LIXI from "./assets/LIXI.png";
-import Year from "./assets/2025.png";
 import Snake from "./assets/snake1.png";
 import podium from "./assets/podium.png";
 import lixi_do from "./assets/lixi_do.png";
@@ -14,19 +10,14 @@ import bronze_medal from "./assets/svg/bronze_medal.svg";
 import star_bg from "./assets/star_bg.png";
 import den_long from "./assets/den_long.png";
 import cane from "./assets/cane.png";
-import moment from "moment";
 import Image from "next/image";
-import Link from "next/link";
 import { useRouter } from "next/router";
-import { useContext, useState } from "react";
+import { useContext, useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import useSWR from "swr";
-import CountdownTimer from "./components/CountdownTimer";
 import { Context } from "src/context";
 import { ModalContext } from "src/context/modals";
 import EventButton from "./components/EventButton";
-import { ArrowRightIcon } from "@heroicons/react/24/outline";
-import TextField from "components/Input/TextField";
 import Copy2Clipboard from "components/Copy2Clipboard";
 
 import ic_check from "./assets/svg/checked.svg";
@@ -134,8 +125,8 @@ export interface UserLixi {
 export default function Lixi() {
   const { account } = useContext(Context);
   const { setSignInOpen } = useContext(ModalContext);
-  const { locale } = useRouter();
   const router = useRouter();
+
   const { t } = useTranslation();
   const [selectedLixi, setSelectedLixi] = useState<string | undefined>();
 
@@ -189,10 +180,13 @@ export default function Lixi() {
       align: "right",
     },
   ];
-  if (!account) {
-    router.push("/events/li-xi/enroll");
-    return;
-  }
+
+  useEffect(() => {
+    if (!account) {
+      router.push("/events/li-xi/enroll");
+      return;
+    }
+  }, []);
   return (
     <div
       style={{

diff --git a/src/pages/events/page.tsx b/src/pages/events/page.tsx
@@ -21,12 +21,12 @@ const events = [
     en: {
       image: star_bg,
       title: `Li Xi`,
-      subtitle: `03 Jun 2024 - 30 Jun 2024`,
+      subtitle: `31 Jun 2025 - Feb 2025`,
     },
     vn: {
       image: star_bg,
       title: `Lì Xì`,
-      subtitle: `03/06/2024 - 30/06/2024`,
+      subtitle: `31 Jun 2025 - Feb 2025`,
     },
   },
   {