1 files changed, 49 insertions, 2 deletions
diff --git a/app/assets/javascripts/vue_shared/components/markdown/markdown_editor.vue b/app/assets/javascripts/vue_shared/components/markdown/markdown_editor.vue
index 93583907a11..52d8aab30d5 100644
--- a/app/assets/javascripts/vue_shared/components/markdown/markdown_editor.vue
+++ b/app/assets/javascripts/vue_shared/components/markdown/markdown_editor.vue
@@ -20,6 +20,11 @@ export default {
       type: String,
       required: true,
     },
+    setFacade: {
+      type: Function,
+      required: false,
+      default: null,
+    },
     renderMarkdownPath: {
       type: String,
       required: true,
@@ -44,6 +49,16 @@ export default {
       required: false,
       default: false,
     },
+    enableAutocomplete: {
+      type: Boolean,
+      required: false,
+      default: true,
+    },
+    autocompleteDataSources: {
+      type: Object,
+      required: false,
+      default: () => ({}),
+    },
     supportsQuickActions: {
       type: Boolean,
       required: false,
@@ -54,6 +69,11 @@ export default {
       required: false,
       default: null,
     },
+    markdownDocsPath: {
+      type: String,
+      required: false,
+      default: '',
+    },
     quickActionsDocsPath: {
       type: String,
       required: false,
@@ -97,9 +117,25 @@ export default {
   mounted() {
     this.autofocusTextarea();
 
+    this.$emit('input', this.markdown);
     this.saveDraft();
+
+    this.setFacade?.({
+      getValue: () => this.getValue(),
+      setValue: (val) => this.setValue(val),
+    });
   },
   methods: {
+    getValue() {
+      return this.markdown;
+    },
+    setValue(value) {
+      this.markdown = value;
+      this.$emit('input', value);
+
+      this.saveDraft();
+      this.autosizeTextarea();
+    },
     updateMarkdownFromContentEditor({ markdown }) {
       this.markdown = markdown;
       this.$emit('input', markdown);
@@ -121,6 +157,11 @@ export default {
       this.notifyEditingModeChange(editingMode);
     },
     onEditingModeRestored(editingMode) {
+      if (editingMode === EDITING_MODE_CONTENT_EDITOR && !this.enableContentEditor) {
+        this.editingMode = EDITING_MODE_MARKDOWN_FIELD;
+        return;
+      }
+
       this.editingMode = editingMode;
       this.$emit(editingMode);
       this.notifyEditingModeChange(editingMode);
@@ -161,7 +202,8 @@ export default {
   <div>
     <local-storage-sync
       v-model="editingMode"
-      storage-key="gl-wiki-content-editor-enabled"
+      as-string
+      storage-key="gl-markdown-editor-mode"
       @input="onEditingModeRestored"
     />
     <markdown-field
@@ -173,11 +215,14 @@ export default {
       can-attach-file
       :textarea-value="markdown"
       :uploads-path="uploadsPath"
+      :enable-autocomplete="enableAutocomplete"
+      :autocomplete-data-sources="autocompleteDataSources"
+      :markdown-docs-path="markdownDocsPath"
       :quick-actions-docs-path="quickActionsDocsPath"
       :show-content-editor-switcher="enableContentEditor"
       :drawio-enabled="drawioEnabled"
-      class="bordered-box"
       @enableContentEditor="onEditingModeChange('contentEditor')"
+      @handleSuggestDismissed="() => $emit('handleSuggestDismissed')"
     >
       <template #textarea>
         <textarea
@@ -205,6 +250,8 @@ export default {
         :autofocus="contentEditorAutofocused"
         :placeholder="formFieldProps.placeholder"
         :drawio-enabled="drawioEnabled"
+        :enable-autocomplete="enableAutocomplete"
+        :autocomplete-data-sources="autocompleteDataSources"
         :editable="!disabled"
         @initialized="setEditorAsAutofocused"
         @change="updateMarkdownFromContentEditor"