diff --git a/app/javascript/core/admin.js b/app/javascript/core/admin.js index 4720754839..d256d7ec9d 100644 --- a/app/javascript/core/admin.js +++ b/app/javascript/core/admin.js @@ -1,7 +1,7 @@ // This file will be loaded on admin pages, regardless of theme. import 'packs/public-path'; -import delegate from '@rails/ujs'; +import Rails from '@rails/ujs'; import ready from '../mastodon/ready'; @@ -19,7 +19,7 @@ const setAnnouncementEndsAttributes = (target) => { } }; -delegate(document, 'input[type="datetime-local"]#announcement_starts_at', 'change', ({ target }) => { +Rails.delegate(document, 'input[type="datetime-local"]#announcement_starts_at', 'change', ({ target }) => { setAnnouncementEndsAttributes(target); }); @@ -42,7 +42,7 @@ const hideSelectAll = () => { hiddenField.value = '0'; }; -delegate(document, '#batch_checkbox_all', 'change', ({ target }) => { +Rails.delegate(document, '#batch_checkbox_all', 'change', ({ target }) => { const selectAllMatchingElement = document.querySelector('.batch-table__select-all'); [].forEach.call(document.querySelectorAll(batchCheckboxClassName), (content) => { @@ -58,7 +58,7 @@ delegate(document, '#batch_checkbox_all', 'change', ({ target }) => { } }); -delegate(document, '.batch-table__select-all button', 'click', () => { +Rails.delegate(document, '.batch-table__select-all button', 'click', () => { const hiddenField = document.querySelector('#select_all_matching'); const active = hiddenField.value === '1'; const selectedMsg = document.querySelector('.batch-table__select-all .selected'); @@ -75,7 +75,7 @@ delegate(document, '.batch-table__select-all button', 'click', () => { } }); -delegate(document, batchCheckboxClassName, 'change', () => { +Rails.delegate(document, batchCheckboxClassName, 'change', () => { const checkAllElement = document.querySelector('#batch_checkbox_all'); const selectAllMatchingElement = document.querySelector('.batch-table__select-all'); @@ -93,19 +93,19 @@ delegate(document, batchCheckboxClassName, 'change', () => { } }); -delegate(document, '.media-spoiler-show-button', 'click', () => { +Rails.delegate(document, '.media-spoiler-show-button', 'click', () => { [].forEach.call(document.querySelectorAll('button.media-spoiler'), (element) => { element.click(); }); }); -delegate(document, '.media-spoiler-hide-button', 'click', () => { +Rails.delegate(document, '.media-spoiler-hide-button', 'click', () => { [].forEach.call(document.querySelectorAll('.spoiler-button.spoiler-button--visible button'), (element) => { element.click(); }); }); -delegate(document, '.filter-subset--with-select select', 'change', ({ target }) => { +Rails.delegate(document, '.filter-subset--with-select select', 'change', ({ target }) => { target.form.submit(); }); @@ -122,7 +122,7 @@ const onDomainBlockSeverityChange = (target) => { } }; -delegate(document, '#domain_block_severity', 'change', ({ target }) => onDomainBlockSeverityChange(target)); +Rails.delegate(document, '#domain_block_severity', 'change', ({ target }) => onDomainBlockSeverityChange(target)); const onEnableBootstrapTimelineAccountsChange = (target) => { const bootstrapTimelineAccountsField = document.querySelector('#form_admin_settings_bootstrap_timeline_accounts'); @@ -139,7 +139,7 @@ const onEnableBootstrapTimelineAccountsChange = (target) => { } }; -delegate(document, '#form_admin_settings_enable_bootstrap_timeline_accounts', 'change', ({ target }) => onEnableBootstrapTimelineAccountsChange(target)); +Rails.delegate(document, '#form_admin_settings_enable_bootstrap_timeline_accounts', 'change', ({ target }) => onEnableBootstrapTimelineAccountsChange(target)); const onChangeRegistrationMode = (target) => { const enabled = target.value === 'approved'; @@ -176,7 +176,7 @@ const convertLocalDatetimeToUTC = (value) => { return fullISO8601.slice(0, fullISO8601.indexOf('T') + 6); }; -delegate(document, '#form_admin_settings_registrations_mode', 'change', ({ target }) => onChangeRegistrationMode(target)); +Rails.delegate(document, '#form_admin_settings_registrations_mode', 'change', ({ target }) => onChangeRegistrationMode(target)); ready(() => { const domainBlockSeverityInput = document.getElementById('domain_block_severity'); @@ -213,7 +213,7 @@ ready(() => { } }); - delegate(document, 'form', 'submit', ({ target }) => { + Rails.delegate(document, 'form', 'submit', ({ target }) => { [].forEach.call(target.querySelectorAll('input[type="datetime-local"]'), element => { if (element.value && element.validity.valid) { element.value = convertLocalDatetimeToUTC(element.value); diff --git a/app/javascript/core/settings.js b/app/javascript/core/settings.js index 08e4d50c88..23367d2d31 100644 --- a/app/javascript/core/settings.js +++ b/app/javascript/core/settings.js @@ -1,9 +1,9 @@ // This file will be loaded on settings pages, regardless of theme. import 'packs/public-path'; -import delegate from '@rails/ujs'; +import Rails from '@rails/ujs'; -delegate(document, '#edit_profile input[type=file]', 'change', ({ target }) => { +Rails.delegate(document, '#edit_profile input[type=file]', 'change', ({ target }) => { const avatar = document.getElementById(target.id + '-preview'); const [file] = target.files || []; const url = file ? URL.createObjectURL(file) : avatar.dataset.originalSrc; @@ -11,13 +11,13 @@ delegate(document, '#edit_profile input[type=file]', 'change', ({ target }) => { avatar.src = url; }); -delegate(document, '.input-copy input', 'click', ({ target }) => { +Rails.delegate(document, '.input-copy input', 'click', ({ target }) => { target.focus(); target.select(); target.setSelectionRange(0, target.value.length); }); -delegate(document, '.input-copy button', 'click', ({ target }) => { +Rails.delegate(document, '.input-copy button', 'click', ({ target }) => { const input = target.parentNode.querySelector('.input-copy__wrapper input'); const oldReadOnly = input.readonly; diff --git a/app/javascript/flavours/glitch/packs/common.js b/app/javascript/flavours/glitch/packs/common.js index 064f65c568..caad60a8c3 100644 --- a/app/javascript/flavours/glitch/packs/common.js +++ b/app/javascript/flavours/glitch/packs/common.js @@ -1,8 +1,8 @@ import 'packs/public-path'; -import start from '@rails/ujs'; +import Rails from '@rails/ujs'; import 'flavours/glitch/styles/index.scss'; -start(); +Rails.start(); // This ensures that webpack compiles our images. require.context('../images', true); diff --git a/app/javascript/flavours/glitch/packs/public.jsx b/app/javascript/flavours/glitch/packs/public.jsx index 1eb44a76fc..03b4b324ca 100644 --- a/app/javascript/flavours/glitch/packs/public.jsx +++ b/app/javascript/flavours/glitch/packs/public.jsx @@ -4,7 +4,7 @@ import { createRoot } from 'react-dom/client'; import { IntlMessageFormat } from 'intl-messageformat'; import { defineMessages } from 'react-intl'; -import delegate from '@rails/ujs'; +import Rails from '@rails/ujs'; import axios from 'axios'; import { createBrowserHistory } from 'history'; import { throttle } from 'lodash'; @@ -143,7 +143,7 @@ function main() { scrollToDetailedStatus(); } - delegate(document, '#user_account_attributes_username', 'input', throttle(() => { + Rails.delegate(document, '#user_account_attributes_username', 'input', throttle(() => { const username = document.getElementById('user_account_attributes_username'); if (username.value && username.value.length > 0) { @@ -157,7 +157,7 @@ function main() { } }, 500, { leading: false, trailing: true })); - delegate(document, '#user_password,#user_password_confirmation', 'input', () => { + Rails.delegate(document, '#user_password,#user_password_confirmation', 'input', () => { const password = document.getElementById('user_password'); const confirmation = document.getElementById('user_password_confirmation'); if (!confirmation) return; @@ -171,10 +171,10 @@ function main() { } }); - delegate(document, '.custom-emoji', 'mouseover', getEmojiAnimationHandler('data-original')); - delegate(document, '.custom-emoji', 'mouseout', getEmojiAnimationHandler('data-static')); + Rails.delegate(document, '.custom-emoji', 'mouseover', getEmojiAnimationHandler('data-original')); + Rails.delegate(document, '.custom-emoji', 'mouseout', getEmojiAnimationHandler('data-static')); - delegate(document, '.status__content__spoiler-link', 'click', function() { + Rails.delegate(document, '.status__content__spoiler-link', 'click', function() { const statusEl = this.parentNode.parentNode; if (statusEl.dataset.spoiler === 'expanded') { @@ -210,11 +210,11 @@ function main() { sidebar.classList.toggle('visible'); }; - delegate(document, '.sidebar__toggle__icon', 'click', () => { + Rails.delegate(document, '.sidebar__toggle__icon', 'click', () => { toggleSidebar(); }); - delegate(document, '.sidebar__toggle__icon', 'keydown', e => { + Rails.delegate(document, '.sidebar__toggle__icon', 'keydown', e => { if (e.key === ' ' || e.key === 'Enter') { e.preventDefault(); toggleSidebar(); @@ -223,7 +223,7 @@ function main() { // Empty the honeypot fields in JS in case something like an extension // automatically filled them. - delegate(document, '#registration_new_user,#new_user', 'submit', () => { + Rails.delegate(document, '#registration_new_user,#new_user', 'submit', () => { ['user_website', 'user_confirm_password', 'registration_user_website', 'registration_user_confirm_password'].forEach(id => { const field = document.getElementById(id); if (field) { diff --git a/app/javascript/flavours/glitch/packs/settings.js b/app/javascript/flavours/glitch/packs/settings.js index 87d5d97520..d9f3b68602 100644 --- a/app/javascript/flavours/glitch/packs/settings.js +++ b/app/javascript/flavours/glitch/packs/settings.js @@ -1,5 +1,5 @@ import 'packs/public-path'; -import delegate from '@rails/ujs'; +import Rails from '@rails/ujs'; import loadKeyboardExtensions from 'flavours/glitch/load_keyboard_extensions'; import { loadPolyfills } from 'flavours/glitch/polyfills'; @@ -22,11 +22,11 @@ function main() { sidebar.classList.toggle('visible'); }; - delegate(document, '.sidebar__toggle__icon', 'click', () => { + Rails.delegate(document, '.sidebar__toggle__icon', 'click', () => { toggleSidebar(); }); - delegate(document, '.sidebar__toggle__icon', 'keydown', e => { + Rails.delegate(document, '.sidebar__toggle__icon', 'keydown', e => { if (e.key === ' ' || e.key === 'Enter') { e.preventDefault(); toggleSidebar();