Support Issue forms and PR forms (#20987)

* feat: extend issue template for yaml

* feat: support yaml template

* feat: render form to markdown

* feat: support yaml template for pr

* chore: rename to Fields

* feat: template unmarshal

* feat: split template

* feat: render to markdown

* feat: use full name as template file name

* chore: remove useless file

* feat: use dropdown of fomantic ui

* feat: update input style

* docs: more comments

* fix: render text without render

* chore: fix lint error

* fix: support use description as about in markdown

* fix: add field class in form

* chore: generate swagger

* feat: validate template

* feat: support is_nummber and regex

* test: fix broken unit tests

* fix: ignore empty body of md template

* fix: make multiple easymde editors work in one page

* feat: better UI

* fix: js error in pr form

* chore: generate swagger

* feat: support regex validation

* chore: generate swagger

* fix: refresh each markdown editor

* chore: give up required validation

* fix: correct issue template candidates

* fix: correct checkboxes style

* chore: ignore .hugo_build.lock in docs

* docs: separate out a new doc for merge templates

* docs: introduce syntax of yaml template

* feat: show a alert for invalid templates

* test: add case for a valid template

* fix: correct attributes of required checkbox

* fix: add class not-under-easymde for dropzone

* fix: use more back-quotes

* chore: remove translation in zh-CN

* fix EasyMDE statusbar margin

* fix: remove repeated blocks

* fix: reuse regex for quotes

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>

web_src/js/features/comp/EasyMDE.js

@@ -93,7 +93,7 @@ export async function createCommentEasyMDE(textarea, easyMDEOptions = {}) {
       cm.execCommand('delCharBefore');
     },
   });
-  attachTribute(inputField, {mentions: true, emoji: true});
+  await attachTribute(inputField, {mentions: true, emoji: true});
   attachEasyMDEToElements(easyMDE);
   return easyMDE;
 }

web_src/js/features/repo-legacy.js

@@ -68,9 +68,14 @@ export function initRepoCommentForm() {
   }
 
   (async () => {
-    const $textarea = $commentForm.find('textarea:not(.review-textarea)');
-    const easyMDE = await createCommentEasyMDE($textarea);
-    initEasyMDEImagePaste(easyMDE, $commentForm.find('.dropzone'));
+    for (const textarea of $commentForm.find('textarea:not(.review-textarea, .no-easymde)')) {
+      // Don't initialize EasyMDE for the dormant #edit-content-form
+      if (textarea.closest('#edit-content-form')) {
+        continue;
+      }
+      const easyMDE = await createCommentEasyMDE(textarea);
+      initEasyMDEImagePaste(easyMDE, $commentForm.find('.dropzone'));
+    }
   })();
 
   initBranchSelector();
@@ -535,9 +540,13 @@ export function initRepository() {
       $(this).parent().hide();
 
       const $form = $repoComparePull.find('.pullrequest-form');
-      const easyMDE = getAttachedEasyMDE($form.find('textarea.edit_area'));
       $form.show();
-      easyMDE.codemirror.refresh();
+      $form.find('textarea.edit_area').each(function() {
+        const easyMDE = getAttachedEasyMDE($(this));
+        if (easyMDE) {
+          easyMDE.codemirror.refresh();
+        }
+      });
     });
   }
 

web_src/less/_base.less

@@ -2126,7 +2126,8 @@ table th[data-sortt-desc] {
   margin-top: inherit;
 }
 
-.flash-error details code {
+.flash-error details code,
+.flash-warning details code {
   display: block;
   text-align: left;
 }

web_src/less/codemirror/base.less

@@ -1,3 +1,7 @@
+.ui .field:not(:last-child) .EasyMDEContainer .editor-statusbar {
+  margin-bottom: -1em; // when there is a statusbar, the "margin-bottom: 1em" of the "field" is not needed, because the statusbar is likely a blank line
+}
+
 .EasyMDEContainer .CodeMirror {
   color: var(--color-input-text);
   background-color: var(--color-input-background);

web_src/less/features/dropzone.less

@@ -6,7 +6,6 @@
     padding: 0;
     border-radius: 4px;
     min-height: 0;
-    margin-top: -1em; // we have another `field` above, it's usually an EasyMDE editor with "status bar", so we do not need the space above.
     .dz-message {
       margin: 10px 0;
     }