diff --git a/src/app/ItemPage.js b/src/app/ItemPage.js
index 9e1dd0ba..aaa33f60 100644
--- a/src/app/ItemPage.js
+++ b/src/app/ItemPage.js
@@ -20,6 +20,7 @@ import {
} from "@chakra-ui/react";
import {
CheckIcon,
+ ChevronDownIcon,
ChevronRightIcon,
EditIcon,
StarIcon,
@@ -99,8 +100,8 @@ export function ItemPageContent({ itemId, isEmbedded }) {
isEmbedded={isEmbedded}
/>
- {isLoggedIn && }
+ {isLoggedIn && }
{!isEmbedded && }
@@ -147,6 +148,12 @@ function ItemPageOwnWantButtons({ itemId }) {
id
currentUserOwnsThis
currentUserWantsThis
+ currentUserHasInLists {
+ id
+ name
+ isDefaultList
+ ownsOrWantsItems
+ }
}
}
`,
@@ -157,14 +164,30 @@ function ItemPageOwnWantButtons({ itemId }) {
return {error.message};
}
+ const closetLists = data?.item?.currentUserHasInLists || [];
+ const ownedLists = closetLists.filter((cl) => cl.ownsOrWantsItems === "OWNS");
+ const wantedLists = closetLists.filter(
+ (cl) => cl.ownsOrWantsItems === "WANTS"
+ );
+
return (
-
-
+
+
+
-
+
+
+ );
+}
+
+function ItemPageOwnWantListsButton({ closetLists, isVisible }) {
+ const toast = useToast();
+
+ const realLists = closetLists.filter((cl) => !cl.isDefaultList);
+
+ let buttonText;
+ if (realLists.length === 1) {
+ buttonText = `In list "${realLists[0].name}"`;
+ } else if (realLists.length > 1) {
+ buttonText = `In ${realLists.length} lists`;
+ } else {
+ buttonText = "Add to list";
+ }
+
+ return (
+
+ toast({
+ status: "warning",
+ title: "Feature coming soon!",
+ description:
+ "I haven't built the cute pop-up for editing your lists yet! Neat concept though, right? 😅 —Matchu",
+ })
+ }
+ // Even when the button isn't visible, we still render it for layout
+ // purposes, but hidden and disabled.
+ opacity={isVisible ? 1 : 0}
+ aria-hidden={!isVisible}
+ disabled={!isVisible}
+ >
+ {/* Flex tricks to center the text, ignoring the caret */}
+
+ {buttonText}
+
+
+
+
);
}
diff --git a/src/server/types/Item.js b/src/server/types/Item.js
index 5656d146..b04abc33 100644
--- a/src/server/types/Item.js
+++ b/src/server/types/Item.js
@@ -35,6 +35,7 @@ const typeDefs = gql`
currentUserOwnsThis: Boolean! @cacheControl(maxAge: 0, scope: PRIVATE)
currentUserWantsThis: Boolean! @cacheControl(maxAge: 0, scope: PRIVATE)
+ currentUserHasInLists: [ClosetList!]! @cacheControl(maxAge: 0, scope: PRIVATE)
"""
How many users are offering/seeking this in their public trade lists.
@@ -337,6 +338,28 @@ const resolvers = {
const closetHangers = await userClosetHangersLoader.load(currentUserId);
return closetHangers.some((h) => h.itemId === id && !h.owned);
},
+ currentUserHasInLists: async (
+ { id },
+ _,
+ { currentUserId, userClosetHangersLoader }
+ ) => {
+ if (currentUserId == null) return false;
+ const closetHangers = await userClosetHangersLoader.load(currentUserId);
+ const itemHangers = closetHangers.filter((h) => h.itemId === id);
+ const listRefs = itemHangers.map((hanger) => {
+ if (hanger.listId) {
+ return { id: hanger.listId };
+ } else {
+ return {
+ id: null,
+ isDefaultList: true,
+ userId: hanger.userId,
+ ownsOrWantsItems: hanger.owned ? "OWNS" : "WANTS",
+ };
+ }
+ });
+ return listRefs;
+ },
numUsersOfferingThis: async (
{ id },