Commit 09938c10 authored by Lyza Danger Gardner's avatar Lyza Danger Gardner

Add “Saving…” message when saving annotations

Re-implement “Saving…” message from legacy `Annotation` template

Fixes #1836
parent d2501f0c
...@@ -68,7 +68,7 @@ function AnnotationOmega({ ...@@ -68,7 +68,7 @@ function AnnotationOmega({
} }
}, [annotation, draft, createDraft, isSaving]); }, [annotation, draft, createDraft, isSaving]);
const shouldShowActions = !isEditing && !isNew(annotation); const shouldShowActions = !isSaving && !isEditing && !isNew(annotation);
const shouldShowLicense = isEditing && !isPrivate && group.type !== 'private'; const shouldShowLicense = isEditing && !isPrivate && group.type !== 'private';
const shouldShowReplyToggle = replyCount > 0 && !isReply(annotation); const shouldShowReplyToggle = replyCount > 0 && !isReply(annotation);
...@@ -159,6 +159,9 @@ function AnnotationOmega({ ...@@ -159,6 +159,9 @@ function AnnotationOmega({
buttonText={toggleText} buttonText={toggleText}
/> />
)} )}
{isSaving && (
<div className="annotation-omega__actions">Saving...</div>
)}
{shouldShowActions && ( {shouldShowActions && (
<div className="annotation-omega__actions"> <div className="annotation-omega__actions">
<AnnotationActionBar annotation={annotation} onReply={onReply} /> <AnnotationActionBar annotation={annotation} onReply={onReply} />
......
...@@ -93,8 +93,6 @@ describe('AnnotationOmega', () => { ...@@ -93,8 +93,6 @@ describe('AnnotationOmega', () => {
$imports.$restore(); $imports.$restore();
}); });
it('should test `isSaving`');
describe('annotation classnames', () => { describe('annotation classnames', () => {
it('should assign a reply class if the annotation is a reply', () => { it('should assign a reply class if the annotation is a reply', () => {
fakeMetadata.isReply.returns(true); fakeMetadata.isReply.returns(true);
...@@ -238,6 +236,25 @@ describe('AnnotationOmega', () => { ...@@ -238,6 +236,25 @@ describe('AnnotationOmega', () => {
); );
}); });
it('should show a "Saving" message when annotation is saving', () => {
setEditingMode(true);
const wrapper = createComponent();
act(() => {
wrapper
.find('AnnotationPublishControl')
.props()
.onSave();
});
wrapper.update();
assert.include(
wrapper.find('.annotation-omega__actions').text(),
'Saving...'
);
});
it('should flash an error message on failure', async () => { it('should flash an error message on failure', async () => {
setEditingMode(true); setEditingMode(true);
fakeAnnotationsService.save.rejects(); fakeAnnotationsService.save.rejects();
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment