pgadmin4/web/pgadmin/static/js/SchemaView/SaveButton.jsx

60 lines
1.6 KiB
JavaScript

/////////////////////////////////////////////////////////////
//
// pgAdmin 4 - PostgreSQL Tools
//
// Copyright (C) 2013 - 2024, The pgAdmin Development Team
// This software is released under the PostgreSQL Licence
//
//////////////////////////////////////////////////////////////
import React, { useContext, useEffect, useState } from 'react';
import { PrimaryButton } from 'sources/components/Buttons';
import { SchemaStateContext } from './SchemaState';
import PropTypes from 'prop-types';
export function SaveButton({
label, icon, checkDirtyOnEnableSave, onClick, mode,
}) {
const [key, setKey] = useState(0);
const schemaState = useContext(SchemaStateContext);
const checkDisabled = (state) => {
const {isDirty, isSaving, errors} = state;
return (
isSaving ||
!(mode === 'edit' || checkDirtyOnEnableSave ? isDirty : true) ||
Boolean(errors.name)
);
};
const currState = schemaState.state();
const isDisabled = checkDisabled(currState);
useEffect(() => {
if (!schemaState) return;
const refreshOnDisableStateChanged = (newState) => {
if (isDisabled !== checkDisabled(newState)) setKey(Date.now());
};
return schemaState.subscribe([], refreshOnDisableStateChanged, 'states');
}, [key]);
return (
<PrimaryButton
data-test='Save' onClick={onClick} startIcon={icon}
disabled={isDisabled}
>
{label}
</PrimaryButton>
);
}
SaveButton.propTypes = {
label: PropTypes.string,
icon: PropTypes.any,
onClick: PropTypes.func,
checkDirtyOnEnableSave: PropTypes.bool,
mode: PropTypes.string,
};