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>

12 files changed, 130 insertions, 10 deletions

diff --git a/templates/base/alert.tmpl b/templates/base/alert.tmpl
index cf886f529c..b8a04b89a9 100644
--- a/templates/base/alert.tmpl
+++ b/templates/base/alert.tmpl
@@ -13,3 +13,8 @@
 		<p>{{.Flash.InfoMsg | Str2html}}</p>
 	</div>
 {{end}}
+{{if .Flash.WarningMsg}}
+	<div class="ui warning message flash-warning">
+		<p>{{.Flash.WarningMsg | Str2html}}</p>
+	</div>
+{{end}}
diff --git a/templates/repo/diff/compare.tmpl b/templates/repo/diff/compare.tmpl
index 5875efaac3..e9f2fc3b60 100644
--- a/templates/repo/diff/compare.tmpl
+++ b/templates/repo/diff/compare.tmpl
@@ -11,6 +11,14 @@
 			{{.locale.Tr "action.compare_commits_general"}}
 		{{end}}
 	</h2>
+	{{if .Flash.WarningMsg}}
+		{{/*
+			There's alreay a importing of alert.tmpl in new_form.tmpl,
+			but only the negative message will be displayed within forms for some reasons, see semantic.css:10659.
+			To avoid repeated negative messages, the importing here if for .Flash.WarningMsg only.
+		*/}}
+		{{template "base/alert" .}}
+	{{end}}
 	{{$BaseCompareName := $.BaseName -}}
 	{{- $HeadCompareName := $.HeadRepo.OwnerName -}}
 	{{- if and (eq $.BaseName $.HeadRepo.OwnerName) (ne $.Repository.Name $.HeadRepo.Name) -}}
diff --git a/templates/repo/issue/choose.tmpl b/templates/repo/issue/choose.tmpl
index bbddd6d9a6..609cd48436 100644
--- a/templates/repo/issue/choose.tmpl
+++ b/templates/repo/issue/choose.tmpl
@@ -2,6 +2,7 @@
 <div class="page-content repository new issue">
 	{{template "repo/header" .}}
 	<div class="ui container">
+		{{template "base/alert" .}}
 		<div class="navbar">
 			{{template "repo/issue/navbar" .}}
 		</div>
diff --git a/templates/repo/issue/comment_tab.tmpl b/templates/repo/issue/comment_tab.tmpl
index c1ca69dfb3..b70433a966 100644
--- a/templates/repo/issue/comment_tab.tmpl
+++ b/templates/repo/issue/comment_tab.tmpl
@@ -1,17 +1,34 @@
-<div class="ui top tabular menu" data-write="write" data-preview="preview">
-	<a class="active item" data-tab="write">{{.locale.Tr "write"}}</a>
-	<a class="item" data-tab="preview" data-url="{{.Repository.HTMLURL}}/markdown" data-context="{{.RepoLink}}">{{.locale.Tr "preview"}}</a>
-</div>
-<div class="field">
-	<div class="ui bottom active tab" data-tab="write">
+{{if .Fields}}
+	<input type="hidden" name="template-file" value="{{.TemplateFile}}">
+	{{range .Fields}}
+		{{if eq .Type "input"}}
+			{{template "repo/issue/fields/input" .}}
+		{{else if eq .Type "markdown"}}
+			{{template "repo/issue/fields/markdown" .}}
+		{{else if eq .Type "textarea"}}
+			{{template "repo/issue/fields/textarea" .}}
+		{{else if eq .Type "dropdown"}}
+			{{template "repo/issue/fields/dropdown" .}}
+		{{else if eq .Type "checkboxes"}}
+			{{template "repo/issue/fields/checkboxes" .}}
+		{{end}}
+	{{end}}
+{{else}}
+	<div class="ui top tabular menu" data-write="write" data-preview="preview">
+		<a class="active item" data-tab="write">{{.locale.Tr "write"}}</a>
+		<a class="item" data-tab="preview" data-url="{{.Repository.HTMLURL}}/markdown" data-context="{{.RepoLink}}">{{.locale.Tr "preview"}}</a>
+	</div>
+	<div class="field">
+		<div class="ui bottom active tab" data-tab="write">
 		<textarea id="content" class="edit_area js-quick-submit" name="content" tabindex="4" data-id="issue-{{.RepoName}}" data-url="{{.Repository.HTMLURL}}/markdown" data-context="{{.Repo.RepoLink}}">
 			{{- if .BodyQuery}}{{.BodyQuery}}{{else if .IssueTemplate}}{{.IssueTemplate}}{{else if .PullRequestTemplate}}{{.PullRequestTemplate}}{{else}}{{.content}}{{end -}}
 		</textarea>
