From 19af9555e53342faeb5c82ffe0bcb566ecfe80c9 Mon Sep 17 00:00:00 2001
From: ybgbob <bob.g@nodereal.io>
Date: Fri, 17 Nov 2023 02:05:32 +0800
Subject: [PATCH] feat: list and delist

---
 src/components/modal/DelistModal.tsx          |   4 +-
 src/components/modal/ListModal.tsx            |   1 +
 src/components/modal/ListProcess.tsx          |   6 +-
 .../resource/collection/ActionButtonGroup.tsx |  97 +++++++++
 .../resource/collection/CollectionList.tsx    | 203 ++++++------------
 src/components/ui/buttons/DefaultButton.tsx   |   2 +-
 src/context/modal/index.ts                    |   6 +-
 src/hooks/useGetItemById.ts                   |   1 +
 src/hooks/useGetItemByObjId.ts                | 100 ++++++++-
 src/hooks/useGetObjectList.ts                 |  81 +++++--
 src/utils/apis/index.ts                       |  16 ++
 src/utils/apis/types.ts                       |  21 ++
 12 files changed, 370 insertions(+), 168 deletions(-)
 create mode 100644 src/components/resource/collection/ActionButtonGroup.tsx

diff --git a/src/components/modal/DelistModal.tsx b/src/components/modal/DelistModal.tsx
index 85d9b5a..90021d6 100755
--- a/src/components/modal/DelistModal.tsx
+++ b/src/components/modal/DelistModal.tsx
@@ -28,7 +28,7 @@ export const DelistModal = (props: any) => {
 
   const { object_name, create_at, bucket_name, groupId } = delistData;
 
-  const name = object_name || bucket_name;
+  const name = bucket_name;
   const type = object_name ? 'Data' : 'Collection';
 
   const { num } = useCollectionItems(name, false);
@@ -137,6 +137,8 @@ export const DelistModal = (props: any) => {
                 result: tmp,
               });
               setLoading(false);
+
+              modalData.modalState?.callBack();
             }}
             disabled={!BSC_FEE_SUFF || loading}
             isLoading={loading}
diff --git a/src/components/modal/ListModal.tsx b/src/components/modal/ListModal.tsx
index 29fcb71..7e66621 100755
--- a/src/components/modal/ListModal.tsx
+++ b/src/components/modal/ListModal.tsx
@@ -344,6 +344,7 @@ export const ListModal = (props: ListModalProps) => {
                 modalData.modalDispatch({
                   type: 'OPEN_LIST_PROCESS',
                   listData,
+                  callBack: modalData.modalState.callBack,
                 });
               }}
               disabled={!available}
diff --git a/src/components/modal/ListProcess.tsx b/src/components/modal/ListProcess.tsx
index 0086acb..66cb6ff 100755
--- a/src/components/modal/ListProcess.tsx
+++ b/src/components/modal/ListProcess.tsx
@@ -66,7 +66,7 @@ export const ListProcess = (props: ListProcessProps) => {
       setTitle(hasRole ? 'Finalize on BSC' : 'Approve on BSC');
       setStatus(1);
     }
