UX fixes for item support drawer

One fix was that `position: absolute` stuff was appearing over the drawer, including the item search clear button, oof!

Another fix was for a weird bug(?) in Apollo Client, see comments
This commit is contained in:
Emi Matchu 2020-08-01 00:35:48 -07:00
parent 0a9d736957
commit 3c54653646
2 changed files with 22 additions and 2 deletions

View file

@ -44,7 +44,16 @@ function WardrobePage() {
}, [error, toast]); }, [error, toast]);
return ( return (
<Box position="absolute" top="0" bottom="0" left="0" right="0"> <Box
position="absolute"
top="0"
bottom="0"
left="0"
right="0"
// Create a stacking context, so that our drawers and modals don't fight
// with the z-indexes in here!
zIndex="0"
>
<Grid <Grid
templateAreas={{ templateAreas={{
base: `"previewAndControls" base: `"previewAndControls"

View file

@ -86,7 +86,18 @@ function SpecialColorFields({ item }) {
} }
} }
`, `,
{ variables: { itemId: item.id } } {
variables: { itemId: item.id },
// HACK: I think it's a bug in @apollo/client 3.1.1 that, if the
// optimistic response sets `manualSpecialColor` to null, the query
// doesn't update, even though its cache has updated :/
//
// This cheap trick of changing the display name every re-render
// persuades Apollo that this is a different query, so it re-checks
// its cache and finds the empty `manualSpecialColor`. Weird!
displayName: `ItemSupportDrawerManualSpecialColor-${new Date()}`,
}
); );
const { const {