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:
parent
0a9d736957
commit
3c54653646
2 changed files with 22 additions and 2 deletions
|
@ -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"
|
||||||
|
|
|
@ -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 {
|
||||||
|
|
Loading…
Reference in a new issue