Use async await to fix empty quote reply at first time (#23168) (#23256)

Backport #23168

The reason why quote reply is empty is when quote reply is clicked, it
triggers the click function on `.comment-form-reply` button, and when
the first time this function is triggered, easyMDE for the reply has not
yet initialized, so that click handler of `.quote-reply` button in
`repo-legacy.js` got an `undefined` as easyMDE, and the following lines
which put quoted reply into the easyMDE is not executed.
The workaround in this PR is to pass the replied content to
'.comment-form-reply' button if easyMDE is not yet initialized (quote
reply first clicked) and put the replied content into it the after
easyMDE is created.
Now quote reply on first click:


https://user-images.githubusercontent.com/17645053/221452823-fc699d50-1649-4af1-952e-f04fc8d2978e.mov

<br />


Update:
The above change is not appropriate as stated in the
[comment](https://github.com/go-gitea/gitea/pull/23168#issuecomment-1445562284)
Use await instead

Close #22075.
Close #23247.

Co-authored-by: HesterG <hestergong@gmail.com>

cmd/dump.go

@@ -272,6 +272,7 @@ func runDump(ctx *cli.Context) error {
 		fatal("Failed to create tmp file: %v", err)
 	}
 	defer func() {
+		_ = dbDump.Close()
 		if err := util.Remove(dbDump.Name()); err != nil {
 			log.Warn("Unable to remove temporary file: %s: Error: %v", dbDump.Name(), err)
 		}

models/issues/pull_list.go

@@ -111,6 +111,7 @@ func GetUnmergedPullRequestsByBaseInfo(repoID int64, branch string) ([]*PullRequ
 	return prs, db.GetEngine(db.DefaultContext).
 		Where("base_repo_id=? AND base_branch=? AND has_merged=? AND issue.is_closed=?",
 			repoID, branch, false, false).
+		OrderBy("issue.updated_unix DESC").
 		Join("INNER", "issue", "issue.id=pull_request.issue_id").
 		Find(&prs)
 }

modules/markup/sanitizer.go

@@ -132,6 +132,8 @@ func createDefaultPolicy() *bluemonday.Policy {
 
 	policy.AllowAttrs(generalSafeAttrs...).OnElements(generalSafeElements...)
 
+	policy.AllowAttrs("src", "autoplay", "controls").OnElements("video")
+
 	policy.AllowAttrs("itemscope", "itemtype").OnElements("div")
 
 	// FIXME: Need to handle longdesc in img but there is no easy way to do it

templates/admin/user/new.tmpl

@@ -50,7 +50,7 @@
 					</div>
 				</div>
 
-				<div class="required non-local field {{if .Err_LoginName}}error{{end}} {{if eq .login_type "0-0"}}hide{{end}}">
+				<div class="required non-local field {{if .Err_LoginName}}error{{end}} {{if eq .login_type "0-0"}}gt-hidden{{end}}">
 					<label for="login_name">{{.locale.Tr "admin.users.auth_login_name"}}</label>
 					<input id="login_name" name="login_name" value="{{.login_name}}">
 				</div>
@@ -62,12 +62,12 @@
 					<label for="email">{{.locale.Tr "email"}}</label>
 					<input id="email" name="email" type="email" value="{{.email}}" required>
 				</div>
-				<div class="required local field {{if .Err_Password}}error{{end}} {{if not (eq .login_type "0-0")}}hide{{end}}">
+				<div class="required local field {{if .Err_Password}}error{{end}} {{if not (eq .login_type "0-0")}}gt-hidden{{end}}">
 					<label for="password">{{.locale.Tr "password"}}</label>
 					<input id="password" name="password" type="password" autocomplete="new-password" value="{{.password}}" {{if eq .login_type "0-0"}}required{{end}}>
 				</div>
 
-				<div class="inline field local{{if ne .login_type "0-0"}} hide{{end}}">
+				<div class="inline field local {{if ne .login_type "0-0"}}gt-hidden{{end}}">
 					<div class="ui checkbox">
 						<label><strong>{{.locale.Tr "auth.allow_password_change"}}</strong></label>
 						<input name="must_change_password" type="checkbox" checked>

templates/repo/editor/commit_form.tmpl

@@ -58,7 +58,7 @@
 					</label>
 				</div>
 			</div>
-			<div class="quick-pull-branch-name {{if not (eq .commit_choice "commit-to-new-branch")}}hide{{end}}">
+			<div class="quick-pull-branch-name {{if not (eq .commit_choice "commit-to-new-branch")}}gt-hidden{{end}}">
 				<div class="new-branch-name-input field {{if .Err_NewBranchName}}error{{end}}">
 					{{svg "octicon-git-branch"}}
 					<input type="text" name="new_branch_name" value="{{.new_branch_name}}" class="input-contrast gt-mr-2 js-quick-pull-new-branch-name" placeholder="{{.locale.Tr "repo.editor.new_branch_name_desc"}}" {{if eq .commit_choice "commit-to-new-branch"}}required{{end}} title="{{.locale.Tr "repo.editor.new_branch_name"}}">

templates/user/dashboard/repolist.tmpl

@@ -46,56 +46,38 @@
 					<div class="ui dropdown icon button" title="{{.locale.Tr "home.filter"}}">
 						<i class="icon gt-df gt-ac gt-jc gt-m-0">{{svg "octicon-filter" 16}}</i>
 						<div class="menu">
-							<div class="item">
-								<a @click="toggleArchivedFilter()">
-									<div class="ui checkbox" id="archivedFilterCheckbox" title="{{.locale.Tr "home.show_both_archived_unarchived"}}" v-if="archivedFilter === 'both'">
-										<input type="checkbox">
-										<label>
-											{{svg "octicon-archive" 16 "gt-mr-2"}}
-											{{.locale.Tr "home.show_archived"}}
-										</label>
-									</div>
-									<div class="ui checkbox" id="archivedFilterCheckbox" title="{{.locale.Tr "home.show_only_unarchived"}}" v-if="archivedFilter === 'unarchived'">
-										<input type="checkbox">
-										<label>
-											{{svg "octicon-archive" 16 "gt-mr-2"}}
-											{{.locale.Tr "home.show_archived"}}
-										</label>
-									</div>
-									<div class="ui checkbox" id="archivedFilterCheckbox" title="{{.locale.Tr "home.show_only_archived"}}" v-if="archivedFilter === 'archived'">
-										<input type="checkbox">
-										<label>
-											{{svg "octicon-archive" 16 "gt-mr-2"}}
-											{{.locale.Tr "home.show_archived"}}
-										</label>
-									</div>
-								</a>
-							</div>
-							<div class="item">
-								<a @click="togglePrivateFilter()">
-									<div class="ui checkbox" id="privateFilterCheckbox" title="{{.locale.Tr "home.show_both_private_public"}}" v-if="privateFilter === 'both'">
-										<input type="checkbox">
-										<label>
-											{{svg "octicon-lock" 16 "gt-mr-2"}}
-											{{.locale.Tr "home.show_private"}}
-										</label>
-									</div>
-									<div class="ui checkbox" id="privateFilterCheckbox" title="{{.locale.Tr "home.show_only_public"}}" v-if="privateFilter === 'public'">
-										<input type="checkbox">
-										<label>
-											{{svg "octicon-lock" 16 "gt-mr-2"}}
-											{{.locale.Tr "home.show_private"}}
-										</label>
-									</div>
-									<div class="ui checkbox" id="privateFilterCheckbox" title="{{.locale.Tr "home.show_only_private"}}" v-if="privateFilter === 'private'">
-										<input type="checkbox">
-											<label>
-												{{svg "octicon-lock" 16 "gt-mr-2"}}
-												{{.locale.Tr "home.show_private"}}
-											</label>
-									</div>
-								</a>
-							</div>
+							<a class="item" @click="toggleArchivedFilter()">
+								<div class="ui checkbox"
+											ref="checkboxArchivedFilter"
+											data-title-both="{{.locale.Tr "home.show_both_archived_unarchived"}}"
+											data-title-unarchived="{{.locale.Tr "home.show_only_unarchived"}}"
+											data-title-archived="{{.locale.Tr "home.show_only_archived"}}"
+											:title="checkboxArchivedFilterTitle"
+								>
+									<!--the "hidden" is necessary to make the checkbox work without Fomantic UI js,
+											otherwise if the "input" handles click event for intermediate status, it breaks the internal state-->
+									<input type="checkbox" class="hidden" v-bind.prop="checkboxArchivedFilterProps">
+									<label>
+										{{svg "octicon-archive" 16 "gt-mr-2"}}
+										{{.locale.Tr "home.show_archived"}}
+									</label>
+								</div>
+							</a>
+							<a class="item" @click="togglePrivateFilter()">
+								<div class="ui checkbox"
+											ref="checkboxPrivateFilter"
+											data-title-both="{{.locale.Tr "home.show_both_private_public"}}"
+											data-title-public="{{.locale.Tr "home.show_only_public"}}"
+											data-title-private="{{.locale.Tr "home.show_only_private"}}"
+											:title="checkboxPrivateFilterTitle"
+								>
+									<input type="checkbox" class="hidden" v-bind.prop="checkboxPrivateFilterProps">
+									<label>
+										{{svg "octicon-lock" 16 "gt-mr-2"}}
+										{{.locale.Tr "home.show_private"}}
+									</label>
+								</div>
+							</a>
 						</div>
 					</div>
 				</div>

web_src/js/components/DashboardRepoList.js

@@ -87,6 +87,7 @@ function initVueComponents(app) {
       }
 
       return {
+        hasMounted: false, // accessing $refs in computed() need to wait for mounted
         tab,
         repos: [],
         reposTotalCount: 0,
@@ -134,7 +135,19 @@ function initVueComponents(app) {
       },
       repoTypeCount() {
         return this.counts[`${this.reposFilter}:${this.archivedFilter}:${this.privateFilter}`];
-      }
+      },
+      checkboxArchivedFilterTitle() {
+        return this.hasMounted && this.$refs.checkboxArchivedFilter?.getAttribute(`data-title-${this.archivedFilter}`);
+      },
+      checkboxArchivedFilterProps() {
+        return {checked: this.archivedFilter === 'archived', indeterminate: this.archivedFilter === 'both'};
+      },
+      checkboxPrivateFilterTitle() {
+        return this.hasMounted && this.$refs.checkboxPrivateFilter?.getAttribute(`data-title-${this.privateFilter}`);
+      },
+      checkboxPrivateFilterProps() {
+        return {checked: this.privateFilter === 'private', indeterminate: this.privateFilter === 'both'};
+      },
     },
 
     mounted() {
@@ -144,10 +157,11 @@ function initVueComponents(app) {
         initTooltip(elTooltip);
       }
       $(el).find('.dropdown').dropdown();
-      this.setCheckboxes();
       nextTick(() => {
         this.$refs.search.focus();
       });
+
+      this.hasMounted = true;
     },
 
     methods: {
@@ -156,39 +170,6 @@ function initVueComponents(app) {
         this.updateHistory();
       },
 
-      setCheckboxes() {
-        switch (this.archivedFilter) {
-          case 'unarchived':
-            $('#archivedFilterCheckbox').checkbox('set unchecked');
-            break;
-          case 'archived':
-            $('#archivedFilterCheckbox').checkbox('set checked');
-            break;
-          case 'both':
-            $('#archivedFilterCheckbox').checkbox('set indeterminate');
-            break;
-          default:
-            this.archivedFilter = 'unarchived';
-            $('#archivedFilterCheckbox').checkbox('set unchecked');
-            break;
-        }
-        switch (this.privateFilter) {
-          case 'public':
-            $('#privateFilterCheckbox').checkbox('set unchecked');
-            break;
-          case 'private':
-            $('#privateFilterCheckbox').checkbox('set checked');
-            break;
-          case 'both':
-            $('#privateFilterCheckbox').checkbox('set indeterminate');
-            break;
-          default:
-            this.privateFilter = 'both';
-            $('#privateFilterCheckbox').checkbox('set indeterminate');
-            break;
-        }
-      },
-
       changeReposFilter(filter) {
         this.reposFilter = filter;
         this.repos = [];
@@ -245,45 +226,29 @@ function initVueComponents(app) {
       },
 
       toggleArchivedFilter() {
-        switch (this.archivedFilter) {
-          case 'both':
-            this.archivedFilter = 'unarchived';
-            break;
-          case 'unarchived':
-            this.archivedFilter = 'archived';
-            break;
-          case 'archived':
-            this.archivedFilter = 'both';
-            break;
-          default:
-            this.archivedFilter = 'unarchived';
-            break;
+        if (this.archivedFilter === 'unarchived') {
+          this.archivedFilter = 'archived';
+        } else if (this.archivedFilter === 'archived') {
+          this.archivedFilter = 'both';
+        } else { // including both
+          this.archivedFilter = 'unarchived';
         }
         this.page = 1;
         this.repos = [];
-        this.setCheckboxes();
         this.counts[`${this.reposFilter}:${this.archivedFilter}:${this.privateFilter}`] = 0;
         this.searchRepos();
       },
 
       togglePrivateFilter() {
-        switch (this.privateFilter) {
-          case 'both':
-            this.privateFilter = 'public';
-            break;
-          case 'public':
-            this.privateFilter = 'private';
-            break;
-          case 'private':
-            this.privateFilter = 'both';
-            break;
-          default:
-            this.privateFilter = 'both';
-            break;
+        if (this.privateFilter === 'both') {
+          this.privateFilter = 'public';
+        } else if (this.privateFilter === 'public') {
+          this.privateFilter = 'private';
+        } else { // including private
+          this.privateFilter = 'both';
         }
         this.page = 1;
         this.repos = [];
-        this.setCheckboxes();
         this.counts[`${this.reposFilter}:${this.archivedFilter}:${this.privateFilter}`] = 0;
         this.searchRepos();
       },

web_src/js/features/citation.js

@@ -2,7 +2,7 @@ import $ from 'jquery';
 
 const {pageData} = window.config;
 
-const initInputCitationValue = async ($citationCopyBibtex, $citationCopyApa) => {
+const initInputCitationValue = async ($citationCopyApa, $citationCopyBibtex) => {
   const [{Cite, plugins}] = await Promise.all([
     import(/* webpackChunkName: "citation-js-core" */'@citation-js/core'),
     import(/* webpackChunkName: "citation-js-formats" */'@citation-js/plugin-software-formats'),

web_src/js/features/repo-issue.js

@@ -418,6 +418,22 @@ function assignMenuAttributes(menu) {
   return id;
 }
 
+export async function handleReply($el) {
+  hideElem($el);
+  const form = $el.closest('.comment-code-cloud').find('.comment-form');
+  form.removeClass('gt-hidden');
+  const $textarea = form.find('textarea');
+  let easyMDE = getAttachedEasyMDE($textarea);
+  if (!easyMDE) {
+    await attachTribute($textarea.get(), {mentions: true, emoji: true});
+    easyMDE = await createCommentEasyMDE($textarea);
+  }
+  $textarea.focus();
+  easyMDE.codemirror.focus();
+  assignMenuAttributes(form.find('.menu'));
+  return easyMDE;
+}
+
 export function initRepoPullRequestReview() {
   if (window.location.hash && window.location.hash.startsWith('#issuecomment-')) {
     const commentDiv = $(window.location.hash);
@@ -455,19 +471,7 @@ export function initRepoPullRequestReview() {
 
   $(document).on('click', 'button.comment-form-reply', async function (e) {
     e.preventDefault();
-
-    hideElem($(this));
-    const form = $(this).closest('.comment-code-cloud').find('.comment-form');
-    form.removeClass('gt-hidden');
-    const $textarea = form.find('textarea');
-    let easyMDE = getAttachedEasyMDE($textarea);
-    if (!easyMDE) {
-      await attachTribute($textarea.get(), {mentions: true, emoji: true});
-      easyMDE = await createCommentEasyMDE($textarea);
-    }
-    $textarea.focus();
-    easyMDE.codemirror.focus();
-    assignMenuAttributes(form.find('.menu'));
+    await handleReply($(this));
   });
 
   const $reviewBox = $('.review-box-panel');

web_src/js/features/repo-legacy.js

@@ -6,7 +6,7 @@ import {
   initRepoIssueBranchSelect, initRepoIssueCodeCommentCancel, initRepoIssueCommentDelete,
   initRepoIssueComments, initRepoIssueDependencyDelete, initRepoIssueReferenceIssue,
   initRepoIssueStatusButton, initRepoIssueTitleEdit, initRepoIssueWipToggle,
-  initRepoPullRequestUpdate, updateIssuesMeta,
+  initRepoPullRequestUpdate, updateIssuesMeta, handleReply
 } from './repo-issue.js';
 import {initUnicodeEscapeButton} from './repo-unicode-escape.js';
 import {svg} from '../svg.js';
@@ -613,15 +613,15 @@ function initRepoIssueCommentEdit() {
   $(document).on('click', '.edit-content', onEditContent);
 
   // Quote reply
-  $(document).on('click', '.quote-reply', function (event) {
+  $(document).on('click', '.quote-reply', async function (event) {
+    event.preventDefault();
     const target = $(this).data('target');
     const quote = $(`#${target}`).text().replace(/\n/g, '\n> ');
     const content = `> ${quote}\n\n`;
     let easyMDE;
     if ($(this).hasClass('quote-reply-diff')) {
-      const $parent = $(this).closest('.comment-code-cloud');
-      $parent.find('button.comment-form-reply').trigger('click');
-      easyMDE = getAttachedEasyMDE($parent.find('[name="content"]'));
+      const $replyBtn = $(this).closest('.comment-code-cloud').find('button.comment-form-reply');
+      easyMDE = await handleReply($replyBtn);
     } else {
       // for normal issue/comment page
       easyMDE = getAttachedEasyMDE($('#comment-form .edit_area'));
@@ -637,6 +637,5 @@ function initRepoIssueCommentEdit() {
         easyMDE.codemirror.setCursor(easyMDE.codemirror.lineCount(), 0);
       });
     }
-    event.preventDefault();
   });
 }