feat: network change

next.config.mjs

@@ -6,20 +6,28 @@ const nextConfig = {
     return [
       {
         source: "/index/:path*",
-        destination: "http://144.76.97.175:7700/:path*", // Proxy to Backend, token required
-      },
-      {
-        source: "/indexMain/:path*",
-        destination: "http://144.76.97.175:7701/:path*", // Proxy to Backend, token required
+        destination: "http://65.109.69.98:7700/:path*", // Proxy to Backend, token required
       },
+      // {
+      //   source: "/indexMain/:path*",
+      //   destination: "http://65.109.69.98:7701/:path*", // Proxy to Backend, token required
+      // },
+      // {
+      //   source: "/indexBase/:path*",
+      //   destination: "http://65.109.69.98:7702/:path*", // Proxy to Backend, token required
+      // },
       {
         source: "/api/:path*",
-        destination: "http://144.76.97.175:8080/:path*", // Proxy to Backend
-      },
-      {
-        source: "/apiMain/:path*",
-        destination: "http://144.76.97.175:8088/:path*", // Proxy to Backend
+        destination: "http://65.109.69.98:8080/:path*", // Proxy to Backend
       },
+      // {
+      //   source: "/apiMain/:path*",
+      //   destination: "http://65.109.69.98:8088/:path*", // Proxy to Backend
+      // },
+      // {
+      //   source: "/apiBase/:path*",
+      //   destination: "http://65.109.69.98:8089/:path*", // Proxy to Backend
+      // },
     ];
   },
   webpack(config, { isServer }) {

package.json

@@ -29,8 +29,7 @@
     "react": "^18",
     "react-dom": "^18",
     "react-loading-skeleton": "^3.4.0",
-    "swr": "^2.2.5",
-    "valtio": "^1.13.2"
+    "swr": "^2.2.5"
   },
   "devDependencies": {
     "@svgr/webpack": "^8.1.0",
@@ -44,4 +43,4 @@
     "tailwindcss": "^3.4.1",
     "typescript": "^5"
   }
-}
+}

src/components/Cards/SurfaceCards/ClaimCard.tsx

@@ -5,15 +5,14 @@ import { Link } from "@/components/Link";
 import { Skeleton } from "@/components/Skeleton";
 import { CardField } from "../Card";
 import { shortenAddress } from "@/utils";
