Stop reverting PosePickerSupport with cache data

Oops, making changes in PosePickerSupport would sometimes trigger a re-fetch in PosePicker.

Specifically, PosePicker needs some fields that PosePickerSupport doesn't, so changing the canonical poses causes PosePicker to ask for stuff again—which will probably serve a SWR'd cached version that doesn't reflect the Support changes!

Here, we update the PosePickerSupport query to prefetch all the fields the PosePicker _would_ want for any of these poses. That way, if we swap in a new one as the canonical appearance for a pose, there's no refetch needed, and therefore no risk of hitting a stale cache.
This commit is contained in:
Emi Matchu 2021-04-23 16:05:52 -07:00
parent e955817acf
commit de27c4297d
2 changed files with 17 additions and 7 deletions

View file

@ -578,13 +578,7 @@ function usePoses(speciesId, colorId, selectedPose) {
} }
} }
fragment PetAppearanceForPosePicker on PetAppearance { ${petAppearanceForPosePickerFragment}
id
bodyId
pose
...PetAppearanceForOutfitPreview
}
${petAppearanceFragment}
`, `,
{ variables: { speciesId, colorId }, onError: (e) => console.error(e) } { variables: { speciesId, colorId }, onError: (e) => console.error(e) }
); );
@ -668,6 +662,16 @@ function getTransform(poseInfo) {
return transformsByBodyId.default; return transformsByBodyId.default;
} }
export const petAppearanceForPosePickerFragment = gql`
fragment PetAppearanceForPosePicker on PetAppearance {
id
bodyId
pose
...PetAppearanceForOutfitPreview
}
${petAppearanceFragment}
`;
const transformsByBodyId = { const transformsByBodyId = {
"93": "translate(-5px, 10px) scale(2.8)", "93": "translate(-5px, 10px) scale(2.8)",
"106": "translate(-8px, 8px) scale(2.9)", "106": "translate(-8px, 8px) scale(2.9)",

View file

@ -23,6 +23,7 @@ import HangerSpinner from "../../components/HangerSpinner";
import Metadata, { MetadataLabel, MetadataValue } from "./Metadata"; import Metadata, { MetadataLabel, MetadataValue } from "./Metadata";
import useSupport from "./useSupport"; import useSupport from "./useSupport";
import AppearanceLayerSupportModal from "./AppearanceLayerSupportModal"; import AppearanceLayerSupportModal from "./AppearanceLayerSupportModal";
import { petAppearanceForPosePickerFragment } from "../PosePicker";
function PosePickerSupport({ function PosePickerSupport({
speciesId, speciesId,
@ -64,11 +65,16 @@ function PosePickerSupport({
id id
name name
} }
# Also, anything the PosePicker wants that isn't here, so that we
# don't have to refetch anything when we change the canonical poses.
...PetAppearanceForPosePicker
} }
...CanonicalPetAppearances ...CanonicalPetAppearances
} }
${canonicalPetAppearancesFragment} ${canonicalPetAppearancesFragment}
${petAppearanceForPosePickerFragment}
`, `,
{ variables: { speciesId, colorId } } { variables: { speciesId, colorId } }
); );