Hide save bar if no action is available (#735)
This commit is contained in:
parent
7cd3409bb3
commit
287a2eb8ed
3 changed files with 47 additions and 44 deletions
|
@ -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}
|
||||||
|
|
|
@ -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
|
||||||
}
|
}
|
||||||
|
|
|
@ -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}
|
||||||
|
|
Loading…
Reference in a new issue