OpenNeo/impress-2020
OpenNeo/impress-2020
1
0
Fork 0
Code Pull requests Activity

Hide species/color on wardrobe page when not ready

Browse source 
If the species/color of the current outfit aren't available yet (e.g. a saved outfit is still loading in), hide the picker altogether. This is because the picker can't handle change events during that time, and it's easier to just hide all this than to add special case handlers like disabled states! (And, while placeholders are often helpful, I'm not sure the placeholder dropdowns are any better than empty space in this case.)

This can also happen when the user loads a page without a species/color ready, like just going straight to `/outfits/new`. I think I might want to add a handler for that, though.

Resolves the direct cause of Sentry issue IMPRESS-2020-8, though I'm not sure how the user got to the URL `/outfits/new?[object+Object]=&objects[]=35185&objects[]=67084` in the first place...
This commit is contained in:
Emi Matchu 2021-01-17 07:24:54 -08:00
parent 33ee4455a7
commit f1dd3bffa6
1 changed files with 22 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/app/WardrobePage/OutfitControls.js
View file

@ -172,6 +172,7 @@ function OutfitControls({
</Box>
</Stack>
<Box gridArea="space" onClick={maybeUnlockFocus} />
{outfitState.speciesId && outfitState.colorId && (
<Flex gridArea="picker" justify="center" onClick={maybeUnlockFocus}>
{/**
* We try to center the species/color picker, but the left spacer will
@ -180,6 +181,7 @@ function OutfitControls({
<Box flex="1 1 0" />
<Box flex="0 0 auto">
<DarkMode>
{
<SpeciesColorPicker
speciesId={outfitState.speciesId}
colorId={outfitState.colorId}
@ -187,9 +189,9 @@ function OutfitControls({
onChange={onSpeciesColorChange}
stateMustAlwaysBeValid
/>
}
</DarkMode>
</Box>
{outfitState.speciesId && outfitState.colorId && (
<Flex flex="1 1 0" align="center" pl="4">
<PosePicker
speciesId={outfitState.speciesId}
@ -201,8 +203,8 @@ function OutfitControls({
onUnlockFocus={onUnlockFocus}
/>
</Flex>
)}
</Flex>
)}
</Box>
)}
</ClassNames>