diff --git a/src/components/common/CharacterList.tsx b/src/components/common/CharacterList.tsx index d3954798..dad1869e 100644 --- a/src/components/common/CharacterList.tsx +++ b/src/components/common/CharacterList.tsx @@ -52,7 +52,13 @@ export const CharacterList: React.FC<{ @{sub.character?.handle} - + diff --git a/src/components/site/PostFooter.tsx b/src/components/site/PostFooter.tsx index 9fce77e7..6e28a40e 100644 --- a/src/components/site/PostFooter.tsx +++ b/src/components/site/PostFooter.tsx @@ -21,8 +21,9 @@ import { Comment } from "~/components/common/Comment" import { UniLink } from "~/components/ui/UniLink" import { Modal } from "~/components/ui/Modal" import { Avatar } from "../ui/Avatar" -import { BlockchainIcon } from "~/components/icons/BlockchainIcon" import { MintIcon } from "~/components/icons/MintIcon" +import { getLikes, getMints } from "~/models/page.model" +import { CharacterList } from "~/components/common/CharacterList" export const PostFooter: React.FC<{ page?: Note @@ -156,6 +157,46 @@ export const PostFooter: React.FC<{ page?.id, ]) + const [likeList, setLikeList] = useState([]) + const [likeCursor, setLikeCursor] = useState() + useEffect(() => { + if (likes.isSuccess && likes.data) { + setLikeList(likes.data.list || []) + setLikeCursor(likes.data.cursor || "") + } + }, [likes.isSuccess]) + + const loadMoreLikes = async () => { + if (likeCursor && page?.id) { + const subs = await getLikes({ + pageId: page.id, + cursor: likeCursor, + }) + setLikeList((prev) => [...prev, ...(subs?.list || [])]) + setLikeCursor(subs?.cursor || "") + } + } + + const [mintList, setMintList] = useState([]) + const [mintCursor, setMintCursor] = useState() + useEffect(() => { + if (mints.isSuccess && mints.data) { + setMintList(mints.data.list || []) + setMintCursor(mints.data.cursor || "") + } + }, [mints.isSuccess]) + + const loadMoreMints = async () => { + if (mintCursor && page?.id) { + const subs = await getMints({ + pageId: page.id, + cursor: mintCursor, + }) + setMintList((prev) => [...prev, ...(subs?.list || [])]) + setMintCursor(subs?.cursor || "") + } + } + return ( <>
@@ -289,90 +330,22 @@ export const PostFooter: React.FC<{
- -
    - {likes.data?.list?.map((like: any, index) => ( -
  • - - - {like.fromCharacter?.metadata?.content?.name} - - @{like.fromCharacter?.handle} - - - - - -
  • - ))} -
-
- -
-
- + -
    - {mints.data?.list?.map((mint: any, index) => ( -
  • - - - {mint.character?.metadata?.content?.name} - - @{mint.character?.handle} - - - - - -
  • - ))} -
-
- -
-
+ loadMore={loadMoreMints} + hasMore={!!mintCursor} + list={mintList} + > diff --git a/src/models/page.model.ts b/src/models/page.model.ts index 3cc5267d..217ae9db 100644 --- a/src/models/page.model.ts +++ b/src/models/page.model.ts @@ -385,12 +385,19 @@ export async function unlikePage({ } } -export async function getLikes({ pageId }: { pageId: string }) { +export async function getLikes({ + pageId, + cursor, +}: { + pageId: string + cursor?: string +}) { const res = await indexer.getBacklinksOfNote( pageId.split("-")[0], pageId.split("-")[1], { linkType: "like", + cursor, }, ) await Promise.all( @@ -410,6 +417,7 @@ export async function getLikes({ pageId }: { pageId: string }) { }) ).data } + ;(item).character = item.fromCharacter }), ) @@ -449,10 +457,19 @@ export async function mintPage({ ) } -export async function getMints({ pageId }: { pageId: string }) { +export async function getMints({ + pageId, + cursor, +}: { + pageId: string + cursor?: string +}) { const data = await indexer.getMintedNotesOfNote( pageId.split("-")[0], pageId.split("-")[1], + { + cursor, + }, ) await Promise.all( diff --git a/src/queries/page.ts b/src/queries/page.ts index 1353a4f1..689c6913 100644 --- a/src/queries/page.ts +++ b/src/queries/page.ts @@ -22,6 +22,7 @@ export const useGetLikes = (input: { pageId?: string }) => { return { count: 0, list: [], + cursor: undefined, } } return pageModel.getLikes({ @@ -51,6 +52,7 @@ export const useGetMints = (input: { pageId?: string }) => { return { count: 0, list: [], + cursor: undefined, } } return pageModel.getMints({