mirror of
				https://github.com/go-gitea/gitea
				synced 2025-11-04 13:28:25 +00:00 
			
		
		
		
	Remove jQuery AJAX from the comment edit history (#29703)
- Removed all jQuery AJAX calls and replaced with our fetch wrapper - Tested the comment edit history list, diff, and delete functionality and it works as before # Demo using `fetch` instead of jQuery AJAX  Signed-off-by: Yarden Shoham <git@yardenshoham.com>
This commit is contained in:
		@@ -1,8 +1,9 @@
 | 
				
			|||||||
import $ from 'jquery';
 | 
					import $ from 'jquery';
 | 
				
			||||||
import {svg} from '../svg.js';
 | 
					import {svg} from '../svg.js';
 | 
				
			||||||
import {showErrorToast} from '../modules/toast.js';
 | 
					import {showErrorToast} from '../modules/toast.js';
 | 
				
			||||||
 | 
					import {GET, POST} from '../modules/fetch.js';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
const {appSubUrl, csrfToken} = window.config;
 | 
					const {appSubUrl} = window.config;
 | 
				
			||||||
let i18nTextEdited;
 | 
					let i18nTextEdited;
 | 
				
			||||||
let i18nTextOptions;
 | 
					let i18nTextOptions;
 | 
				
			||||||
let i18nTextDeleteFromHistory;
 | 
					let i18nTextDeleteFromHistory;
 | 
				
			||||||
@@ -31,19 +32,27 @@ function showContentHistoryDetail(issueBaseUrl, commentId, historyId, itemTitleH
 | 
				
			|||||||
  $dialog.find('.dialog-header-options').dropdown({
 | 
					  $dialog.find('.dialog-header-options').dropdown({
 | 
				
			||||||
    showOnFocus: false,
 | 
					    showOnFocus: false,
 | 
				
			||||||
    allowReselection: true,
 | 
					    allowReselection: true,
 | 
				
			||||||
    onChange(_value, _text, $item) {
 | 
					    async onChange(_value, _text, $item) {
 | 
				
			||||||
      const optionItem = $item.data('option-item');
 | 
					      const optionItem = $item.data('option-item');
 | 
				
			||||||
      if (optionItem === 'delete') {
 | 
					      if (optionItem === 'delete') {
 | 
				
			||||||
        if (window.confirm(i18nTextDeleteFromHistoryConfirm)) {
 | 
					        if (window.confirm(i18nTextDeleteFromHistoryConfirm)) {
 | 
				
			||||||
          $.post(`${issueBaseUrl}/content-history/soft-delete?comment_id=${commentId}&history_id=${historyId}`, {
 | 
					          try {
 | 
				
			||||||
            _csrf: csrfToken,
 | 
					            const params = new URLSearchParams();
 | 
				
			||||||
          }).done((resp) => {
 | 
					            params.append('comment_id', commentId);
 | 
				
			||||||
 | 
					            params.append('history_id', historyId);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					            const response = await POST(`${issueBaseUrl}/content-history/soft-delete?${params.toString()}`);
 | 
				
			||||||
 | 
					            const resp = await response.json();
 | 
				
			||||||
 | 
					
 | 
				
			||||||
            if (resp.ok) {
 | 
					            if (resp.ok) {
 | 
				
			||||||
              $dialog.modal('hide');
 | 
					              $dialog.modal('hide');
 | 
				
			||||||
            } else {
 | 
					            } else {
 | 
				
			||||||
              showErrorToast(resp.message);
 | 
					              showErrorToast(resp.message);
 | 
				
			||||||
            }
 | 
					            }
 | 
				
			||||||
          });
 | 
					          } catch (error) {
 | 
				
			||||||
 | 
					            console.error('Error:', error);
 | 
				
			||||||
 | 
					            showErrorToast('An error occurred while deleting the history.');
 | 
				
			||||||
 | 
					          }
 | 
				
			||||||
        }
 | 
					        }
 | 
				
			||||||
      } else { // required by eslint
 | 
					      } else { // required by eslint
 | 
				
			||||||
        showErrorToast(`unknown option item: ${optionItem}`);
 | 
					        showErrorToast(`unknown option item: ${optionItem}`);
 | 
				
			||||||
@@ -54,19 +63,24 @@ function showContentHistoryDetail(issueBaseUrl, commentId, historyId, itemTitleH
 | 
				
			|||||||
    }
 | 
					    }
 | 
				
			||||||
  });
 | 
					  });
 | 
				
			||||||
  $dialog.modal({
 | 
					  $dialog.modal({
 | 
				
			||||||
    onShow() {
 | 
					    async onShow() {
 | 
				
			||||||
      $.ajax({
 | 
					      try {
 | 
				
			||||||
        url: `${issueBaseUrl}/content-history/detail?comment_id=${commentId}&history_id=${historyId}`,
 | 
					        const params = new URLSearchParams();
 | 
				
			||||||
        data: {
 | 
					        params.append('comment_id', commentId);
 | 
				
			||||||
          _csrf: csrfToken,
 | 
					        params.append('history_id', historyId);
 | 
				
			||||||
        },
 | 
					
 | 
				
			||||||
      }).done((resp) => {
 | 
					        const url = `${issueBaseUrl}/content-history/detail?${params.toString()}`;
 | 
				
			||||||
 | 
					        const response = await GET(url);
 | 
				
			||||||
 | 
					        const resp = await response.json();
 | 
				
			||||||
 | 
					
 | 
				
			||||||
        $dialog.find('.comment-diff-data').removeClass('is-loading').html(resp.diffHtml);
 | 
					        $dialog.find('.comment-diff-data').removeClass('is-loading').html(resp.diffHtml);
 | 
				
			||||||
        // there is only one option "item[data-option-item=delete]", so the dropdown can be entirely shown/hidden.
 | 
					        // there is only one option "item[data-option-item=delete]", so the dropdown can be entirely shown/hidden.
 | 
				
			||||||
        if (resp.canSoftDelete) {
 | 
					        if (resp.canSoftDelete) {
 | 
				
			||||||
          $dialog.find('.dialog-header-options').removeClass('gt-hidden');
 | 
					          $dialog.find('.dialog-header-options').removeClass('gt-hidden');
 | 
				
			||||||
        }
 | 
					        }
 | 
				
			||||||
      });
 | 
					      } catch (error) {
 | 
				
			||||||
 | 
					        console.error('Error:', error);
 | 
				
			||||||
 | 
					      }
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
    onHidden() {
 | 
					    onHidden() {
 | 
				
			||||||
      $dialog.remove();
 | 
					      $dialog.remove();
 | 
				
			||||||
@@ -103,7 +117,7 @@ function showContentHistoryMenu(issueBaseUrl, $item, commentId) {
 | 
				
			|||||||
  });
 | 
					  });
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
export function initRepoIssueContentHistory() {
 | 
					export async function initRepoIssueContentHistory() {
 | 
				
			||||||
  const issueIndex = $('#issueIndex').val();
 | 
					  const issueIndex = $('#issueIndex').val();
 | 
				
			||||||
  if (!issueIndex) return;
 | 
					  if (!issueIndex) return;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@@ -114,12 +128,10 @@ export function initRepoIssueContentHistory() {
 | 
				
			|||||||
  const repoLink = $('#repolink').val();
 | 
					  const repoLink = $('#repolink').val();
 | 
				
			||||||
  const issueBaseUrl = `${appSubUrl}/${repoLink}/issues/${issueIndex}`;
 | 
					  const issueBaseUrl = `${appSubUrl}/${repoLink}/issues/${issueIndex}`;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  $.ajax({
 | 
					  try {
 | 
				
			||||||
    url: `${issueBaseUrl}/content-history/overview`,
 | 
					    const response = await GET(`${issueBaseUrl}/content-history/overview`);
 | 
				
			||||||
    data: {
 | 
					    const resp = await response.json();
 | 
				
			||||||
      _csrf: csrfToken,
 | 
					
 | 
				
			||||||
    },
 | 
					 | 
				
			||||||
  }).done((resp) => {
 | 
					 | 
				
			||||||
    i18nTextEdited = resp.i18n.textEdited;
 | 
					    i18nTextEdited = resp.i18n.textEdited;
 | 
				
			||||||
    i18nTextDeleteFromHistory = resp.i18n.textDeleteFromHistory;
 | 
					    i18nTextDeleteFromHistory = resp.i18n.textDeleteFromHistory;
 | 
				
			||||||
    i18nTextDeleteFromHistoryConfirm = resp.i18n.textDeleteFromHistoryConfirm;
 | 
					    i18nTextDeleteFromHistoryConfirm = resp.i18n.textDeleteFromHistoryConfirm;
 | 
				
			||||||
@@ -133,5 +145,7 @@ export function initRepoIssueContentHistory() {
 | 
				
			|||||||
      const $itemComment = $(`#issuecomment-${commentId}`);
 | 
					      const $itemComment = $(`#issuecomment-${commentId}`);
 | 
				
			||||||
      showContentHistoryMenu(issueBaseUrl, $itemComment, commentId);
 | 
					      showContentHistoryMenu(issueBaseUrl, $itemComment, commentId);
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
  });
 | 
					  } catch (error) {
 | 
				
			||||||
 | 
					    console.error('Error:', error);
 | 
				
			||||||
 | 
					  }
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user