+		</div>
+		<div class="ui bottom tab markup" data-tab="preview">
+			{{.locale.Tr "loading"}}
+		</div>
 	</div>
-	<div class="ui bottom tab markup" data-tab="preview">
-		{{.locale.Tr "loading"}}
-	</div>
-</div>
+{{end}}
 {{if .IsAttachmentEnabled}}
 	<div class="field">
 		{{template "repo/upload" .}}
diff --git a/templates/repo/issue/fields/checkboxes.tmpl b/templates/repo/issue/fields/checkboxes.tmpl
new file mode 100644
index 0000000000..b70334681f
--- /dev/null
+++ b/templates/repo/issue/fields/checkboxes.tmpl
@@ -0,0 +1,12 @@
+<div class="field">
+	{{template "repo/issue/fields/header" .}}
+	{{$field := .}}
+	{{range $i, $opt := .Attributes.options}}
+		<div class="field">
+			<div class="ui checkbox">
+				<input type="checkbox" name="form-field-{{$field.ID}}-{{$i}}" {{if $opt.required}}readonly checked{{end}}>
+				<label>{{$opt.label}}</label>
+			</div>
+		</div>
+	{{end}}
+</div>
diff --git a/templates/repo/issue/fields/dropdown.tmpl b/templates/repo/issue/fields/dropdown.tmpl
new file mode 100644
index 0000000000..83c2bb4aac
--- /dev/null
+++ b/templates/repo/issue/fields/dropdown.tmpl
@@ -0,0 +1,14 @@
+<div class="field">
+	{{template "repo/issue/fields/header" .}}
+	{{/* FIXME: required validation */}}
+	<div class="ui fluid selection dropdown {{if .Attributes.multiple}}multiple clearable{{end}}">
+		<input type="hidden" name="form-field-{{.ID}}" value="0">
+		<i class="dropdown icon"></i>
+		<div class="default text"></div>
+		<div class="menu">
+			{{range $i, $opt := .Attributes.options}}
+				<div class="item" data-value="{{$i}}">{{$opt}}</div>
+			{{end}}
+		</div>
+	</div>
+</div>
diff --git a/templates/repo/issue/fields/header.tmpl b/templates/repo/issue/fields/header.tmpl
new file mode 100644
index 0000000000..fb8511b4f0
--- /dev/null
+++ b/templates/repo/issue/fields/header.tmpl
@@ -0,0 +1,6 @@
+{{if .Attributes.label}}
+	<h3>{{.Attributes.label}}{{if .Validations.required}}<label class="required"></label>{{end}}</h3>
+{{end}}
+{{if .Attributes.description}}
+	<span class="help">{{RenderMarkdownToHtml .Attributes.description}}</span>
+{{end}}
diff --git a/templates/repo/issue/fields/input.tmpl b/templates/repo/issue/fields/input.tmpl
new file mode 100644
index 0000000000..d73354f6d3
--- /dev/null
+++ b/templates/repo/issue/fields/input.tmpl
@@ -0,0 +1,4 @@
+<div class="field">
+	{{template "repo/issue/fields/header" .}}
+	<input type="{{if .Validations.is_number}}number{{else}}text{{end}}" name="form-field-{{.ID}}" placeholder="{{.Attributes.placeholder}}" value="{{.Attributes.value}}" {{if .Validations.required}}required{{end}} {{if .Validations.regex}}pattern="{{.Validations.regex}}" title="{{.Validations.regex}}"{{end}}>
+</div>
diff --git a/templates/repo/issue/fields/markdown.tmpl b/templates/repo/issue/fields/markdown.tmpl
new file mode 100644
index 0000000000..8236171523
--- /dev/null
+++ b/templates/repo/issue/fields/markdown.tmpl
@@ -0,0 +1,3 @@
+<div class="field">
+	<div>{{RenderMarkdownToHtml .Attributes.value}}</div>
+</div>
diff --git a/templates/repo/issue/fields/textarea.tmpl b/templates/repo/issue/fields/textarea.tmpl
new file mode 100644
index 0000000000..5ad82e2460
--- /dev/null
+++ b/templates/repo/issue/fields/textarea.tmpl
@@ -0,0 +1,6 @@
+<div class="field">
+	{{template "repo/issue/fields/header" .}}
+	{{/* FIXME: preview markdown result */}}
+	{{/* FIXME: required validation for markdown editor */}}
+	<textarea name="form-field-{{.ID}}" placeholder="{{.Attributes.placeholder}}" class="edit_area {{if .Attributes.render}}no-easymde{{end}}" {{if and .Validations.required .Attributes.render}}required{{end}}>{{.Attributes.value}}</textarea>
+</div>
diff --git a/templates/repo/issue/new.tmpl b/templates/repo/issue/new.tmpl
index f8929b375d..9f46f8fddc 100644
--- a/templates/repo/issue/new.tmpl
+++ b/templates/repo/issue/new.tmpl
@@ -6,6 +6,14 @@
 			{{template "repo/issue/navbar" .}}
 		</div>
 		<div class="ui divider"></div>
