Merge branch 'develop' into preview

Author: leduyhien152

app/[server]/page.tsx

@@ -158,7 +158,7 @@ const Overview = () => {
             </div>
           )}
         </div>
-        {/* <div
+        <div
           className={clsx("grid grid-cols-1 mx-auto gap-4", {
             "md:grid-cols-2": stakingPools.length >= 2,
             "lg:grid-cols-3": stakingPools.length >= 3,
@@ -173,7 +173,7 @@ const Overview = () => {
           {stakingPools.some((each) => each.type === "nft") && (
             <NFTCard hidden={isLoggedIn && !showInfo} />
           )}
-        </div> */}
+        </div>
       </div>
       <Footer />
     </div>

components/token-image.tsx

@@ -1,4 +1,5 @@
 import useSWR from "swr";
+import wretch from "wretch";
 import Image from "next/image";
 
 interface Props {
@@ -10,7 +11,10 @@ export const TokenImage = (props: Props) => {
   const { symbol = "", size = 20 } = props;
   const { data } = useSWR(
     `https://api-preview.mochi.console.so/api/v1/product-metadata/emoji?codes=${symbol}`,
-    (url) => fetch(url).then((res) => res.json()),
+    (url) =>
+      wretch(url)
+        .get()
+        .json((res) => res.data),
     {
       revalidateIfStale: false,
       revalidateOnFocus: false,
@@ -21,7 +25,7 @@ export const TokenImage = (props: Props) => {
   return (
     <Image
       src={
-        data?.data[0]?.emoji_url ||
+        data?.[0]?.emoji_url ||
         "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNk8AEAAFIATgDK/mEAAAAASUVORK5CYII="
       }
       alt={symbol}

store/token-staking.ts

@@ -1,4 +1,5 @@
 import { create } from "zustand";
+import wretch from "wretch";
 
 export interface Chain {
   id?: number;
@@ -52,10 +53,11 @@ const initialState: State = {
 export const useTokenStaking = create<State & Action>((set, get) => ({
   ...initialState,
   fetchStakingPools: async () => {
-    const response = await fetch(
+    const res = await wretch(
       "https://api-preview.tono.console.so/api/v1/guilds/462663954813157376/community/token/staking"
-    );
-    const json = await response.json();
-    set({ stakingPools: json?.data?.data || [] });
+    )
+      .get()
+      .json((res) => res?.data?.data);
+    set({ stakingPools: res || [] });
   },
 }));