* Add myself to core contributors * add myself to the core contributors * implement autosave in sessionStorage * clear sessionstorage on save * add new changes flag * add clear button and css for it * add clear button functionality * make clear session storage only run if save is successful * update jest snapshot for autosave * add a few tests * add a few tests * add test for clear button * make autosave work for title, tags, and cover image * remove console.log * make clear button into a message instead * move to button with no styling instead of span * remove warning on refresh * remove warning on refresh * move to localstorage so that persists across tabs * fix blip on change from HTML to JSX * make confirm work properly * fix css jump for v2 editor * fix v2 editor height jump * remove unused onKeyUp prop * indent _v2_form.html.erb file * indent v2 editor erb * Update package.json with missing package
52 lines
1.1 KiB
JavaScript
52 lines
1.1 KiB
JavaScript
import { h } from 'preact';
|
|
import PropTypes from 'prop-types';
|
|
|
|
const PublishToggle = ({
|
|
previewShowing,
|
|
onPreview,
|
|
onSaveDraft,
|
|
onPublish,
|
|
onHelp,
|
|
published,
|
|
helpShowing,
|
|
edited,
|
|
onClearChanges,
|
|
}) => (
|
|
<div className="articleform__buttons">
|
|
<button
|
|
onClick={onHelp}
|
|
className={
|
|
helpShowing
|
|
? 'articleform__buttons--small active'
|
|
: 'articleform__buttons--small inactive'
|
|
}
|
|
>
|
|
?
|
|
</button>
|
|
<button
|
|
onClick={onPreview}
|
|
className={previewShowing ? 'active' : 'inactive'}
|
|
>
|
|
PREVIEW
|
|
</button>
|
|
{published ? '' : <button onClick={onSaveDraft}>SAVE DRAFT</button>}
|
|
<span>
|
|
<p style={!edited && { visibility: 'hidden' }}>
|
|
New Changes (
|
|
<button onClick={onClearChanges} className="clear-button">
|
|
clear
|
|
</button>
|
|
)
|
|
</p>
|
|
<button onClick={onPublish} className="articleform__buttons--publish">
|
|
{published ? 'SAVE CHANGES' : 'PUBLISH'}
|
|
</button>
|
|
</span>
|
|
</div>
|
|
);
|
|
|
|
PublishToggle.propTypes = {
|
|
defaultValue: PropTypes.string.isRequired,
|
|
};
|
|
|
|
export default PublishToggle;
|