Hide save bar if no action is available (#735)

This commit is contained in:
Dominik Żegleń 2020-10-01 17:50:17 +02:00 committed by GitHub
parent 7cd3409bb3
commit 287a2eb8ed
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 47 additions and 44 deletions

View file

@ -136,7 +136,7 @@ const AttributePage: React.FC<AttributePageProps> = ({
return ( return (
<Form initial={initialForm} onSubmit={handleSubmit}> <Form initial={initialForm} onSubmit={handleSubmit}>
{({ change, data, submit }) => { {({ change, data, hasChanged, submit }) => {
const changeMetadata = makeMetadataChangeHandler(change); const changeMetadata = makeMetadataChangeHandler(change);
return ( return (
@ -185,7 +185,7 @@ const AttributePage: React.FC<AttributePageProps> = ({
</div> </div>
</Grid> </Grid>
<SaveButtonBar <SaveButtonBar
disabled={disabled} disabled={disabled || !hasChanged}
state={saveButtonBarState} state={saveButtonBarState}
onCancel={onBack} onCancel={onBack}
onSave={submit} onSave={submit}

View file

@ -80,12 +80,14 @@ export const SaveButtonBar: React.FC<SaveButtonBarProps> = props => {
const scrollPosition = useWindowScroll(); const scrollPosition = useWindowScroll();
const scrolledToBottom = const scrolledToBottom =
scrollPosition.y + window.innerHeight >= document.body.scrollHeight; scrollPosition.y + window.innerHeight >= document.body.scrollHeight;
const shouldDisplay = onDelete || !disabled;
return ( return (
<AppActionContext.Consumer> <AppActionContext.Consumer>
{anchor => {anchor =>
anchor ? ( anchor ? (
<Portal container={anchor.current}> <Portal container={anchor.current}>
{shouldDisplay && (
<div className={classes.root} {...rest}> <div className={classes.root} {...rest}>
<Container> <Container>
<Card elevation={scrolledToBottom ? 0 : 16}> <Card elevation={scrolledToBottom ? 0 : 16}>
@ -129,6 +131,7 @@ export const SaveButtonBar: React.FC<SaveButtonBarProps> = props => {
</Card> </Card>
</Container> </Container>
</div> </div>
)}
</Portal> </Portal>
) : null ) : null
} }

View file

@ -47,7 +47,7 @@ const CountryListPage: React.FC<CountryListPageProps> = ({
}; };
return ( return (
<Form initial={initialForm} onSubmit={onSubmit}> <Form initial={initialForm} onSubmit={onSubmit}>
{({ change, data, submit }) => ( {({ change, data, hasChanged, submit }) => (
<> <>
<Container> <Container>
<AppHeader onBack={onBack}> <AppHeader onBack={onBack}>
@ -77,7 +77,7 @@ const CountryListPage: React.FC<CountryListPageProps> = ({
</Grid> </Grid>
</Container> </Container>
<SaveButtonBar <SaveButtonBar
disabled={disabled} disabled={disabled || !hasChanged}
state={saveButtonBarState} state={saveButtonBarState}
onCancel={onBack} onCancel={onBack}
onSave={submit} onSave={submit}