+		{{if .Flash.WarningMsg}}
+			{{/*
+			There's alreay a importing of alert.tmpl in new_form.tmpl,
+			but only the negative message will be displayed within forms for some reasons, see semantic.css:10659.
+			To avoid repeated negative messages, the importing here if for .Flash.WarningMsg only.
+			 */}}
+			{{template "base/alert" .}}
+		{{end}}
 		{{template "repo/issue/new_form" .}}
 	</div>
 </div>
diff --git a/templates/swagger/v1_json.tmpl b/templates/swagger/v1_json.tmpl
index cc6399cab4..63b124bd9e 100644
--- a/templates/swagger/v1_json.tmpl
+++ b/templates/swagger/v1_json.tmpl
@@ -16584,6 +16584,35 @@
       },
       "x-go-package": "code.gitea.io/gitea/modules/structs"
     },
+    "IssueFormField": {
+      "description": "IssueFormField represents a form field",
+      "type": "object",
+      "properties": {
+        "attributes": {
+          "type": "object",
+          "additionalProperties": {},
+          "x-go-name": "Attributes"
+        },
+        "id": {
+          "type": "string",
+          "x-go-name": "ID"
+        },
+        "type": {
+          "$ref": "#/definitions/IssueFormFieldType"
+        },
+        "validations": {
+          "type": "object",
+          "additionalProperties": {},
+          "x-go-name": "Validations"
+        }
+      },
+      "x-go-package": "code.gitea.io/gitea/modules/structs"
+    },
+    "IssueFormFieldType": {
+      "type": "string",
+      "title": "IssueFormFieldType defines issue form field type, can be \"markdown\", \"textarea\", \"input\", \"dropdown\" or \"checkboxes\"",
+      "x-go-package": "code.gitea.io/gitea/modules/structs"
+    },
     "IssueLabelsOption": {
       "description": "IssueLabelsOption a collection of labels",
       "type": "object",
@@ -16608,6 +16637,13 @@
           "type": "string",
           "x-go-name": "About"
         },
+        "body": {
+          "type": "array",
+          "items": {
+            "$ref": "#/definitions/IssueFormField"
+          },
+          "x-go-name": "Fields"
+        },
         "content": {
           "type": "string",
           "x-go-name": "Content"