From 29ca2306afa67ac6d2f95761f5e6d715772f8e90 Mon Sep 17 00:00:00 2001
From: Matchu <matchu1993@gmail.com>
Date: Sun, 11 Jul 2021 21:27:24 -0700
Subject: [PATCH] Oops, fix items drawn for multiple colors

Just a little display bug on the homepage. For an item like the "Evil Coconut Half Mask", which was specifically drawn for the standard _and_ major special colors, our previous logic would have said "Baby only" or "Maraquan only" or whatever special color it happened to find first.

Now, we only show the case "Baby only" if it _doesn't_ fit standard pets too.

Note that the Maraquan case is tricky, because the Blue Mynci can also wear Maraquan items lol! For this reason, we check for two standard bodies before declaring that it's meant for standard pets.
---
 src/app/HomePage.js | 31 ++++++++++++++++++++++++++++---
 1 file changed, 28 insertions(+), 3 deletions(-)

diff --git a/src/app/HomePage.js b/src/app/HomePage.js
index caf7b9bd..8b7e59d3 100644
--- a/src/app/HomePage.js
+++ b/src/app/HomePage.js
@@ -375,7 +375,19 @@ function NewItemsSectionContent() {
   const { loading, error, data } = useQuery(
     gql`
       query NewItemsSection {
-        newestItems {
+        newestItems: items(
+          ids: [
+            "81546"
+            "35082"
+            "75149"
+            "81797"
+            "58741"
+            "78953"
+            "82427"
+            "82727"
+            "82726"
+          ]
+        ) {
           id
           name
           thumbnailUrl
@@ -488,6 +500,9 @@ function NewItemsSectionContent() {
 }
 
 function ItemModelingSummary({ item }) {
+  // NOTE: To test this logic, I like to swap out `newestItems` in the query:
+  //       `newestItems: items(ids: ["81546", "35082", "75149", "81797", "58741", "78953", "82427", "82727", "82726"])`
+
   if (item.speciesThatNeedModels.length > 0) {
     return (
       <Box fontSize="xs" fontStyle="italic" fontWeight="600" opacity="0.8">
@@ -507,9 +522,19 @@ function ItemModelingSummary({ item }) {
     );
   }
 
+  // HACK: The Maraquan Mynci and the Blue Mynci have the same body, so to test
+  //       whether something is *meant* for standard colors, we check for more
+  //       than
+  const standardBodies = bodies.filter(
+    (b) => b.canonicalAppearance.color.isStandard
+  );
+  const isMeantForStandardBodies = standardBodies.length >= 2;
+
   const colors = bodies.map((b) => b.canonicalAppearance.color);
   const specialColor = colors.find((c) => !c.isStandard);
-  if (specialColor && bodies.length === 1) {
+  const hasSpecialColorOnly = !isMeantForStandardBodies && specialColor != null;
+
+  if (hasSpecialColorOnly && bodies.length === 1) {
     return (
       <Box fontSize="xs" fontStyle="italic" opacity="0.8">
         {specialColor.name} {bodies[0].species.name} only
@@ -525,7 +550,7 @@ function ItemModelingSummary({ item }) {
     );
   }
 
-  if (specialColor) {
+  if (hasSpecialColorOnly) {
     return (
       <Box fontSize="xs" fontStyle="italic" opacity="0.8">
         {specialColor.name} only