-  }, [stateModal.modalState.initListStatus]);
+  }, [hasRole, stateModal.modalState.initListStatus]);
 
   const reset = useCallback(() => {
     setStep(0);
@@ -241,7 +241,11 @@ export const ListProcess = (props: ListProcessProps) => {
         {status == 2 && (
           <Button
             onClick={() => {
+              console.log(stateModal.modalState.callBack);
+              stateModal.modalState?.callBack();
+
               reset();
+
               stateModal.modalDispatch({ type: 'RESET' });
               handleOpen(false);
             }}
diff --git a/src/components/resource/collection/ActionButtonGroup.tsx b/src/components/resource/collection/ActionButtonGroup.tsx
new file mode 100644
index 0000000..4fddc74
--- /dev/null
+++ b/src/components/resource/collection/ActionButtonGroup.tsx
@@ -0,0 +1,97 @@
+import { Box } from '@totejs/uikit';
+import { FILE_ITEM } from '../../../hooks/useGetObjectList';
+import { useAccount } from 'wagmi';
+import { useMemo } from 'react';
+import { useModal } from '../../../hooks/useModal';
+import {
+  useGetBucketByName,
+  useGetGroupByName,
+  useGetObject,
+} from '../../../hooks/useGetBucketOrObj';
+import { generateGroupName } from '../../../utils';
+
+interface Props {
+  fileInfo: FILE_ITEM;
+  uploadFn: () => void;
+}
+
+export const ActionButtonGroup = (props: Props) => {
+  const { fileInfo, uploadFn } = props;
+  const { name, type, data, isListed, isPurchasedByMe } = fileInfo;
+  const { BucketName, ObjectName } = data;
+  const { address } = useAccount();
+  const modalData = useModal();
+
+  const { data: bucketData } = useGetBucketByName(BucketName);
+  const { data: objectData } = useGetObject(BucketName, ObjectName);
+
+  const { data: groupData } = useGetGroupByName(
+    generateGroupName(BucketName, ObjectName),
+    data.Owner,
+  );
+
+  return (
+    <Box>
+      {/* only owner can delist */}
+      {isListed && data.Owner === address && (
+        <Box
+          onClick={() => {
+            if (!objectData || !groupData) return;
+
+            console.log(
+              'generateGroupName(BucketName, ObjectName)',
+              generateGroupName(BucketName, ObjectName),
+            );
+
+            modalData.modalDispatch({
+              type: 'OPEN_DELIST',
+              delistData: {
+                groupId: groupData.groupInfo.id,
+                bucket_name: BucketName,
+                object_name: ObjectName,
+                create_at: objectData.objectInfo.createAt.low,
+                owner: objectData.objectInfo.owner,
+              },
+              callBack: () => {
+                uploadFn();
+              },
+            });
+          }}
+        >
+          delist
+        </Box>
+      )}
+
+      {/* only owner can list */}
+      {!isListed && data.Owner === address && (
+        <Box
+          onClick={() => {
+            if (!bucketData || !objectData) return;
+
+            const initInfo = {
+              bucket_name: BucketName,
+              object_name: objectData.objectInfo.objectName,
+              create_at: objectData.objectInfo.createAt.low,
+              payload_size: objectData.objectInfo.payloadSize,
+            };
+            modalData.modalDispatch({
+              type: 'OPEN_LIST',
+              initInfo,
+              callBack: () => {
+                uploadFn();
+              },
+            });
+          }}
+        >
+          list
+        </Box>
+      )}
+
+      {/* only buyer can download */}
+      {isPurchasedByMe && <Box>download</Box>}
+
+      {/* haven't bought can buy excepy owner */}
+      {!isPurchasedByMe && data.Owner !== address && <Box>Buy</Box>}
+    </Box>
+  );
+};
diff --git a/src/components/resource/collection/CollectionList.tsx b/src/components/resource/collection/CollectionList.tsx
index 533b508..cdc4909 100755
--- a/src/components/resource/collection/CollectionList.tsx
+++ b/src/components/resource/collection/CollectionList.tsx
@@ -2,7 +2,7 @@ import styled from '@emotion/styled';
 import { CardPocketIcon } from '@totejs/icons';
 import { Box, ColumnDef, Flex, Table } from '@totejs/uikit';
 import _ from 'lodash';
-import { useEffect, useState } from 'react';
+import { useCallback, useEffect, useState } from 'react';
 import {
   createSearchParams,
   useNavigate,
@@ -13,9 +13,14 @@ import { DEFAULT_ITEM } from '../../../hooks/useGetItemById';
 import {
   useGetItemByObjId,
   useGetItemsByObjIds,
+  usePurchaseQueryByObjIds,
 } from '../../../hooks/useGetItemByObjId';
 import { ITEM_RELATION_ADDR } from '../../../hooks/useGetItemRelationWithAddr';
-import { OBJECT_ITEM, useGetObjectList } from '../../../hooks/useGetObjectList';
+import {
+  OBJECT_ITEM,
+  objListMergeListedAndPurchased,
+  useGetObjectList,
+} from '../../../hooks/useGetObjectList';
 import { useGlobal } from '../../../hooks/useGlobal';
 import { useModal } from '../../../hooks/useModal';
 import { usePagination } from '../../../hooks/usePagination';
@@ -33,6 +38,7 @@ import { QueryHeadBucketResponse } from '../../../utils/gfSDK';
 import { Loader } from '../../Loader';
 import { NoData } from '../../NoData';
 import { TableProps } from '../../ui/table/TableProps';
+import { ActionButtonGroup } from './ActionButtonGroup';
 
 interface Props {
   itemInfo: Item;
@@ -40,113 +46,67 @@ interface Props {
   relation: ITEM_RELATION_ADDR;
 }
 const CollectionList = (props: Props) => {
-  const state = useGlobal();
   const navigator = useNavigate();
-  const { itemInfo, bucketData, relation } = props;
+  const { itemInfo, bucketData } = props;
   const [p] = useSearchParams();
   const id = p.get('id') as string;
   const path = p.get('path') as string;
+  const { address } = useAccount();
 
-  const { data: objectList, isLoading } = useGetObjectList({
+  const {
+    data: objectList,
+    isLoading,
+    refetch: reloadObjectList,
+  } = useGetObjectList({
     bucketName: itemInfo?.name,
     path: path,
   });
 
-  console.log('objectList', objectList);
-
-  const oidList: string[] | undefined = objectList
+  const oidList: number[] | undefined = objectList
     ?.filter((item) => item.type === 'file')
     .map((item: any) => {
-      console.log('item', item);
-      return item.data.Id as string;
-      // return {
-      //   id: item.data.Id,
-      //   name: generateGroupName(itemInfo.name, item.name),
-      // };
+      return item.data.Id as number;
     });
   // console.log('oidList', oidList);
 
-  // const xx = useGetItemsByObjIds(oidList || []);
-  // console.log('xx', xx[0]);
+  const { data: objListedList, refetch: reloadListedList } =
+    useGetItemsByObjIds(oidList || []);
 
-  // const { list, loading } = useCollectionItems(
-  //   itemInfo.name,
-  //   itemInfo.status === 'LISTED',
-  // );
+  const { data: purchasedList, refetch: reloadPurchasedList } =
+    usePurchaseQueryByObjIds(address, oidList || []);
 
-  // console.log('list', list);
+  const reloadList = useCallback(() => {
+    reloadObjectList();
+    reloadListedList();
+    reloadPurchasedList();
+  }, [reloadListedList, reloadObjectList, reloadPurchasedList]);
 
-  const [selectObjectId, setSelectObjectId] = useState('');
-  const [selectBucketName, setBucketName] = useState('');
-  const { data: selectItem } = useGetItemByObjId(selectObjectId);
+  console.log('objListedList', objListedList);
+  console.log('purchasedList', purchasedList);
 
-  // TODO: if selectItem is null, the object is not listed, should go to bid or oid page
-  // console.log('selectItem', selectObjectId, selectItem);
-  useEffect(() => {
-    if (selectItem?.id === DEFAULT_ITEM.id) return;
+  const mergedList = objListMergeListedAndPurchased(
+    objectList,
+    objListedList,
+    purchasedList,
+  );
 
-    // console.log('selectItem', selectItem);
-    if (!_.isEmpty(selectItem)) {
-      console.log(`/resource?id=${selectItem.id}`);
-      navigator(`/resource?id=${selectItem.id}`);
-    } else {
-      // this item had not been listed yet
-      // only listed item can enter resource page
-      // return;
-      // console.log(`/resource?oid=${selectObjectId}`);
-      // navigator(`/detail?bn=${selectBucketName}`);
-    }
-  });
+  console.log('objectList', objectList);
+  console.log('mergedList', mergedList);
 
   const { handlePageChange, page } = usePagination();
 
-  const modalData = useModal();
-
-  const { address } = useAccount();
-
-  const navigate = useNavigate();
-
-  const bgn = '';
-  // if (bucketData.bucketInfo) {
-  //   const bucketId = bucketData.bucketInfo.id;
-  //   bgn = generateGroupName(bucketData.bucketInfo.bucketName);
-  //
-
-  // const { data: bucketIdData, refetch } = useGetBucketById(bucketId);
-
   const columns: ColumnDef<OBJECT_ITEM> = [
     {
       header: 'Data',
       width: '200px',
       cell: (data: any) => {
         const { type, name } = data;
-        return (
-          <ImgContainer
-            alignItems={'center'}
-            justifyContent={'flex-start'}
-            gap={6}
-            onClick={() => {
-              // let list = state.globalState.breadList;
-              // console.log('list in from', list);
-              // if (
-              //   list.slice(-1)[0].name !== bucketData?.bucketInfo.bucketName
-              // ) {
-              //   const item = {
-              //     path: '/resource',
-              //     name: bucketData?.bucketInfo.bucketName || 'Collection',
-              //     query: p.toString(),
-              //   };
-              //   state.globalDispatch({
-              //     type: 'ADD_BREAD',
-              //     item,
-              //   });
-              //   list = list.concat([item]);
-              // }
-
-              // const from = encodeURIComponent(JSON.stringify(list));
 
-              if (type === 'folder') {
-                // console.log(data.name);
+        if (type === 'folder') {
+          return (
+            <ImgContainer
+              cursor="pointer"
+              onClick={() => {
                 const params = {
                   id: id,
                   path: data.name + '/',
@@ -155,37 +115,24 @@ const CollectionList = (props: Props) => {
                   pathname: '/resource',
                   search: `?${createSearchParams(params)}`,
                 });
-                // `/resourceid=${
-                //   bucketData?.bucketInfo.bucketId
-                // }&f=${encodeURIComponent(name)}&address=${item}&from=${from}`,
-                // navigator(
-                //   `/folder?bid=${
-                //     bucketData?.bucketInfo.bucketId
-                //   }&f=${encodeURIComponent(
-                //     name,
-                //   )}&address=${item}&from=${from}`,
-                // );
-              } else {
-                // console.log('data', data);
-                const id = String(data.data.Id);
-                setSelectObjectId(id);
-                setBucketName(data.data.BucketName);
-                // navigate(
-                //   `/resource?oid=${id}&bgn=${bgn}&address=${itemInfo.ownerAddress}&from=${from}`,
-                // );
-              }
-            }}
-          >
-            {type === 'folder' ? (
+              }}
+            >
               <IconCon alignItems={'center'} justifyContent={'center'}>
                 <CardPocketIcon color={'white'} />
               </IconCon>
-            ) : (
+              <Box title={name}>{trimLongStr(name, 15)}</Box>
+            </ImgContainer>
+          );
+        }
+
+        if (type === 'file') {
+          return (
+            <ImgContainer>
               <ImgCon src={defaultImg(name, 40)}></ImgCon>
-            )}
-            <Box title={name}>{trimLongStr(name, 15)}</Box>
-          </ImgContainer>
-        );
+              <Box title={name}>{trimLongStr(name, 15)}</Box>
+            </ImgContainer>
+          );
+        }
       },
     },
     {
@@ -243,42 +190,18 @@ const CollectionList = (props: Props) => {
     {
       header: '',
       cell: (data) => {
-        return <Box>{}</Box>;
+        console.log('data', data);
+        return (
+          data.type === 'file' && (
+            <ActionButtonGroup fileInfo={data} uploadFn={reloadList} />
+          )
+        );
       },
     },
     // {
     //   header: 'Action',
     //   cell: (data: any) => {
     //     const { object_info, listed, groupId, name } = data;
-    //     if (!object_info)
-    //       return (
-    //         <GoIcon
-    //           cursor={'pointer'}
-    //           color={'#AEB4BC'}
-    //           onClick={() => {
-    //             const list = state.globalState.breadList;
-    //             if (
-    //               list.slice(-1)[0].name !== bucketData?.bucketInfo.bucketName
-    //             ) {
-    //               // const item = {
-    //               //   path: '/resource',
-    //               //   name: bucketData?.bucketInfo.bucketName,
-    //               //   query: p.toString(),
-    //               // };
-    //               // state.globalDispatch({
-    //               //   type: 'ADD_BREAD',
-    //               //   item,
-    //               // });
-    //               // list = list.concat([item]);
-    //             }
-
-    //             // const from = encodeURIComponent(JSON.stringify(list));
-
-    //             // navigator(
-    //             //   `/folder?bid=${bucketId}&f=${name}&address=${ownerAddress}&collectionListed=${collectionListed}&from=${from}`,
-    //             // );
-    //           }}
-    //         />
     //       );
     //     const { owner, object_name, create_at } = object_info;
     //     return (
@@ -382,7 +305,7 @@ const CollectionList = (props: Props) => {
           onChange: handlePageChange,
         }}
         columns={columns}
-        data={objectList}
+        data={mergedList}
         loading={isLoading}
         {...TableProps}
       />
@@ -400,9 +323,11 @@ const Container = styled.div`
 
 const ImgContainer = styled(Flex)`
   gap: 16px;
-  cursor: pointer;
   color: #fff;
   font-size: 16px;
+  align-items: center;
+  justify-content: flex-start;
+  gap: 6px;
 `;
 
 const ImgCon = styled.img`
diff --git a/src/components/ui/buttons/DefaultButton.tsx b/src/components/ui/buttons/DefaultButton.tsx
index 44458e1..a735426 100644
--- a/src/components/ui/buttons/DefaultButton.tsx
+++ b/src/components/ui/buttons/DefaultButton.tsx
@@ -24,7 +24,7 @@ export const BaseButton = styled(Button)`
   color: #181a1e;
   padding-left: 12px;
   padding-right: 12px;
-  /* height: 40px; */
+  height: 40px;
   line-height: 40px;
   border-radius: 8px;
 
diff --git a/src/context/modal/index.ts b/src/context/modal/index.ts
index 0f7e9dd..f43f1ed 100755
--- a/src/context/modal/index.ts
+++ b/src/context/modal/index.ts
@@ -64,6 +64,7 @@ export const ModalReducer = (initialState: any, action: any) => {
         ...initialState,
         openList: true,
         initInfo: action.initInfo,
+        callBack: action.callBack,
       };
     case 'CLOSE_LIST':
       return { ...initialState, openList: false };
@@ -73,6 +74,7 @@ export const ModalReducer = (initialState: any, action: any) => {
         openListProcess: true,
         openList: false,
         listData: action.listData,
+        callBack: action.callBack,
       };
     case 'CLOSE_LIST_PROCESS':
       return {
@@ -89,7 +91,7 @@ export const ModalReducer = (initialState: any, action: any) => {
         listData: action.listData || initialState.listData,
       };
     case 'OPEN_BUY':
-      console.log('initListStatus', initialState);
+      // console.log('initListStatus', initialState);
       return {
         ...initialState,
         openBuy: true,
@@ -107,10 +109,12 @@ export const ModalReducer = (initialState: any, action: any) => {
         openBuy: false,
       };
     case 'OPEN_DELIST':
+      // console.log('OPEN_DELIST', initialState, action.delistData);
       return {
         ...initialState,
         openDelist: true,
         delistData: action.delistData,
+        callBack: action.callBack,
       };
     case 'CLOSE_DELIST':
       return {
diff --git a/src/hooks/useGetItemById.ts b/src/hooks/useGetItemById.ts
index 25d2c26..ac07cb5 100644
--- a/src/hooks/useGetItemById.ts
+++ b/src/hooks/useGetItemById.ts
@@ -14,6 +14,7 @@ export const DEFAULT_ITEM: Item = {
   groupId: 0,
   groupName: '',
   ownerAddress: '',
+  resourceId: 0,
   price: '',
   status: 'LISTED',
   totalSale: 0,
diff --git a/src/hooks/useGetItemByObjId.ts b/src/hooks/useGetItemByObjId.ts
index ae6bce8..d2229b3 100644
--- a/src/hooks/useGetItemByObjId.ts
+++ b/src/hooks/useGetItemByObjId.ts
@@ -1,19 +1,109 @@
 import { useQueries, useQuery } from '@tanstack/react-query';
-import { getItemByObjectId } from '../utils/apis';
+import {
+  getItemByObjectId,
+  getItemByObjectIds,
+  queryPurchase,
+  searchPurchase,
+} from '../utils/apis';
 import { DEFAULT_ITEM } from './useGetItemById';
+import _ from 'lodash';
+import { useAccount } from 'wagmi';
 
-export const useGetItemsByObjIds = (objectIdList: string[]) => {
+/**
+ *
+ * get object list: isPurchased / isListed
+ */
+/* export const useGetItemsStatusByObjIds = (
+  address: string,
+  objectIdList: number[],
+) => {
   return useQueries({
     queries: objectIdList.map((objectId) => {
       return {
-        queryKey: ['GET_ITEM_BY_OBJECT_ID', objectId],
+        queryKey: ['GET_ITEM_BY_OBJECT_IDS', address, objectId],
         queryFn: async () => {
-          const res = await getItemByObjectId(objectId);
-          return res;
+          const objRes = await getItemByObjectId(String(objectId));
+          let isList = false;
+          let isPurchased = false;
+
+          if (!_.isEmpty(objRes)) {
+            isList = true;
+          }
+
+          const purRes = await searchPurchase({
+            filter: {
+              address,
+              objectId: objectId,
+            },
+            offset: 0,
+            limit: 10,
+            sort: 'CREATION_DESC',
+          });
+
+          if (purRes.purchases.length > 0) {
+            isPurchased = true;
+          }
+
+          // console.log('res', objectId, isList, isPurchased);
+
+          return {
+            [objectId]: {
+              isList,
+              isPurchased,
+            },
+          };
         },
       };
     }),
   });
+}; */
+
+export const useGetItemsByObjIds = (ids: number[]) => {
+  return useQuery({
+    enabled: ids.length !== 0,
+    queryKey: ['GET_ITEM_BY_OBJECT_IDS', ids],
+    queryFn: async () => {
+      const res = await getItemByObjectIds(ids);
+
+      return res
+        .filter((item) => {
+          return ids.includes(item.resourceId);
+        })
+        .map((item) => {
+          return item.resourceId;
+        });
+    },
+  });
+};
+
+export const usePurchaseQueryByObjIds = (
+  address: string | undefined,
+  ids: number[],
+) => {
+  return useQuery({
+    enabled: !!address && ids.length !== 0,
+    queryKey: ['PURCHARGE_QUERY', address],
+    queryFn: async () => {
+      const res = await queryPurchase({
+        filter: {
+          address,
+          objectIds: ids.concat(178839),
+        },
+        offset: 0,
+        limit: 10,
+        sort: 'CREATION_DESC',
+      });
+      console.log('res --->', res);
+
+      return res.purchases
+        .filter((item) => {
+          return ids.includes(item.resourceId);
+        })
+        .map((item) => {
+          return item.resourceId;
+        });
+    },
+  });
 };
 
 export const useGetItemByObjId = (objectId: string) => {
diff --git a/src/hooks/useGetObjectList.ts b/src/hooks/useGetObjectList.ts
index 5d1508a..90ac08a 100644
--- a/src/hooks/useGetObjectList.ts
+++ b/src/hooks/useGetObjectList.ts
@@ -1,6 +1,5 @@
-import { useQueries, useQuery } from '@tanstack/react-query';
-import { client, getGroupInfoByName, getRandomSp } from '../utils/gfSDK';
-import { useAccount } from 'wagmi';
+import { useQuery } from '@tanstack/react-query';
+import { client, getRandomSp } from '../utils/gfSDK';
 
 interface Params {
   bucketName: string;
@@ -28,17 +27,27 @@ type ObjectInfo = {
   Visibility: number;
 };
 
-export type OBJECT_ITEM =
-  | {
-      type: 'file';
-      name: string;
-      data: ObjectInfo;
-    }
-  | {
-      type: 'folder';
-      name: string;
-      path: string;
-    };
+export type FILE_ITEM = {
+  type: 'file';
+  name: string;
+  data: ObjectInfo;
+  /**
+   * be list or not
+   */
+  isListed: boolean;
+  /**
+   * bought by me or not
+   */
+  isPurchasedByMe: boolean;
+};
+
+export type FOLDER_ITEM = {
+  type: 'folder';
+  name: string;
+  path: string;
+};
+
+export type OBJECT_ITEM = FOLDER_ITEM | FILE_ITEM;
 
 export const useGetObjectList = (params: Params) => {
   return useQuery({
@@ -51,6 +60,41 @@ export const useGetObjectList = (params: Params) => {
   });
 };
 
+export const objListMergeListedAndPurchased = (
+  objectList: OBJECT_ITEM[] | undefined | null,
+  listedList: number[] | undefined,
+  purchasedList: number[] | undefined,
+) => {
+  console.log(
+    'objListMergeListedAndPurchased objectList',
+    objectList,
+    listedList,
+    purchasedList,
+  );
+  if (!objectList) return [];
+  if (!listedList || !purchasedList) return objectList;
+
+  const res = objectList.map((item) => {
+    if (item.type === 'file') {
+      if (listedList.includes(item.data.Id)) {
+        item.isListed = true;
+      } else {
+        item.isListed = false;
+      }
+
+      if (purchasedList.includes(item.data.Id)) {
+        item.isPurchasedByMe = true;
+      } else {
+        item.isPurchasedByMe = false;
+      }
+    }
+
+    return item;
+  });
+
+  return res;
+};
+
 const getObjectList = async (params: Params) => {
   const { bucketName, path } = params;
 
@@ -68,7 +112,7 @@ const getObjectList = async (params: Params) => {
 
   if (!res || !res.body) return null;
 
-  console.log('res', bucketName, path, endpoint, res);
+  // console.log('res', bucketName, path, endpoint, res);
 
   const { CommonPrefixes, Objects } =
     res.body.GfSpListObjectsByBucketNameResponse;
@@ -89,17 +133,14 @@ const getObjectList = async (params: Params) => {
       type: 'file',
       name: file.ObjectInfo.ObjectName,
       data: file.ObjectInfo,
+      isListed: false,
+      isPurchasedByMe: false,
     };
   });
 
   return folderList.concat(fileList);
 };
 
-// type X = {
-//   groupName: string | undefined;
-//   // ownerAddress: string | undefined;
-// };
-
 // export const useGetGroupListInfo = (groupNameList: string[]) => {
 //   const { address } = useAccount();
 //   return useQueries({
diff --git a/src/utils/apis/index.ts b/src/utils/apis/index.ts
index 2004920..e3eaf66 100644
--- a/src/utils/apis/index.ts
+++ b/src/utils/apis/index.ts
@@ -7,6 +7,8 @@ import {
   CategoriesResponse,
   SearchPurchaseRequest,
   SearchPurchaseResponse,
+  QueryPurchaseRequest,
+  QueryPurchaseResponse,
 } from './types';
 
 const instance = axios.create({
@@ -31,6 +33,14 @@ export const searchPurchase = async (
   return data.data.data;
 };
 
+export const queryPurchase = async (
+  params: QueryPurchaseRequest,
+): Promise<QueryPurchaseResponse> => {
+  const data = await instance.post('purchase/query', JSON.stringify(params));
+
+  return data.data.data;
+};
+
 export const getCategoryMap = async (): Promise<CategoriesResponse[]> => {
   const data = await instance.get('item/categories');
   return data?.data?.data?.categories || [];
@@ -53,6 +63,12 @@ export const getItemByObjectId = async (objectId: string): Promise<Item> => {
   return data?.data?.data?.item || {};
 };
 
+export const getItemByObjectIds = async (ids: number[]): Promise<Item[]> => {
+  const data = await instance.post(`item_by_objects`, JSON.stringify({ ids }));
+
+  return data?.data?.data?.items || [];
+};
+
 export const getItemById = async (id: number): Promise<Item> => {
   const data = await instance.get(`item/${id}`);
   return data?.data?.data?.item || {};
diff --git a/src/utils/apis/types.ts b/src/utils/apis/types.ts
index 9c0b80d..6d15c4f 100644
--- a/src/utils/apis/types.ts
+++ b/src/utils/apis/types.ts
@@ -10,6 +10,11 @@ export type Item = {
   groupName: string;
   ownerAddress: string;
   price: string;
+  /**
+   * resourceId may be bucketId or objectId
+   * depending on type
+   */
+  resourceId: number;
   status: 'LISTED' | 'PENDING' | 'BLOCKED';
   totalSale: number;
   totalVolume: string;
@@ -56,3 +61,19 @@ export interface SearchPurchaseResponse {
   purchases: Item[];
   total: number;
 }
+
+export interface QueryPurchaseRequest {
+  filter: {
+    address?: string;
+    itemIds?: number[];
+    bucketIds?: number[];
+    objectIds?: number[];
+  };
+  sort: 'CREATION_ASC' | 'CREATION_DESC' | 'PRICE_ASC' | 'PRICE_DESC';
+  offset: number;
+  limit: number;
+}
+export interface QueryPurchaseResponse {
+  purchases: Item[];
+  total: number;
+}