-import useExplorer from "@/hooks/useExplorer";
+import { EXPLORER_L2 } from "@/utils/env";
 
 type ClaimCardProps = {
   claimData: ClaimData;
 };
 
 const ClaimCard: FC<Partial<ClaimCardProps>> = ({ claimData = {} }) => {
   const { claim, claimant, output_block, event_id } = claimData;
-  const explorer = useExplorer()
   return (
     <SurfaceCardBase>
       <div className="flex justify-between gap-2 text-sm">
@@ -22,7 +21,7 @@ const ClaimCard: FC<Partial<ClaimCardProps>> = ({ claimData = {} }) => {
             <div className="flex gap-1 text-contentSecondary-light dark:text-contentSecondary-dark">
               Block{" "}
               <Link
-                href={`${explorer}/block/${output_block}`}
+                href={`${EXPLORER_L2}/block/${output_block}`}
                 isExternal
               >
                 {output_block}

src/components/Cards/SurfaceCards/CreditCard.tsx

@@ -7,7 +7,7 @@ import { SurfaceCardBase } from "./SurfaceCardBase";
 import { Credit } from "@/types";
 import { shortenAddress } from "@/utils";
 import { EtherUnitDisplay } from "@/components/Displays/EtherUnitDisplay";
-import useExplorer from "@/hooks/useExplorer";
+import { EXPLORER_L2 } from "@/utils/env";
 
 type CreditCardProps = {
   credit: Credit;
@@ -18,7 +18,6 @@ const CreditCard: FC<Partial<CreditCardProps>> = function ({
   credit: { address, amount } = {},
   index,
 }) {
-  const explorer = useExplorer()
   return (
     <SurfaceCardBase>
       <div className="flex  justify-between gap-2 text-sm">
@@ -27,7 +26,7 @@ const CreditCard: FC<Partial<CreditCardProps>> = function ({
             <div className="flex gap-1 text-contentSecondary-light dark:text-contentSecondary-dark">
               Address{" "}
               <Link
-                href={`${explorer}/address/${address}`}
+                href={`${EXPLORER_L2}/address/${address}`}
                 isExternal
               >
                 {shortenAddress(address)}

src/components/Cards/SurfaceCards/GameCard.tsx

@@ -10,8 +10,7 @@ import { shortenAddress } from "@/utils";
 import shield from "@/icons/shield.png";
 import sword from "@/icons/sword.png";
 import Image from "next/image";
-import { useSnapshot } from "valtio";
-import useExplorer from "@/hooks/useExplorer";
+import { EXPLORER_L2 } from "@/utils/env";
 
 type GameCardProps = {
   game: Game;
@@ -26,7 +25,6 @@ const GameCard: FC<Partial<GameCardProps>> = function ({
     tx_hash,
   } = {},
 }) {
-  const explorer = useExplorer()
   return (
     <SurfaceCardBase>
       <div className="flex justify-between gap-2 text-sm">
@@ -35,7 +33,7 @@ const GameCard: FC<Partial<GameCardProps>> = function ({
             <div className="flex gap-1 text-contentSecondary-light dark:text-contentSecondary-dark">
               Block{" "}
               <Link
-                href={`${explorer}/block/${number}`}
+                href={`${EXPLORER_L2}/block/${number}`}
                 isExternal
               >
                 {number}

src/components/Cards/Web3Card.tsx

@@ -0,0 +1,7 @@
+
+
+const Web3Card = () => {
+  return (
+    <div></div>
+  )
+}

src/components/ExplorerDetails.tsx

@@ -4,8 +4,7 @@ import "react-loading-skeleton/dist/skeleton.css";
 import Skeleton from "react-loading-skeleton";
 
 import { capitalize } from "@/utils";
-import { useSnapshot } from "valtio";
-import { store } from "@/store/globalStore";
+import { network } from "@/utils/env";
 
 type ExplorerDetailsItemProps = {
   name: string;
@@ -33,7 +32,6 @@ function ExplorerDetailsItem({
 
 export function ExplorerDetails() {
 
-  const { network } = useSnapshot(store)
   const explorerDetailsItems: ExplorerDetailsItemProps[] = useMemo(() => {
     return [
       { name: "Network", value: capitalize(network) },

src/components/NavMenusSection/index.tsx

@@ -10,9 +10,8 @@ import {
 import EthereumIcon from "@/icons/ethereum.svg";
 import { Button } from "../Button";
 import { NavItem } from "./NavItem";
-import { useSnapshot } from "valtio";
-import { Network, setNetwork } from "@/store/globalStore";
 import { usePathname, useRouter, useSearchParams } from "next/navigation";
+import { Network } from "@/utils/env";
 
 const resolveApiUrl = () =>
   // TODO
@@ -32,16 +31,10 @@ export const NavMenusSection: React.FC = () => {
     [searchParams]
   )
   const handleSelectNetwork = (e: Network) => {
-    setNetwork(e)
-    router.push(pathname + '?' + createQueryString(e))
+    //todo 
   }
 
-  useEffect(() => {
-    const n = searchParams.get('n')
-    if (n) {
-      setNetwork(n as Network)
-    }
-  }, [searchParams])
+
 
   return (
     <div className="relative mx-auto flex max-w-screen-xl flex-wrap items-center justify-between p-4">
@@ -77,6 +70,7 @@ export const NavMenusSection: React.FC = () => {
                 [
                   { label: "sepolia", href: "", handleClick: () => { handleSelectNetwork('sepolia') } },
                   { label: "mainnet", href: "", handleClick: () => { handleSelectNetwork('mainnet') } },
+                  { label: "base-sepolia", href: "", handleClick: () => { handleSelectNetwork('base-sepolia') } },
                 ]
               }
             />

src/hooks/useAmoutPerDay.ts

@@ -1,9 +1,8 @@
 import useSWR, { SWRResponse } from "swr";
 import { get } from "@/service/index";
 import { Amountperday, DetailResponse, ListResponse } from "@/types";
-import useApiPrefix from "./useApiPrefix";
 
-const url = "/disputegames/overview/amountperday";
+const url = "/api/disputegames/overview/amountperday";
 const params = {};
 
 const getFetcher = (path: string) => async (): Promise<ListResponse<Amountperday>> => {
@@ -15,7 +14,7 @@ export const useAmountPerDay = (): SWRResponse<
   Error,
   boolean
 > => {
-  const { apiPrefix } = useApiPrefix()
-  const res = useSWR(apiPrefix + url, getFetcher(apiPrefix + url));
+
+  const res = useSWR(url, getFetcher(url));
   return res;
 };

src/hooks/useBoundProgress.ts

@@ -1,7 +1,6 @@
 import useSWR, { SWRResponse } from "swr";
 import { get } from "@/service/index";
 import { BoundProgress, DetailResponse, ListResponse } from "@/types";
-import useApiPrefix from "./useApiPrefix";
 
 const url = "/disputegames/statistics/bond/inprogress";
 const params = {};
@@ -15,7 +14,6 @@ export const useBoundProgress = (): SWRResponse<
   Error,
   boolean
 > => {
-  const { apiPrefix } = useApiPrefix()
-  const res = useSWR(apiPrefix + url, getFetcher(apiPrefix + url));
+  const res = useSWR('/api' + url, getFetcher('/api' + url));
   return res;
 };

src/hooks/useClaimData.ts

@@ -1,13 +1,11 @@
 import useSWR, { SWRResponse } from "swr";
 import { get } from "@/service/index";
 import { ClaimData, ListResponse } from "@/types";
-import useApiPrefix from "./useApiPrefix";
 
 export const useClaimData = (
   address: string
 ): SWRResponse<ListResponse<ClaimData>, Error, boolean> => {
-  const { apiPrefix } = useApiPrefix()
-  const url = `${apiPrefix}/disputegames/${address}/claimdatas`;
+  const url = `/api/disputegames/${address}/claimdatas`;
   const params = {};
   const fetcher = async (): Promise<ListResponse<ClaimData>> => {
     return await get(url, params);

src/hooks/useCreditRank.ts

@@ -1,7 +1,6 @@
 import useSWR, { SWRResponse } from "swr";
 import { get } from "@/service/index";
 import { Credit, IndexResponse, ListResponse } from "@/types";
-import useApiPrefix from "./useApiPrefix";
 
 type RankParams = {
   limit?: string;
@@ -16,8 +15,7 @@ const defaultParams: RankParams = {
 export const useCreditRank = (
   params?: RankParams
 ): SWRResponse<ListResponse<Credit>, Error, boolean> => {
-  const { apiPrefix } = useApiPrefix();
-  const url = apiPrefix + "/disputegames/credit/rank";
+  const url = "/api/disputegames/credit/rank";
   const fetcher = async (): Promise<ListResponse<Credit>> => {
     return await get(url);
   };

src/hooks/useLatestGame.ts

@@ -2,9 +2,8 @@ import useSWR, { SWRResponse } from "swr";
 import { get, post } from "@/service/index";
 import { Game, IndexResponse } from "@/types";
 import { useEffect, useState } from "react";
-import useApiPrefix from "./useApiPrefix";
 
-const url = "/indexes/disputegames/search";
+const url = "/index/indexes/disputegames/search";
 
 type GamesParams = {
   hitsPerPage?: number;
@@ -29,12 +28,11 @@ export const useLatestGame = (
   params?: GamesParams
 ): SWRResponse<IndexResponse<Game>, Error, boolean> => {
 
-  const { indexApiPrefix } = useApiPrefix()
   const p = {
     ...defaultParams,
     ...(params ? params : {}),
   };
-  const requestUrl = `${indexApiPrefix}${url}`;
+  const requestUrl = `${url}`;
   const res = useSWR([requestUrl, p], getFetcher(requestUrl, p));
   return res;
 };

src/hooks/useOverview.ts

@@ -1,19 +1,16 @@
 import useSWR, { SWRResponse } from "swr";
 import { get } from "@/service/index";
 import { DetailResponse, Overview } from "@/types";
-import useApiPrefix from "./useApiPrefix";
 
 const params = {};
 
 
-
 export const useOverview = (): SWRResponse<
   DetailResponse<Overview>,
   Error,
   boolean
 > => {
-  const { apiPrefix } = useApiPrefix()
-  const url = apiPrefix + "/disputegames/overview";
+  const url = "/api/disputegames/overview";
   const fetcher = async (): Promise<DetailResponse<Overview>> => {
     return await get(url, params);
   };

src/hooks/useSyncEvents.ts

@@ -1,11 +1,9 @@
 import useSWR, { SWRResponse } from "swr";
 import { get, post } from "@/service/index";
 import { Credit, IndexResponse, LatestEvents, ListResponse } from "@/types";
-import useApiPrefix from "./useApiPrefix";
-import { useMemo } from "react";
 
 
-const url = "/indexes/syncevents/search";
+const url = "/index/indexes/syncevents/search";
 type EventsParams = {
   hitsPerPage?: number,
   page?: number,
@@ -25,8 +23,7 @@ const getFetcher = (path: string, params?: EventsParams,) => async (): Promise<I
 };
 
 export const useSyncEvents = (params?: EventsParams): SWRResponse<IndexResponse<LatestEvents>, Error, boolean> => {
-  const { indexApiPrefix } = useApiPrefix()
-  const path = `${indexApiPrefix}${url}`
+  const path = url;
   const res = useSWR([path, params], getFetcher(path, params));
   return res;
 };