scripts/extensions/videoEditor/src/VideoEditorHeader.tsx
import * as React from 'react';
interface IProps {
isDirty: boolean;
onClose: () => void;
onReset: () => void;
onSave: () => void;
gettext: (text: string) => string;
isVideoLoading: boolean;
}
export class VideoEditorHeader extends React.PureComponent<IProps> {
render() {
const {gettext} = this.props;
return (
<>
{!this.props.isVideoLoading && this.props.isDirty ? (
<div className="modal__sliding-toolbar">
<div className="sliding-toolbar__inner" />
<button className="btn btn--primary btn--ui-dark btn--hollow" onClick={this.props.onReset}>
{gettext('Cancel')}
</button>
<button className="btn btn--primary btn--ui-dark sd-margin-l-2" onClick={this.props.onSave}>
{gettext('Save')}
</button>
</div>
) : (
<button className="btn btn--primary btn--ui-dark btn--hollow" onClick={this.props.onClose}>
{gettext('Done')}
</button>
)}
</>
);
}
}