Allow saving drafts when editing documents

kitsune/sumo/static/sumo/js/wiki.js

@@ -72,9 +72,12 @@ import collapsibleAccordionInit from "sumo/js/protocol-details-init";
       initCodeMirrorEditor();
     }
 
+    if ($body.is('.edit, .translate')) {
+      initDraft();
+    }
+
     if ($body.is('.translate')) {  // Translate page
       initToggleDiff();
-      initTranslationDraft();
     }
 
     initEditingTools();
@@ -599,7 +602,7 @@ import collapsibleAccordionInit from "sumo/js/protocol-details-init";
     }
   }
 
-  function initTranslationDraft() {
+  function initDraft() {
     var $draftButton = $('.btn-draft'),
       url = $('.btn-draft').data('draft-url'),
       $draftMessage = $('#draft-message');
@@ -610,7 +613,8 @@ import collapsibleAccordionInit from "sumo/js/protocol-details-init";
         bothData = $('#both_form').serializeArray(),
         docData = $('#doc_form').serializeArray(),
         revData = $('#rev_form').serializeArray(),
-        totalData = $.extend(bothData, docData, revData);
+        editData = $('#edit_form').serializeArray(),
+        totalData = $.extend(bothData, docData, revData, editData);
 
       $draftMessage.html(image + message).removeClass('success error').addClass('info').show()
       $.post(url, totalData)

kitsune/sumo/static/sumo/scss/components/_wiki.scss

@@ -262,8 +262,9 @@ article {
 }
 
 
-/* Document Translation page */
-#localize-document {
+/* Draft-related messages */
+#localize-document,
+#edit-document {
   .buttons-and-preview {
 
     /* Taken from Bootstrap V3 */

kitsune/wiki/content_managers.py

@@ -40,8 +40,8 @@ def save_draft(
 
         Args:
             user: The user creating the draft
-            parent_doc: The parent document being translated
-            target_locale: The target locale for translation
+            parent_doc: The parent document for the revision
+            target_locale: The target locale for the revision
             draft_data: Dictionary containing draft content (title, slug, content, summary, keywords, based_on)
         Returns:
             DraftRevision: The created or updated draft revision
@@ -57,7 +57,7 @@ def get_draft(self, user, parent_doc, target_locale: str) -> DraftRevision | Non
         Args:
             user: The user
             parent_doc: The parent document
-            target_locale: The target local
+            target_locale: The target locale
         Returns:
             DraftRevision or None: The existing draft if found
         """
@@ -281,7 +281,7 @@ def mark_ready_for_localization(
 
 
 class ManualContentManager(WikiContentManager):
-    """Content manager for manual translation workflow."""
+    """Content manager for manual edit/translation workflow."""
 
     pass
 

kitsune/wiki/jinja2/wiki/edit.html

@@ -23,6 +23,19 @@
         {{ _('This document is restricted.') }}
       </div>
     {% endif %}
+    {% if draft_revision %}
+      <li class="mzp-c-notification-bar mzp-t-info info">
+        <button class="mzp-c-notification-bar-button" type="button"></button>
+        <div>
+        <p><strong>{{ _('You have a draft revision for this article saved on {date_time}')|f(date_time=draft_revision.created) }}</strong></p>
+        <form action="{{ url('wiki.edit_document', document.slug) }}" method="post">
+          {% csrf_token %}
+          <input class="btn" name="restore" value={{ _('Restore') }} type="submit">
+          <input class="btn" name="discard" value={{ _('Discard') }} type="submit">
+        </form>
+        </div>
+      </li>
+    {% endif %}
     {{ edit_messages(document, show_revision_warning) }}
     {{ document_lock_warning() }}
   </div>
@@ -42,7 +55,7 @@ <h1 class="sumo-page-heading">{{ _('<em>Editing Content For:</em><br>{title}')|f
           <a href="{{ url }}">Support Document Guide</a>.{% endtrans %}
       </p>
       {{ errorlist(revision_form) }}
-      <form action="" method="post">
+      <form id="edit_form" action="" method="post">
         {% csrf_token %}
           {% for field in revision_form.visible_fields() %}
             <div class="field {% if field.name == 'content' %}has-large-textarea{% endif %}">
@@ -63,15 +76,18 @@ <h1 class="sumo-page-heading">{{ _('<em>Editing Content For:</em><br>{title}')|f
         <input type="hidden" name="form" value="rev" />
         <input type="hidden" name="slug" value="{{ document.slug }}" />
         <input type="hidden" name="locale" value="{{ document.locale }}" />
-        {{ submit_revision(revision_form, include_diff=True) }}
-        <div id="preview"></div>
-        <div id="preview-diff">
-          <div class="from">{{ revision_form.content.value() }}</div>
-          <div class="to"></div>
-          <div class="output"></div>
-        </div>
-        <div class="submit" id="preview-bottom">
-          {{ submit_revision(revision_form, buttons_only=True, include_diff=True) }}
+        <div class="buttons-and-preview">
+          {{ submit_revision(revision_form, include_diff=True, allow_draft=True) }}
+          <div id="preview"></div>
+          <div id="preview-diff">
+            <div class="from">{{ revision_form.content.value() }}</div>
+            <div class="to"></div>
+            <div class="output"></div>
+          </div>
+          <div class="submit" id="preview-bottom">
+            {{ submit_revision(revision_form, buttons_only=True, include_diff=True, allow_draft=True) }}
+          </div>
+          <div id="draft-message" class="alert" hidden>
         </div>
       </form>
     </article>

kitsune/wiki/jinja2/wiki/edit_metadata.html

@@ -2,7 +2,7 @@
 {% from "layout/errorlist.html" import errorlist %}
 {% from "wiki/includes/sidebar_modules.html" import document_tools with context %}
 {% from "includes/common_macros.html" import content_editor with context %}
-{% from "wiki/includes/document_macros.html" import edit_messages, submit_revision %}
+{% from "wiki/includes/document_macros.html" import edit_messages %}
 {% from "wiki/includes/document_macros.html" import document_lock_warning with context %}
 {% set title = _('Edit Article Metadata | {document}')|f(document=document.title) %}
 {# TODO: Change KB url to landing page when we have one #}

kitsune/wiki/jinja2/wiki/includes/document_macros.html

@@ -244,10 +244,10 @@ <h4 class="sumo-card-heading">{{ _('Content:') }}</h4>
   {% endif %}
 {%- endmacro %}
 
-{% macro submit_revision(form, buttons_only=False, show_no_update_checkbox=False, include_diff=False, translate=False) -%}
+{% macro submit_revision(form, buttons_only=False, show_no_update_checkbox=False, include_diff=False, allow_draft=False) -%}
   <div class="submit sumo-button-wrap reverse-on-desktop align-end">
     <button class="sumo-button primary-button btn-submit" type="submit">{{ _('Submit for Review') }}</button>
-    {% if translate %}
+    {% if allow_draft %}
       <button class="sumo-button secondary-button btn-draft" data-draft-url="{{ url('wiki.draft_revision') }}" type="button">{{ _('Save as Draft') }}</button>
     {% endif %}
     <button class="sumo-button secondary-button btn-preview" data-preview-url="{{ url('wiki.preview') }}" type="button">{{ _('Preview Content') }}</button>

kitsune/wiki/jinja2/wiki/translate.html

@@ -188,15 +188,15 @@ <h3 class="sumo-page-subheading">{{ _('{locale} translation:')|f(locale=language
             {# If the document has been created and has a current revision,
                we allow the localizer to keep the translation out of date
                with this new revision. #}
-            {{ submit_revision(revision_form, show_no_update_checkbox=(document and document.current_revision), include_diff=True, translate=True) }}
+            {{ submit_revision(revision_form, show_no_update_checkbox=(document and document.current_revision), include_diff=True, allow_draft=True) }}
             <div id="preview" class="cf"></div>
             <div id="preview-diff">
                 <div class="from">{{ revision_form.content.value() }}</div>
                 <div class="to"></div>
                 <div class="output"></div>
               </div>
             <div class="submit" id="preview-bottom">
-              {{ submit_revision(revision_form, buttons_only=True, include_diff=True, translate=True) }}
+              {{ submit_revision(revision_form, buttons_only=True, include_diff=True, allow_draft=True) }}
             </div>
             <div id="draft-message" class="alert" hidden>
             </div>

kitsune/wiki/views.py

@@ -564,18 +564,45 @@ def edit_document(request, document_slug, revision_id=None):
         return init_check
     user, doc, rev = init_check
 
-    rev_form = RevisionForm(instance=rev, initial={"based_on": rev.id, "comment": ""})
+    rev_initial = {"based_on": rev.id, "comment": ""}
+    rev_form = RevisionForm(instance=rev, initial=rev_initial)
+
+    # Check if the user has draft revision saved for the document (with the default locale)
+    content_manager = ManualContentManager()
+    draft = content_manager.get_draft(user, doc, settings.WIKI_DEFAULT_LANGUAGE)
 
     # POST
     if request.method == "POST":
-        rev_form = RevisionForm(request.POST)
-        rev_form.instance.document = doc  # for rev_form.clean()
-        if rev_form.is_valid():
-            _document_lock_clear(doc.id, user.username)
-            _save_rev_and_notify(rev_form, user, doc, base_rev=rev)
-            if "notify-future-changes" in request.POST:
-                EditDocumentEvent.notify(request.user, doc)
-            return HttpResponseRedirect(reverse("wiki.document_revisions", args=[document_slug]))
+        # Use POST for restoring and deleting drafts to avoid CSRF
+        restore_draft = "restore" in request.POST and bool(draft)
+        discard_draft = "discard" in request.POST and bool(draft)
+        # Make sure that one of the two is True but not both
+        if discard_draft ^ restore_draft:
+            if discard_draft and content_manager.discard_draft(draft.id, user):
+                return HttpResponseRedirect(
+                    urlparams(reverse("wiki.edit_document", args=[document_slug]))
+                )
+            elif restore_draft:
+                draft_data = content_manager.restore_draft(draft.id, user)
+
+                rev_initial.update(
+                    {
+                        "content": draft_data.get("content", ""),
+                        "summary": draft_data.get("summary", ""),
+                        "keywords": draft_data.get("keywords", ""),
+                        "based_on": draft_data.get("based_on"),
+                    }
+                )
+                rev_form = RevisionForm(instance=rev, initial=rev_initial)
+        else:
+            rev_form = RevisionForm(request.POST)
+            rev_form.instance.document = doc  # for rev_form.clean()
+            if rev_form.is_valid():
+                _document_lock_clear(doc.id, user.username)
+                _save_rev_and_notify(rev_form, user, doc, base_rev=rev)
+                if "notify-future-changes" in request.POST:
+                    EditDocumentEvent.notify(request.user, doc)
+                return HttpResponseRedirect(reverse("wiki.document_revisions", args=[document_slug]))
 
     show_revision_warning = _show_revision_warning(doc, rev)
     locked, locked_by = _document_lock(doc.id, user.username)
@@ -589,6 +616,7 @@ def edit_document(request, document_slug, revision_id=None):
             "show_revision_warning": show_revision_warning,
             "locked": locked,
             "locked_by": locked_by,
+            "draft_revision": draft,
         },
     )
 
@@ -665,7 +693,7 @@ def edit_document_metadata(request, document_slug, revision_id=None):
 def draft_revision(request):
     """Create a Draft Revision.
 
-    User can have only one draft revision for a translated document. Store the draft with
+    User can have only one draft revision for a document. Store the draft with
     parent document, user and locale. Get the parent document from the based on revision"""
     draft_form = DraftRevisionForm(request.POST)
     if draft_form.is_valid():