fix

src/@types/index.d.ts

@@ -200,6 +200,7 @@ declare module "metarare" {
     name: string;
     category: string;
     amounts_sale: number;
+    rank: number
   }
 
   export interface ITokenDetail {

src/components/common/RankingTable.tsx

@@ -43,9 +43,9 @@ export default function RankingTable({data}: IRankingTableProps) {
             }}>
               <td className={cx("rank")} >
                 <div style={{
-                    background: renderColor(index + 1),
-                    color: index + 1 <= 10 ? '#fff' : '#000'
-                }}>{index + 1}</div></td>
+                    background: renderColor(item.rank),
+                    color: item.rank <= 10 ? '#fff' : '#000'
+                }}>{item.rank}</div></td>
               <td className={cx("thumbnail_image")}>
                 <img src={item.thumbnail_image} alt={item.name} />
               </td>

src/components/common/SaleRankingCard.tsx

@@ -11,20 +11,19 @@ const cx = classNames.bind(styles);
 
 export interface ISalesRankingCardProps extends ISaleRanking {
   className: string;
-  index: number;
 }
 
 export default function SalesRankingCard({
-  index,
   name,
   thumbnail_image,
   className,
   amounts_sale,
+  rank = 0
 }: ISalesRankingCardProps) {
   const renderColor = () => {
-    if (index + 1 === 1) return "#ffd700";
-    if (index + 1 === 2) return "#c0c0c0";
-    if (index + 1 === 3) return "#cd7f32";
+    if (rank === 1) return "#ffd700";
+    if (rank === 2) return "#c0c0c0";
+    if (rank === 3) return "#cd7f32";
     return "#3d3d3d";
   };
   return (
@@ -35,7 +34,7 @@ export default function SalesRankingCard({
           background: renderColor(),
         }}
       >
-        <span>{index + 1}</span>
+        <span>{rank}</span>
       </div>{" "}
       <Link to={URLInfo.getProfileUserUrl(name || "")}>
         <div className={cx("card_wrap")}>

src/components/mobile/SalesRankingScrollList.tsx

@@ -18,7 +18,7 @@ const SalesRankingScrollList: React.FC<IOwnProps> = ({ list }) => {
       <Flicking align="prev">
         {list.map((item, index) => (
           <div key={`${item.artist_id}_${index}`} className={cx("nft_panel")}>
-            <SalesRankingCard {...item} className="scroll" index={index} />
+            <SalesRankingCard {...item} className="scroll" />
           </div>
         ))}
       </Flicking>

src/components/pc/Header.tsx

@@ -57,7 +57,6 @@ const Header: React.FC = () => {
   };
 
   const dispatchHint = (token_name: string) => {
-    console.log('%cHeader.tsx line:59 token_name', 'color: #007acc;', token_name);
     dispatch(
       fetchExploreHint({
         token_name,

src/components/pc/SalesRankingScrollList.tsx

@@ -41,7 +41,6 @@ const SalesRankingScrollList: React.FC<IOwnProps> = ({
               {list.map((item, index) => (
                 <SalesRankingCard
                   {...item}
-                  index={index}
                   key={index}
                   className="scroll"
                 />

src/store/reducers/ExploreReducer.ts

@@ -94,7 +94,7 @@ export const slice = createSlice({
 
       state.list = [
         ...state.list,
-        ...payload
+        ...payload.Result
       ];
       state.isExploreListLoaded = true;
     },

src/store/reducers/SaleReducer.ts

@@ -76,8 +76,13 @@ export const slice = createSlice({
     },
     [fetchSaleRanking.fulfilled.type]: (state: SaleState, action) => {
       const { payload } = action;
-
-      state.dataRaking = payload;
+      const data = payload as ISaleRanking[]
+      state.dataRaking = data.map((item, index) => {
+        return {
+          ...item,
+          rank: index + 1,
+        };
+      });
       state.isDataLoaded = true;
     },
     [fetchSaleRanking.rejected.type]: (state: SaleState, action) => {