Only show Save if logged in

This commit is contained in:
Emi Matchu 2021-03-29 19:50:34 -07:00
parent 06ec0b0b52
commit 8487d9674a

View file

@ -25,6 +25,7 @@ import Item, { ItemListContainer, ItemListSkeleton } from "./Item";
import { BiRename } from "react-icons/bi"; import { BiRename } from "react-icons/bi";
import { IoCloudUploadOutline } from "react-icons/io5"; import { IoCloudUploadOutline } from "react-icons/io5";
import { MdMoreVert } from "react-icons/md"; import { MdMoreVert } from "react-icons/md";
import useCurrentUser from "../components/useCurrentUser";
/** /**
* ItemsPanel shows the items in the current outfit, and lets the user toggle * ItemsPanel shows the items in the current outfit, and lets the user toggle
@ -250,6 +251,8 @@ function ItemZoneGroupSkeleton({ itemCount }) {
* It also contains the outfit menu, for saving etc. * It also contains the outfit menu, for saving etc.
*/ */
function OutfitHeading({ outfitState, dispatchToOutfit }) { function OutfitHeading({ outfitState, dispatchToOutfit }) {
const { isLoggedIn } = useCurrentUser();
return ( return (
// The Editable wraps everything, including the menu, because the menu has // The Editable wraps everything, including the menu, because the menu has
// a Rename option. // a Rename option.
@ -274,24 +277,29 @@ function OutfitHeading({ outfitState, dispatchToOutfit }) {
</Box> </Box>
</Box> </Box>
<Box width="4" flex="1 0 auto" /> <Box width="4" flex="1 0 auto" />
<Tooltip label="Coming soon!" shouldWrapChildren> {isLoggedIn && (
<Button <>
variant="outline" <Tooltip label="Coming soon!" shouldWrapChildren>
size="sm" <Button
isDisabled variant="outline"
leftIcon={ size="sm"
<Box isDisabled
// Adjust the visual balance toward the cloud leftIcon={
marginBottom="-2px" <Box
// Adjust the visual balance toward the cloud
marginBottom="-2px"
>
<IoCloudUploadOutline />
</Box>
}
> >
<IoCloudUploadOutline /> Save
</Box> </Button>
} </Tooltip>
> <Box width="2" />
Save </>
</Button> )}
</Tooltip>
<Box width="2" />
<Menu placement="bottom-end"> <Menu placement="bottom-end">
<MenuButton <MenuButton
as={IconButton} as={IconButton}