import { LoadingSpinner } from '@sourcegraph/react-loading-spinner';
import AlertCircleIcon from 'mdi-react/AlertCircleIcon';
import CheckIcon from 'mdi-react/CheckIcon';
import CloseIcon from 'mdi-react/CloseIcon';
import * as React from 'react';
export const SaveToolbar = ({ dirty, disabled, saving, error, onSave, onDiscard }) => {
    const saveDiscardDisabled = saving || !dirty;
    let saveDiscardTitle;
    if (saving) {
        saveDiscardTitle = 'Saving...';
    }
    else if (!dirty) {
        saveDiscardTitle = 'No changes to save or discard';
    }
    return (React.createElement(React.Fragment, null,
        error &&
            !saving && (React.createElement("div", { className: "save-toolbar__error" },
            React.createElement(AlertCircleIcon, { className: "icon-inline save-toolbar__error-icon" }),
            error.message)),
        React.createElement("div", { className: "save-toolbar__actions" },
            React.createElement("button", { disabled: saveDiscardDisabled, title: saveDiscardTitle || 'Save changes', className: "btn btn-sm btn-success save-toolbar__item save-toolbar__btn save-toolbar__btn-first", onClick: onSave },
                React.createElement(CheckIcon, { className: "icon-inline" }),
                " Save changes"),
            React.createElement("button", { disabled: saveDiscardDisabled, title: saveDiscardTitle || 'Discard changes', className: "btn btn-sm btn-secondary save-toolbar__item save-toolbar__btn save-toolbar__btn-last", onClick: onDiscard },
                React.createElement(CloseIcon, { className: "icon-inline" }),
                " Discard"),
            saving && (React.createElement("span", { className: "save-toolbar__item save-toolbar__message" },
                React.createElement(LoadingSpinner, { className: "icon-inline" }),
                " Saving...")))));
};
//# sourceMappingURL=SaveToolbar.js.map