Add latest changes from gitlab-org/gitlab@master

3 files changed, 24 insertions, 11 deletions

diff --git a/app/assets/javascripts/static_site_editor/components/edit_area.vue b/app/assets/javascripts/static_site_editor/components/edit_area.vue
index 56f1a26f005..5b2d0207e98 100644
--- a/app/assets/javascripts/static_site_editor/components/edit_area.vue
+++ b/app/assets/javascripts/static_site_editor/components/edit_area.vue
@@ -50,12 +50,12 @@ export default {
   },
   data() {
     return {
-      saveable: false,
       parsedSource: parseSourceFile(this.preProcess(true, this.content)),
       editorMode: EDITOR_TYPES.wysiwyg,
-      isModified: false,
       hasMatter: false,
       isDrawerOpen: false,
+      isModified: false,
+      isSaveable: false,
     };
   },
   imageRepository: imageRepository(),
@@ -85,8 +85,11 @@ export default {
       return templatedContent;
     },
     refreshEditHelpers() {
-      this.isModified = this.parsedSource.isModified();
-      this.hasMatter = this.parsedSource.hasMatter();
+      const { isModified, hasMatter, isMatterValid } = this.parsedSource;
+      this.isModified = isModified();
+      this.hasMatter = hasMatter();
+      const hasValidMatter = this.hasMatter ? isMatterValid() : true;
+      this.isSaveable = this.isModified && hasValidMatter;
     },
     onDrawerOpen() {
       this.isDrawerOpen = true;
@@ -142,12 +145,12 @@ export default {
       @input="onInputChange"
       @uploadImage="onUploadImage"
     />
-    <unsaved-changes-confirm-dialog :modified="isModified" />
+    <unsaved-changes-confirm-dialog :modified="isSaveable" />
     <publish-toolbar
       class="gl-fixed gl-left-0 gl-bottom-0 gl-w-full"
       :has-settings="hasSettings"
       :return-url="returnUrl"
-      :saveable="isModified"
+      :saveable="isSaveable"
       :saving-changes="savingChanges"
       @editSettings="onDrawerOpen"
       @submit="onSubmit"
diff --git a/app/assets/javascripts/static_site_editor/services/front_matterify.js b/app/assets/javascripts/static_site_editor/services/front_matterify.js
index cbf0fffd515..60a5d799d11 100644
--- a/app/assets/javascripts/static_site_editor/services/front_matterify.js
+++ b/app/assets/javascripts/static_site_editor/services/front_matterify.js
@@ -16,6 +16,7 @@ export const frontMatterify = source => {
   const NO_FRONTMATTER = {
     source,
     matter: null,
+    hasMatter: false,
     spacing: null,
     content: source,
     delimiter: null,
@@ -53,6 +54,7 @@ export const frontMatterify = source => {
   return {
     source,
     matter,
+    hasMatter: true,
     spacing,
     content,
     delimiter,
diff --git a/app/assets/javascripts/static_site_editor/services/parse_source_file.js b/app/assets/javascripts/static_site_editor/services/parse_source_file.js
index d4fc8b2edb6..39126eb7bcc 100644
--- a/app/assets/javascripts/static_site_editor/services/parse_source_file.js
+++ b/app/assets/javascripts/static_site_editor/services/parse_source_file.js
@@ -1,15 +1,18 @@
 import { frontMatterify, stringify } from './front_matterify';
 
 const parseSourceFile = raw => {
-  const remake = source => frontMatterify(source);
-
-  let editable = remake(raw);
+  let editable;
 
   const syncContent = (newVal, isBody) => {
     if (isBody) {
       editable.content = newVal;
     } else {
-      editable = remake(newVal);
+      try {
+        editable = frontMatterify(newVal);
+        editable.isMatterValid = true;
+      } catch (e) {
+        editable.isMatterValid = false;
+      }
     }
   };
 
@@ -23,10 +26,15 @@ const parseSourceFile = raw => {
 
   const isModified = () => stringify(editable) !== raw;
 
-  const hasMatter = () => Boolean(editable.matter);
+  const hasMatter = () => editable.hasMatter;
+
+  const isMatterValid = () => editable.isMatterValid;
+
+  syncContent(raw);
 
   return {
     matter,
+    isMatterValid,
     syncMatter,
     content,
     syncContent,