From 81e1cc5fece9a431c28ca648c2dd4b1b5f643f13 Mon Sep 17 00:00:00 2001 From: Yamagishi Kazutoshi Date: Fri, 26 Aug 2022 03:10:01 +0900 Subject: Replace to `workbox-webpack-plugin` from `offline-plugin` (#18409) --- app/javascript/mastodon/main.js | 26 ++- app/javascript/mastodon/service_worker/entry.js | 81 +++++--- .../service_worker/web_push_notifications.js | 7 +- app/javascript/mastodon/storage/db.js | 27 --- app/javascript/mastodon/storage/modifier.js | 211 --------------------- 5 files changed, 71 insertions(+), 281 deletions(-) delete mode 100644 app/javascript/mastodon/storage/db.js delete mode 100644 app/javascript/mastodon/storage/modifier.js (limited to 'app/javascript') diff --git a/app/javascript/mastodon/main.js b/app/javascript/mastodon/main.js index bda51f692..a66975bfd 100644 --- a/app/javascript/mastodon/main.js +++ b/app/javascript/mastodon/main.js @@ -1,9 +1,9 @@ -import * as registerPushNotifications from './actions/push_notifications'; -import { setupBrowserNotifications } from './actions/notifications'; -import { default as Mastodon, store } from './containers/mastodon'; import React from 'react'; import ReactDOM from 'react-dom'; -import ready from './ready'; +import * as registerPushNotifications from 'mastodon/actions/push_notifications'; +import { setupBrowserNotifications } from 'mastodon/actions/notifications'; +import Mastodon, { store } from 'mastodon/containers/mastodon'; +import ready from 'mastodon/ready'; const perf = require('./performance'); @@ -24,10 +24,20 @@ function main() { ReactDOM.render(, mountNode); store.dispatch(setupBrowserNotifications()); - if (process.env.NODE_ENV === 'production') { - // avoid offline in dev mode because it's harder to debug - require('offline-plugin/runtime').install(); - store.dispatch(registerPushNotifications.register()); + + if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) { + import('workbox-window') + .then(({ Workbox }) => { + const wb = new Workbox('/sw.js'); + + return wb.register(); + }) + .then(() => { + store.dispatch(registerPushNotifications.register()); + }) + .catch(err => { + console.error(err); + }); } perf.stop('main()'); }); diff --git a/app/javascript/mastodon/service_worker/entry.js b/app/javascript/mastodon/service_worker/entry.js index b354f3b33..e4c66cc00 100644 --- a/app/javascript/mastodon/service_worker/entry.js +++ b/app/javascript/mastodon/service_worker/entry.js @@ -1,20 +1,59 @@ -// import { freeStorage, storageFreeable } from '../storage/modifier'; -import './web_push_notifications'; +import { ExpirationPlugin } from 'workbox-expiration'; +import { precacheAndRoute } from 'workbox-precaching'; +import { registerRoute } from 'workbox-routing'; +import { CacheFirst } from 'workbox-strategies'; +import { handleNotificationClick, handlePush } from './web_push_notifications'; -// function openSystemCache() { -// return caches.open('mastodon-system'); -// } +const CACHE_NAME_PREFIX = 'mastodon-'; function openWebCache() { - return caches.open('mastodon-web'); + return caches.open(`${CACHE_NAME_PREFIX}web`); } function fetchRoot() { return fetch('/', { credentials: 'include', redirect: 'manual' }); } -// const firefox = navigator.userAgent.match(/Firefox\/(\d+)/); -// const invalidOnlyIfCached = firefox && firefox[1] < 60; +precacheAndRoute(self.__WB_MANIFEST); + +registerRoute( + /locale_.*\.js$/, + new CacheFirst({ + cacheName: `${CACHE_NAME_PREFIX}locales`, + plugins: [ + new ExpirationPlugin({ + maxAgeSeconds: 30 * 24 * 60 * 60, // 1 month + maxEntries: 5, + }), + ], + }), +); + +registerRoute( + ({ request }) => request.destination === 'font', + new CacheFirst({ + cacheName: `${CACHE_NAME_PREFIX}fonts`, + plugins: [ + new ExpirationPlugin({ + maxAgeSeconds: 30 * 24 * 60 * 60, // 1 month + maxEntries: 5, + }), + ], + }), +); + +registerRoute( + ({ request }) => ['audio', 'image', 'track', 'video'].includes(request.destination), + new CacheFirst({ + cacheName: `m${CACHE_NAME_PREFIX}media`, + plugins: [ + new ExpirationPlugin({ + maxAgeSeconds: 7 * 24 * 60 * 60, // 1 week + maxEntries: 256, + }), + ], + }), +); // Cause a new version of a registered Service Worker to replace an existing one // that is already installed, and replace the currently active worker on open pages. @@ -52,26 +91,8 @@ self.addEventListener('fetch', function(event) { return response; })); - } /* else if (storageFreeable && (ATTACHMENT_HOST ? url.host === ATTACHMENT_HOST : url.pathname.startsWith('/system/'))) { - event.respondWith(openSystemCache().then(cache => { - return cache.match(event.request.url).then(cached => { - if (cached === undefined) { - const asyncResponse = invalidOnlyIfCached && event.request.cache === 'only-if-cached' ? - fetch(event.request, { cache: 'no-cache' }) : fetch(event.request); - - return asyncResponse.then(response => { - if (response.ok) { - cache - .put(event.request.url, response.clone()) - .catch(()=>{}).then(freeStorage()).catch(); - } - - return response; - }); - } - - return cached; - }); - })); - } */ + } }); + +self.addEventListener('push', handlePush); +self.addEventListener('notificationclick', handleNotificationClick); diff --git a/app/javascript/mastodon/service_worker/web_push_notifications.js b/app/javascript/mastodon/service_worker/web_push_notifications.js index 48a2be7e7..9b75e9b9d 100644 --- a/app/javascript/mastodon/service_worker/web_push_notifications.js +++ b/app/javascript/mastodon/service_worker/web_push_notifications.js @@ -75,7 +75,7 @@ const formatMessage = (messageId, locale, values = {}) => const htmlToPlainText = html => unescape(html.replace(//g, '\n').replace(/<\/p>

/g, '\n\n').replace(/<[^>]*>/g, '')); -const handlePush = (event) => { +export const handlePush = (event) => { const { access_token, notification_id, preferred_locale, title, body, icon } = event.data.json(); // Placeholder until more information can be loaded @@ -189,7 +189,7 @@ const openUrl = url => return self.clients.openWindow(url); }); -const handleNotificationClick = (event) => { +export const handleNotificationClick = (event) => { const reactToNotificationClick = new Promise((resolve, reject) => { if (event.action) { if (event.action === 'expand') { @@ -211,6 +211,3 @@ const handleNotificationClick = (event) => { event.waitUntil(reactToNotificationClick); }; - -self.addEventListener('push', handlePush); -self.addEventListener('notificationclick', handleNotificationClick); diff --git a/app/javascript/mastodon/storage/db.js b/app/javascript/mastodon/storage/db.js deleted file mode 100644 index 377a792a7..000000000 --- a/app/javascript/mastodon/storage/db.js +++ /dev/null @@ -1,27 +0,0 @@ -export default () => new Promise((resolve, reject) => { - // ServiceWorker is required to synchronize the login state. - // Microsoft Edge 17 does not support getAll according to: - // Catalog of standard and vendor APIs across browsers - Microsoft Edge Development - // https://developer.microsoft.com/en-us/microsoft-edge/platform/catalog/?q=specName%3Aindexeddb - if (!('caches' in self && 'getAll' in IDBObjectStore.prototype)) { - reject(); - return; - } - - const request = indexedDB.open('mastodon'); - - request.onerror = reject; - request.onsuccess = ({ target }) => resolve(target.result); - - request.onupgradeneeded = ({ target }) => { - const accounts = target.result.createObjectStore('accounts', { autoIncrement: true }); - const statuses = target.result.createObjectStore('statuses', { autoIncrement: true }); - - accounts.createIndex('id', 'id', { unique: true }); - accounts.createIndex('moved', 'moved'); - - statuses.createIndex('id', 'id', { unique: true }); - statuses.createIndex('account', 'account'); - statuses.createIndex('reblog', 'reblog'); - }; -}); diff --git a/app/javascript/mastodon/storage/modifier.js b/app/javascript/mastodon/storage/modifier.js deleted file mode 100644 index 9fadabef4..000000000 --- a/app/javascript/mastodon/storage/modifier.js +++ /dev/null @@ -1,211 +0,0 @@ -import openDB from './db'; - -const accountAssetKeys = ['avatar', 'avatar_static', 'header', 'header_static']; -const storageMargin = 8388608; -const storeLimit = 1024; - -// navigator.storage is not present on: -// Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.100 Safari/537.36 Edge/16.16299 -// estimate method is not present on Chrome 57.0.2987.98 on Linux. -export const storageFreeable = 'storage' in navigator && 'estimate' in navigator.storage; - -function openCache() { - // ServiceWorker and Cache API is not available on iOS 11 - // https://webkit.org/status/#specification-service-workers - return self.caches ? caches.open('mastodon-system') : Promise.reject(); -} - -function printErrorIfAvailable(error) { - if (error) { - console.warn(error); - } -} - -function put(name, objects, onupdate, oncreate) { - return openDB().then(db => (new Promise((resolve, reject) => { - const putTransaction = db.transaction(name, 'readwrite'); - const putStore = putTransaction.objectStore(name); - const putIndex = putStore.index('id'); - - objects.forEach(object => { - putIndex.getKey(object.id).onsuccess = retrieval => { - function addObject() { - putStore.add(object); - } - - function deleteObject() { - putStore.delete(retrieval.target.result).onsuccess = addObject; - } - - if (retrieval.target.result) { - if (onupdate) { - onupdate(object, retrieval.target.result, putStore, deleteObject); - } else { - deleteObject(); - } - } else { - if (oncreate) { - oncreate(object, addObject); - } else { - addObject(); - } - } - }; - }); - - putTransaction.oncomplete = () => { - const readTransaction = db.transaction(name, 'readonly'); - const readStore = readTransaction.objectStore(name); - const count = readStore.count(); - - count.onsuccess = () => { - const excess = count.result - storeLimit; - - if (excess > 0) { - const retrieval = readStore.getAll(null, excess); - - retrieval.onsuccess = () => resolve(retrieval.result); - retrieval.onerror = reject; - } else { - resolve([]); - } - }; - - count.onerror = reject; - }; - - putTransaction.onerror = reject; - })).then(resolved => { - db.close(); - return resolved; - }, error => { - db.close(); - throw error; - })); -} - -function evictAccountsByRecords(records) { - return openDB().then(db => { - const transaction = db.transaction(['accounts', 'statuses'], 'readwrite'); - const accounts = transaction.objectStore('accounts'); - const accountsIdIndex = accounts.index('id'); - const accountsMovedIndex = accounts.index('moved'); - const statuses = transaction.objectStore('statuses'); - const statusesIndex = statuses.index('account'); - - function evict(toEvict) { - toEvict.forEach(record => { - openCache() - .then(cache => accountAssetKeys.forEach(key => cache.delete(records[key]))) - .catch(printErrorIfAvailable); - - accountsMovedIndex.getAll(record.id).onsuccess = ({ target }) => evict(target.result); - - statusesIndex.getAll(record.id).onsuccess = - ({ target }) => evictStatusesByRecords(target.result); - - accountsIdIndex.getKey(record.id).onsuccess = - ({ target }) => target.result && accounts.delete(target.result); - }); - } - - evict(records); - - db.close(); - }).catch(printErrorIfAvailable); -} - -export function evictStatus(id) { - evictStatuses([id]); -} - -export function evictStatuses(ids) { - return openDB().then(db => { - const transaction = db.transaction('statuses', 'readwrite'); - const store = transaction.objectStore('statuses'); - const idIndex = store.index('id'); - const reblogIndex = store.index('reblog'); - - ids.forEach(id => { - reblogIndex.getAllKeys(id).onsuccess = - ({ target }) => target.result.forEach(reblogKey => store.delete(reblogKey)); - - idIndex.getKey(id).onsuccess = - ({ target }) => target.result && store.delete(target.result); - }); - - db.close(); - }).catch(printErrorIfAvailable); -} - -function evictStatusesByRecords(records) { - return evictStatuses(records.map(({ id }) => id)); -} - -export function putAccounts(records, avatarStatic) { - const avatarKey = avatarStatic ? 'avatar_static' : 'avatar'; - const newURLs = []; - - put('accounts', records, (newRecord, oldKey, store, oncomplete) => { - store.get(oldKey).onsuccess = ({ target }) => { - accountAssetKeys.forEach(key => { - const newURL = newRecord[key]; - const oldURL = target.result[key]; - - if (newURL !== oldURL) { - openCache() - .then(cache => cache.delete(oldURL)) - .catch(printErrorIfAvailable); - } - }); - - const newURL = newRecord[avatarKey]; - const oldURL = target.result[avatarKey]; - - if (newURL !== oldURL) { - newURLs.push(newURL); - } - - oncomplete(); - }; - }, (newRecord, oncomplete) => { - newURLs.push(newRecord[avatarKey]); - oncomplete(); - }).then(records => Promise.all([ - evictAccountsByRecords(records), - openCache().then(cache => cache.addAll(newURLs)), - ])).then(freeStorage, error => { - freeStorage(); - throw error; - }).catch(printErrorIfAvailable); -} - -export function putStatuses(records) { - put('statuses', records) - .then(evictStatusesByRecords) - .catch(printErrorIfAvailable); -} - -export function freeStorage() { - return storageFreeable && navigator.storage.estimate().then(({ quota, usage }) => { - if (usage + storageMargin < quota) { - return null; - } - - return openDB().then(db => new Promise((resolve, reject) => { - const retrieval = db.transaction('accounts', 'readonly').objectStore('accounts').getAll(null, 1); - - retrieval.onsuccess = () => { - if (retrieval.result.length > 0) { - resolve(evictAccountsByRecords(retrieval.result).then(freeStorage)); - } else { - resolve(caches.delete('mastodon-system')); - } - }; - - retrieval.onerror = reject; - - db.close(); - })); - }); -} -- cgit From 5b0e8cc92b9ca0ab0dc24366d95f67a88c470173 Mon Sep 17 00:00:00 2001 From: Eugen Rochko Date: Thu, 25 Aug 2022 23:33:34 +0200 Subject: Add ability to select all accounts matching search for batch actions (#19053) --- app/controllers/admin/accounts_controller.rb | 6 +++- app/javascript/packs/admin.js | 53 ++++++++++++++++++++++++++++ app/javascript/styles/mastodon/tables.scss | 49 +++++++++++++++++++++++++ app/models/custom_filter_status.rb | 2 +- app/models/form/account_batch.rb | 13 +++++-- app/views/admin/accounts/index.html.haml | 9 +++++ config/locales/en.yml | 10 ++++++ 7 files changed, 138 insertions(+), 4 deletions(-) (limited to 'app/javascript') diff --git a/app/controllers/admin/accounts_controller.rb b/app/controllers/admin/accounts_controller.rb index 46c9aba91..40bf685c5 100644 --- a/app/controllers/admin/accounts_controller.rb +++ b/app/controllers/admin/accounts_controller.rb @@ -16,7 +16,11 @@ module Admin def batch authorize :account, :index? - @form = Form::AccountBatch.new(form_account_batch_params.merge(current_account: current_account, action: action_from_button)) + @form = Form::AccountBatch.new(form_account_batch_params) + @form.current_account = current_account + @form.action = action_from_button + @form.select_all_matching = params[:select_all_matching] + @form.query = filtered_accounts @form.save rescue ActionController::ParameterMissing flash[:alert] = I18n.t('admin.accounts.no_account_selected') diff --git a/app/javascript/packs/admin.js b/app/javascript/packs/admin.js index a3ed1ffed..b733d6b18 100644 --- a/app/javascript/packs/admin.js +++ b/app/javascript/packs/admin.js @@ -4,18 +4,71 @@ import ready from '../mastodon/ready'; const batchCheckboxClassName = '.batch-checkbox input[type="checkbox"]'; +const showSelectAll = () => { + const selectAllMatchingElement = document.querySelector('.batch-table__select-all'); + selectAllMatchingElement.classList.add('active'); +}; + +const hideSelectAll = () => { + const selectAllMatchingElement = document.querySelector('.batch-table__select-all'); + const hiddenField = document.querySelector('#select_all_matching'); + const selectedMsg = document.querySelector('.batch-table__select-all .selected'); + const notSelectedMsg = document.querySelector('.batch-table__select-all .not-selected'); + + selectAllMatchingElement.classList.remove('active'); + selectedMsg.classList.remove('active'); + notSelectedMsg.classList.add('active'); + hiddenField.value = '0'; +}; + delegate(document, '#batch_checkbox_all', 'change', ({ target }) => { + const selectAllMatchingElement = document.querySelector('.batch-table__select-all'); + [].forEach.call(document.querySelectorAll(batchCheckboxClassName), (content) => { content.checked = target.checked; }); + + if (selectAllMatchingElement) { + if (target.checked) { + showSelectAll(); + } else { + hideSelectAll(); + } + } +}); + +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'); + const notSelectedMsg = document.querySelector('.batch-table__select-all .not-selected'); + + if (active) { + hiddenField.value = '0'; + selectedMsg.classList.remove('active'); + notSelectedMsg.classList.add('active'); + } else { + hiddenField.value = '1'; + notSelectedMsg.classList.remove('active'); + selectedMsg.classList.add('active'); + } }); delegate(document, batchCheckboxClassName, 'change', () => { const checkAllElement = document.querySelector('#batch_checkbox_all'); + const selectAllMatchingElement = document.querySelector('.batch-table__select-all'); if (checkAllElement) { checkAllElement.checked = [].every.call(document.querySelectorAll(batchCheckboxClassName), (content) => content.checked); checkAllElement.indeterminate = !checkAllElement.checked && [].some.call(document.querySelectorAll(batchCheckboxClassName), (content) => content.checked); + + if (selectAllMatchingElement) { + if (checkAllElement.checked) { + showSelectAll(); + } else { + hideSelectAll(); + } + } } }); diff --git a/app/javascript/styles/mastodon/tables.scss b/app/javascript/styles/mastodon/tables.scss index 431b8a73a..39211910f 100644 --- a/app/javascript/styles/mastodon/tables.scss +++ b/app/javascript/styles/mastodon/tables.scss @@ -190,6 +190,55 @@ a.table-action-link { } } + &__select-all { + background: $ui-base-color; + height: 47px; + align-items: center; + justify-content: center; + border: 1px solid darken($ui-base-color, 8%); + border-top: 0; + color: $secondary-text-color; + display: none; + + &.active { + display: flex; + } + + .selected, + .not-selected { + display: none; + + &.active { + display: block; + } + } + + strong { + font-weight: 700; + } + + span { + padding: 8px; + display: inline-block; + } + + button { + background: transparent; + border: 0; + font: inherit; + color: $highlight-text-color; + border-radius: 4px; + font-weight: 700; + padding: 8px; + + &:hover, + &:focus, + &:active { + background: lighten($ui-base-color, 8%); + } + } + } + &__form { padding: 16px; border: 1px solid darken($ui-base-color, 8%); diff --git a/app/models/custom_filter_status.rb b/app/models/custom_filter_status.rb index b6bea1394..e748d6963 100644 --- a/app/models/custom_filter_status.rb +++ b/app/models/custom_filter_status.rb @@ -5,7 +5,7 @@ # # id :bigint(8) not null, primary key # custom_filter_id :bigint(8) not null -# status_id :bigint(8) default(""), not null +# status_id :bigint(8) not null # created_at :datetime not null # updated_at :datetime not null # diff --git a/app/models/form/account_batch.rb b/app/models/form/account_batch.rb index 98f2cad3e..5cfcf7205 100644 --- a/app/models/form/account_batch.rb +++ b/app/models/form/account_batch.rb @@ -6,7 +6,8 @@ class Form::AccountBatch include AccountableConcern include Payloadable - attr_accessor :account_ids, :action, :current_account + attr_accessor :account_ids, :action, :current_account, + :select_all_matching, :query def save case action @@ -60,7 +61,11 @@ class Form::AccountBatch end def accounts - Account.where(id: account_ids) + if select_all_matching? + query + else + Account.where(id: account_ids) + end end def approve! @@ -118,4 +123,8 @@ class Form::AccountBatch log_action(:approve, account.user) account.user.approve! end + + def select_all_matching? + select_all_matching == '1' + end end diff --git a/app/views/admin/accounts/index.html.haml b/app/views/admin/accounts/index.html.haml index cb378f0ed..670a09a2d 100644 --- a/app/views/admin/accounts/index.html.haml +++ b/app/views/admin/accounts/index.html.haml @@ -37,6 +37,7 @@ = form_for(@form, url: batch_admin_accounts_path) do |f| = hidden_field_tag :page, params[:page] || 1 + = hidden_field_tag :select_all_matching, '0' - AccountFilter::KEYS.each do |key| = hidden_field_tag key, params[key] if params[key].present? @@ -52,6 +53,14 @@ = f.button safe_join([fa_icon('times'), t('admin.accounts.reject')]), name: :reject, class: 'table-action-link', type: :submit, data: { confirm: t('admin.reports.are_you_sure') } = f.button safe_join([fa_icon('lock'), t('admin.accounts.perform_full_suspension')]), name: :suspend, class: 'table-action-link', type: :submit, data: { confirm: t('admin.reports.are_you_sure') } + - if true || @accounts.total_count > @accounts.size + .batch-table__select-all + .not-selected.active + %span= t('generic.all_items_on_page_selected_html', count: @accounts.size) + %button{ type: 'button' }= t('generic.select_all_matching_items', count: @accounts.total_count) + .selected + %span= t('generic.all_matching_items_selected_html', count: @accounts.total_count) + %button{ type: 'button' }= t('generic.deselect') .batch-table__body - if @accounts.empty? = nothing_here 'nothing-here--under-tabs' diff --git a/config/locales/en.yml b/config/locales/en.yml index 5c309ab11..6aa87e4a0 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -1227,12 +1227,22 @@ en: trending_now: Trending now generic: all: All + all_items_on_page_selected_html: + one: "%{count} item on this page is selected." + other: All %{count} items on this page are selected. + all_matching_items_selected_html: + one: "%{count} item matching your search is selected." + other: All %{count} items matching your search are selected. changes_saved_msg: Changes successfully saved! copy: Copy delete: Delete + deselect: Deselect all none: None order_by: Order by save_changes: Save changes + select_all_matching_items: + one: Select %{count} item matching your search. + other: Select all %{count} items matching your search. today: today validation_errors: one: Something isn't quite right yet! Please review the error below -- cgit From 1fac99e842c99e8f6aef9429ee1f19c7e63f7b07 Mon Sep 17 00:00:00 2001 From: Shlee Date: Fri, 26 Aug 2022 09:42:46 +0930 Subject: Add rel="noopener" to links to remote profiles (#19014) * Update timeline_hint.js * Update timeline_hint.js --- app/javascript/mastodon/components/timeline_hint.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'app/javascript') diff --git a/app/javascript/mastodon/components/timeline_hint.js b/app/javascript/mastodon/components/timeline_hint.js index fb55a62cc..ac9a79dcc 100644 --- a/app/javascript/mastodon/components/timeline_hint.js +++ b/app/javascript/mastodon/components/timeline_hint.js @@ -6,7 +6,7 @@ const TimelineHint = ({ resource, url }) => (


- +
); -- cgit