diff options
author | wxiaoguang <wxiaoguang@gmail.com> | 2024-11-15 02:48:41 +0800 |
---|---|---|
committer | GitHub <noreply@github.com> | 2024-11-15 02:48:41 +0800 |
commit | 249e67672aea8a5a0ed73bedc655f9dcd37437ea (patch) | |
tree | 4721d0d41d03bdbc54c88790efc26145bcf72cbd | |
parent | 98d9a71ffe510da0e10d042d8f87a348022aca87 (diff) | |
download | gitea-249e67672aea8a5a0ed73bedc655f9dcd37437ea.tar.gz gitea-249e67672aea8a5a0ed73bedc655f9dcd37437ea.zip |
Remove jQuery import from some files (#32512)
Many files do not directly depend on jQuery now.
To clarify the usage: use `fomanticQuery` to operate Fomantic
components.
Then developers could focus on removing the remaining jQuery usages by
searching `import $` globally.
21 files now:
```
./components/RepoBranchTagSelector.vue:3:import $ from 'jquery';
./features/admin/common.ts:1:import $ from 'jquery';
./features/admin/emails.ts:1:import $ from 'jquery';
./features/common-button.ts:1:import $ from 'jquery';
./features/comp/ComboMarkdownEditor.ts:3:import $ from 'jquery'; (I am working on it, there will be a new PR)
./features/comp/LabelEdit.ts:1:import $ from 'jquery';
./features/notification.ts:1:import $ from 'jquery';
./features/org-team.ts:1:import $ from 'jquery';
./features/repo-code.ts:1:import $ from 'jquery';
./features/repo-common.ts:1:import $ from 'jquery';
./features/repo-diff.ts:1:import $ from 'jquery';
./features/repo-editor.ts:1:import $ from 'jquery';
./features/repo-issue-content.ts:1:import $ from 'jquery';
./features/repo-issue-list.ts:1:import $ from 'jquery';
./features/repo-issue-sidebar.ts:1:import $ from 'jquery';
./features/repo-issue.ts:1:import $ from 'jquery';
./features/repo-legacy.ts:1:import $ from 'jquery';
./features/repo-new.ts:1:import $ from 'jquery';
./features/repo-projects.ts:1:import $ from 'jquery';
./features/repo-settings.ts:1:import $ from 'jquery';
./features/repo-template.ts:1:import $ from 'jquery';
```
-rw-r--r-- | web_src/js/components/DashboardRepoList.vue | 4 | ||||
-rw-r--r-- | web_src/js/components/RepoContributors.vue | 4 | ||||
-rw-r--r-- | web_src/js/features/citation.ts | 4 | ||||
-rw-r--r-- | web_src/js/features/common-form.ts | 7 | ||||
-rw-r--r-- | web_src/js/features/comp/ConfirmModal.ts | 4 | ||||
-rw-r--r-- | web_src/js/features/comp/ReactionSelector.ts | 4 | ||||
-rw-r--r-- | web_src/js/features/comp/SearchUserBox.ts | 4 | ||||
-rw-r--r-- | web_src/js/features/repo-branch.ts | 4 | ||||
-rw-r--r-- | web_src/js/features/repo-graph.ts | 6 | ||||
-rw-r--r-- | web_src/js/features/repo-home.ts | 6 | ||||
-rw-r--r-- | web_src/js/vendor/jquery.are-you-sure.ts | 4 |
11 files changed, 27 insertions, 24 deletions
diff --git a/web_src/js/components/DashboardRepoList.vue b/web_src/js/components/DashboardRepoList.vue index 986fcc1181..a6a8ccd2d1 100644 --- a/web_src/js/components/DashboardRepoList.vue +++ b/web_src/js/components/DashboardRepoList.vue @@ -1,8 +1,8 @@ <script lang="ts"> import {createApp, nextTick} from 'vue'; -import $ from 'jquery'; import {SvgIcon} from '../svg.ts'; import {GET} from '../modules/fetch.ts'; +import {fomanticQuery} from '../modules/fomantic/base.ts'; const {appSubUrl, assetUrlPrefix, pageData} = window.config; @@ -102,7 +102,7 @@ const sfc = { mounted() { const el = document.querySelector('#dashboard-repo-list'); this.changeReposFilter(this.reposFilter); - $(el).find('.dropdown').dropdown(); + fomanticQuery(el.querySelector('.ui.dropdown')).dropdown(); nextTick(() => { this.$refs.search.focus(); }); diff --git a/web_src/js/components/RepoContributors.vue b/web_src/js/components/RepoContributors.vue index d44d0cd22d..f42278ef6b 100644 --- a/web_src/js/components/RepoContributors.vue +++ b/web_src/js/components/RepoContributors.vue @@ -21,7 +21,7 @@ import { import {chartJsColors} from '../utils/color.ts'; import {sleep} from '../utils.ts'; import 'chartjs-adapter-dayjs-4/dist/chartjs-adapter-dayjs-4.esm'; -import $ from 'jquery'; +import {fomanticQuery} from '../modules/fomantic/base.ts'; const customEventListener = { id: 'customEventListener', @@ -77,7 +77,7 @@ export default { mounted() { this.fetchGraphData(); - $('#repo-contributors').dropdown({ + fomanticQuery('#repo-contributors').dropdown({ onChange: (val) => { this.xAxisMin = this.xAxisStart; this.xAxisMax = this.xAxisEnd; diff --git a/web_src/js/features/citation.ts b/web_src/js/features/citation.ts index ffab75c389..c9b07efe77 100644 --- a/web_src/js/features/citation.ts +++ b/web_src/js/features/citation.ts @@ -1,5 +1,5 @@ -import $ from 'jquery'; import {getCurrentLocale} from '../utils.ts'; +import {fomanticQuery} from '../modules/fomantic/base.ts'; const {pageData} = window.config; @@ -71,6 +71,6 @@ export async function initCitationFileCopyContent() { dropdownBtn.classList.remove('is-loading'); } - $('#cite-repo-modal').modal('show'); + fomanticQuery('#cite-repo-modal').modal('show'); }); } diff --git a/web_src/js/features/common-form.ts b/web_src/js/features/common-form.ts index 719a5170b4..1aca93169d 100644 --- a/web_src/js/features/common-form.ts +++ b/web_src/js/features/common-form.ts @@ -1,13 +1,12 @@ -import $ from 'jquery'; -import {initAreYouSure} from '../vendor/jquery.are-you-sure.ts'; +import {applyAreYouSure, initAreYouSure} from '../vendor/jquery.are-you-sure.ts'; import {handleGlobalEnterQuickSubmit} from './comp/QuickSubmit.ts'; export function initGlobalFormDirtyLeaveConfirm() { initAreYouSure(window.jQuery); // Warn users that try to leave a page after entering data into a form. // Except on sign-in pages, and for forms marked as 'ignore-dirty'. - if (!$('.user.signin').length) { - $('form:not(.ignore-dirty)').areYouSure(); + if (!document.querySelector('.page-content.user.signin')) { + applyAreYouSure('form:not(.ignore-dirty)'); } } diff --git a/web_src/js/features/comp/ConfirmModal.ts b/web_src/js/features/comp/ConfirmModal.ts index 9541226a7d..93459ae1a0 100644 --- a/web_src/js/features/comp/ConfirmModal.ts +++ b/web_src/js/features/comp/ConfirmModal.ts @@ -1,7 +1,7 @@ -import $ from 'jquery'; import {svg} from '../../svg.ts'; import {htmlEscape} from 'escape-goat'; import {createElementFromHTML} from '../../utils/dom.ts'; +import {fomanticQuery} from '../../modules/fomantic/base.ts'; const {i18n} = window.config; @@ -17,7 +17,7 @@ export function confirmModal(content, {confirmButtonColor = 'primary'} = {}) { </div> `); document.body.append(modal); - const $modal = $(modal); + const $modal = fomanticQuery(modal); $modal.modal({ onApprove() { resolve(true); diff --git a/web_src/js/features/comp/ReactionSelector.ts b/web_src/js/features/comp/ReactionSelector.ts index e1dd84bb14..f6381c2563 100644 --- a/web_src/js/features/comp/ReactionSelector.ts +++ b/web_src/js/features/comp/ReactionSelector.ts @@ -1,5 +1,5 @@ -import $ from 'jquery'; import {POST} from '../../modules/fetch.ts'; +import {fomanticQuery} from '../../modules/fomantic/base.ts'; export function initCompReactionSelector() { for (const container of document.querySelectorAll('.issue-content, .diff-file-body')) { @@ -29,7 +29,7 @@ export function initCompReactionSelector() { if (data.html) { commentContainer.insertAdjacentHTML('beforeend', data.html); const bottomReactionsDropdowns = commentContainer.querySelectorAll('.bottom-reactions .dropdown.select-reaction'); - $(bottomReactionsDropdowns).dropdown(); // re-init the dropdown + fomanticQuery(bottomReactionsDropdowns).dropdown(); // re-init the dropdown } }); } diff --git a/web_src/js/features/comp/SearchUserBox.ts b/web_src/js/features/comp/SearchUserBox.ts index ceb756b557..2e3b3f83be 100644 --- a/web_src/js/features/comp/SearchUserBox.ts +++ b/web_src/js/features/comp/SearchUserBox.ts @@ -1,5 +1,5 @@ -import $ from 'jquery'; import {htmlEscape} from 'escape-goat'; +import {fomanticQuery} from '../../modules/fomantic/base.ts'; const {appSubUrl} = window.config; const looksLikeEmailAddressCheck = /^\S+@\S+$/; @@ -10,7 +10,7 @@ export function initCompSearchUserBox() { const allowEmailInput = searchUserBox.getAttribute('data-allow-email') === 'true'; const allowEmailDescription = searchUserBox.getAttribute('data-allow-email-description') ?? undefined; - $(searchUserBox).search({ + fomanticQuery(searchUserBox).search({ minCharacters: 2, apiSettings: { url: `${appSubUrl}/user/search_candidates?q={query}`, diff --git a/web_src/js/features/repo-branch.ts b/web_src/js/features/repo-branch.ts index 3261bfe37e..edf2f69638 100644 --- a/web_src/js/features/repo-branch.ts +++ b/web_src/js/features/repo-branch.ts @@ -1,5 +1,5 @@ -import $ from 'jquery'; import {toggleElem} from '../utils/dom.ts'; +import {fomanticQuery} from '../modules/fomantic/base.ts'; export function initRepoBranchButton() { initRepoCreateBranchButton(); @@ -18,7 +18,7 @@ function initRepoCreateBranchButton() { const fromSpanName = el.getAttribute('data-modal-from-span') || '#modal-create-branch-from-span'; document.querySelector(fromSpanName).textContent = el.getAttribute('data-branch-from'); - $(el.getAttribute('data-modal')).modal('show'); + fomanticQuery(el.getAttribute('data-modal')).modal('show'); }); } } diff --git a/web_src/js/features/repo-graph.ts b/web_src/js/features/repo-graph.ts index ff64d0854b..231a726653 100644 --- a/web_src/js/features/repo-graph.ts +++ b/web_src/js/features/repo-graph.ts @@ -1,6 +1,6 @@ -import $ from 'jquery'; import {hideElem, showElem} from '../utils/dom.ts'; import {GET} from '../modules/fetch.ts'; +import {fomanticQuery} from '../modules/fomantic/base.ts'; export function initRepoGraphGit() { const graphContainer = document.querySelector('#git-graph-container'); @@ -83,8 +83,8 @@ export function initRepoGraphGit() { } const flowSelectRefsDropdown = document.querySelector('#flow-select-refs-dropdown'); - $(flowSelectRefsDropdown).dropdown('set selected', dropdownSelected); - $(flowSelectRefsDropdown).dropdown({ + fomanticQuery(flowSelectRefsDropdown).dropdown('set selected', dropdownSelected); + fomanticQuery(flowSelectRefsDropdown).dropdown({ clearable: true, fullTextSeach: 'exact', onRemove(toRemove) { diff --git a/web_src/js/features/repo-home.ts b/web_src/js/features/repo-home.ts index ed1415d286..a65a1815d2 100644 --- a/web_src/js/features/repo-home.ts +++ b/web_src/js/features/repo-home.ts @@ -1,8 +1,8 @@ -import $ from 'jquery'; import {stripTags} from '../utils.ts'; import {hideElem, queryElemChildren, showElem} from '../utils/dom.ts'; import {POST} from '../modules/fetch.ts'; import {showErrorToast} from '../modules/toast.ts'; +import {fomanticQuery} from '../modules/fomantic/base.ts'; const {appSubUrl} = window.config; @@ -73,7 +73,7 @@ export function initRepoTopicBar() { } }); - $(topicDropdown).dropdown({ + fomanticQuery(topicDropdown).dropdown({ allowAdditions: true, forceSelection: false, fullTextSearch: 'exact', @@ -136,7 +136,7 @@ export function initRepoTopicBar() { onLabelCreate(value) { value = value.toLowerCase().trim(); this.attr('data-value', value).contents().first().replaceWith(value); - return $(this); + return fomanticQuery(this); }, onAdd(addedValue, _addedText, $addedChoice) { addedValue = addedValue.toLowerCase().trim(); diff --git a/web_src/js/vendor/jquery.are-you-sure.ts b/web_src/js/vendor/jquery.are-you-sure.ts index 858f9871b8..bd621a145e 100644 --- a/web_src/js/vendor/jquery.are-you-sure.ts +++ b/web_src/js/vendor/jquery.are-you-sure.ts @@ -195,3 +195,7 @@ export function initAreYouSure($) { }); }; } + +export function applyAreYouSure(selector: string) { + $(selector).areYouSure(); +} |