From 580fd79b8c7e1ff8e25710be2303f067130cd9a1 Mon Sep 17 00:00:00 2001
From: Matchu <matchu1993@gmail.com>
Date: Wed, 3 Feb 2021 16:14:08 -0800
Subject: [PATCH] Fix loading state after each species face click

---
 src/app/ItemPage.js | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/src/app/ItemPage.js b/src/app/ItemPage.js
index 88facb2..e254528 100644
--- a/src/app/ItemPage.js
+++ b/src/app/ItemPage.js
@@ -545,6 +545,11 @@ function ItemPageOutfitPreview({ itemId }) {
     }
   };
 
+  // We don't need to reload this query when preferred species/color change, so
+  // cache their initial values here to use as query arguments.
+  const [initialPreferredSpeciesId] = React.useState(preferredSpeciesId);
+  const [initialPreferredColorId] = React.useState(preferredColorId);
+
   // Start by loading the "canonical" pet and item appearance for the outfit
   // preview. We'll use this to initialize both the preview and the picker.
   //
@@ -600,7 +605,11 @@ function ItemPageOutfitPreview({ itemId }) {
       ${petAppearanceFragment}
     `,
     {
-      variables: { itemId, preferredSpeciesId, preferredColorId },
+      variables: {
+        itemId,
+        preferredSpeciesId: initialPreferredSpeciesId,
+        preferredColorId: initialPreferredColorId,
+      },
       onCompleted: (data) => {
         const canonicalBody = data?.item?.canonicalAppearance?.body;
         const canonicalPetAppearance = canonicalBody?.canonicalAppearance;