diff --git a/hooks/freeagents.ts b/hooks/freeagents.ts index 781034ac4..ebce44d91 100644 --- a/hooks/freeagents.ts +++ b/hooks/freeagents.ts @@ -60,13 +60,18 @@ export function useFreeAgents() { return { playstyle: router.query.playstyle as Playstyle }; } + const filteredPostsData = (postsData ?? []).filter( + (post) => !state.playstyle || post.playstyles.includes(state.playstyle) + ); + return { - postsData: (postsData ?? []).filter( - (post) => !state.playstyle || post.playstyles.includes(state.playstyle) - ), + postsData: filteredPostsData, likesData, isLoading: !postsData, usersPost, + matchedPosts: (likesData?.matchedPostIds ?? []).map((id) => + (filteredPostsData ?? []).find((post) => post.id === id) + ), playstyleCounts: (postsData ?? []).reduce( (acc, cur) => { cur.playstyles.forEach((playstyle) => acc[playstyle]++); diff --git a/pages/api/freeagents/like.ts b/pages/api/freeagents/like.ts index 136a02554..1dfd567b1 100644 --- a/pages/api/freeagents/like.ts +++ b/pages/api/freeagents/like.ts @@ -19,7 +19,6 @@ const handler = async (req: NextApiRequest, res: NextApiResponse) => { }; export type FreeAgentLikeInfo = { - likersCount: number; likedPostIds: number[]; matchedPostIds: number[]; }; @@ -51,7 +50,6 @@ async function getHandler(req: NextApiRequest, res: NextApiResponse) { ); res.status(200).json({ - likersCount: post.likersPosts.length, likedPostIds: post.likedPosts.map((post) => post.id), matchedPostIds: post.likedPosts .filter((post) => likerPostIds.has(post.id)) diff --git a/pages/freeagents.tsx b/pages/freeagents.tsx index d407168d5..75de64173 100644 --- a/pages/freeagents.tsx +++ b/pages/freeagents.tsx @@ -1,4 +1,6 @@ import { + Alert, + AlertIcon, Box, Button, Center, @@ -8,6 +10,8 @@ import { Radio, RadioGroup, Stack, + Wrap, + WrapItem, } from "@chakra-ui/react"; import { t, Trans } from "@lingui/macro"; import { Playstyle } from "@prisma/client"; @@ -44,18 +48,21 @@ const FreeAgentsPage = () => { likesData, isLoading, usersPost, + matchedPosts, playstyleCounts, state, dispatch, } = useFreeAgents(); const [user] = useUser(); const router = useRouter(); + + const [postIdToScrollTo, setPostIdToScrollTo] = useState( + undefined + ); const postRef = useRef(null); const [modalIsOpen, setModalIsOpen] = useState(false); - const idToScrollTo = Number.isNaN(parseInt(router.query.id as any)) - ? undefined - : parseInt(router.query.id as any); + console.log("getIdToScrollTo", getIdToScrollTo()); useEffect(() => { if (!postRef.current) return; @@ -110,6 +117,14 @@ const FreeAgentsPage = () => { )} + {usersPost && likesData ? ( + setPostIdToScrollTo(id)} + /> + ) : ( + + )} {postsData.map((post) => ( { canLike={ !!user && post.user.discordId !== user.discordId && !!usersPost } - postRef={post.id === idToScrollTo ? postRef : undefined} + postRef={post.id === getIdToScrollTo() ? postRef : undefined} /> ))} ); + + function getIdToScrollTo() { + if (postIdToScrollTo) return postIdToScrollTo; + + return Number.isNaN(parseInt(router.query.id as any)) + ? undefined + : parseInt(router.query.id as any); + } +}; + +const MatchesInfo = ({ + matchedPosts, + focusOnMatch, +}: { + matchedPosts: (Unpacked | undefined)[]; + focusOnMatch: (id: number) => void; +}) => { + if (!matchedPosts.length) + return ( + + + + Once you match with other free agents they are shown here. + + + ); + + return ( + + + Matches + + + {matchedPosts.map((post) => + post ? ( + + focusOnMatch(post.id)} + cursor="pointer" + /> + + ) : null + )} + + + ); }; const playstyleToEmoji = { @@ -239,6 +301,7 @@ const FreeAgentCard = ({ aria-label="Like" size="lg" isRound + mt={4} variant="ghost" icon={isLiked ? : } onClick={handleClick} diff --git a/prisma/queries/getAllFreeAgentPosts.ts b/prisma/queries/getAllFreeAgentPosts.ts index a850d5a6f..2adee9772 100644 --- a/prisma/queries/getAllFreeAgentPosts.ts +++ b/prisma/queries/getAllFreeAgentPosts.ts @@ -5,8 +5,11 @@ export type GetAllFreeAgentPostsData = Prisma.PromiseReturnType< typeof getAllFreeAgentPosts >; -export const getAllFreeAgentPosts = async () => - prisma.freeAgentPost.findMany({ +export const getAllFreeAgentPosts = async () => { + const dateMonthAgo = new Date(); + dateMonthAgo.setMonth(dateMonthAgo.getMonth() - 1); + + const post = prisma.freeAgentPost.findMany({ select: { id: true, canVC: true, @@ -32,4 +35,10 @@ export const getAllFreeAgentPosts = async () => orderBy: { updatedAt: "desc", }, + where: { + updatedAt: { gte: dateMonthAgo }, + }, }); + + return post; +};