import React from "react";
import { Badge, Box } from "@chakra-ui/core";
import gql from "graphql-tag";
import { useQuery } from "@apollo/client";
import { Delay } from "./util";
import HangerSpinner from "./components/HangerSpinner";
import { Heading1, Heading2, usePageTitle } from "./util";
import ItemCard, {
ItemBadgeList,
ItemCardList,
YouOwnThisBadge,
} from "./components/ItemCard";
function ModelingPage() {
usePageTitle("Modeling Hub");
return (
Modeling Hub
);
}
function ItemModelsSection() {
const { loading, error, data } = useQuery(gql`
query ModelingPage {
standardItems: itemsThatNeedModels {
...ItemFields
speciesThatNeedModels {
id
name
}
}
babyItems: itemsThatNeedModels(colorId: "6") {
...ItemFields
speciesThatNeedModels(colorId: "6") {
id
name
}
}
maraquanItems: itemsThatNeedModels(colorId: "44") {
...ItemFields
speciesThatNeedModels(colorId: "44") {
id
name
}
}
mutantItems: itemsThatNeedModels(colorId: "46") {
...ItemFields
speciesThatNeedModels(colorId: "46") {
id
name
}
}
currentUser {
itemsTheyOwn {
id
}
}
}
fragment ItemFields on Item {
id
name
thumbnailUrl
}
`);
if (loading) {
return (
<>
Items we need modeled
Checking all the items…
>
);
}
if (error) {
return {error.message};
}
const ownedItemIds = new Set(
data.currentUser?.itemsTheyOwn?.map((item) => item.id)
);
return (
<>
Items we need modeled
Items we need modeled on Baby pets
Items we need modeled on Maraquan pets
Items we need modeled on Mutant pets
>
);
}
function ItemModelsColorSection({ items, ownedItemIds }) {
items = items
// enough MMEs are broken that I just don't want to deal right now!
// TODO: solve this with our new database omission feature instead?
.filter((item) => !item.name.includes("MME"))
.sort((a, b) => a.name.localeCompare(b.name));
return (
{items.map((item) => (
))}
);
}
function ItemModelCard({ item, currentUserOwnsItem, ...props }) {
const badges = (
);
return ;
}
function ItemModelBadges({ item, currentUserOwnsItem }) {
return (
{currentUserOwnsItem && }
{item.speciesThatNeedModels.map((species) => (
{species.name}
))}
);
}
export default ModelingPage;