- {blurhash && 
-
- );
- }
-
-}
diff --git a/app/javascript/mastodon/components/image.tsx b/app/javascript/mastodon/components/image.tsx
new file mode 100644
index 0000000000..9b4d602255
--- /dev/null
+++ b/app/javascript/mastodon/components/image.tsx
@@ -0,0 +1,27 @@
+import React, { useCallback, useState } from 'react';
+import Blurhash from './blurhash';
+import classNames from 'classnames';
+
+type Props = {
+ src: string;
+ srcSet?: string;
+ blurhash?: string;
+ className?: string;
+}
+
+export const Image: React.FC
+ {blurhash &&
+ );
+};
+
+export default Image;
From 13a16f30543c2207caedf0958f7cc30dfc9c706b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=81=9F=E3=81=84=E3=81=A1=20=E3=81=B2?=
-
- );
- }
-
-}
-
-export default injectIntl(Account);
diff --git a/app/javascript/mastodon/components/domain.tsx b/app/javascript/mastodon/components/domain.tsx
new file mode 100644
index 0000000000..6cb8f7b8ff
--- /dev/null
+++ b/app/javascript/mastodon/components/domain.tsx
@@ -0,0 +1,42 @@
+import React, { useCallback } from 'react';
+import IconButton from './icon_button';
+import { InjectedIntl, defineMessages, injectIntl } from 'react-intl';
+
+const messages = defineMessages({
+ unblockDomain: {
+ id: 'account.unblock_domain',
+ defaultMessage: 'Unblock domain {domain}',
+ },
+});
+
+type Props = {
+ domain: string;
+ onUnblockDomain: (domain: string) => void;
+ intl: InjectedIntl;
+};
+const _Domain: React.FC
-
- {domain}
-
-
-
-
-
-
+
+ );
+};
+
+export const Domain = injectIntl(_Domain);
diff --git a/app/javascript/mastodon/containers/domain_container.jsx b/app/javascript/mastodon/containers/domain_container.jsx
index 8a8ba1df12..419d5d29f5 100644
--- a/app/javascript/mastodon/containers/domain_container.jsx
+++ b/app/javascript/mastodon/containers/domain_container.jsx
@@ -2,7 +2,7 @@ import React from 'react';
import { connect } from 'react-redux';
import { blockDomain, unblockDomain } from '../actions/domain_blocks';
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
-import Domain from '../components/domain';
+import { Domain } from '../components/domain';
import { openModal } from '../actions/modal';
const messages = defineMessages({
From b8d44c55fd9264cdacf66c32541b4343e164bbfb Mon Sep 17 00:00:00 2001
From: Renaud Chaput
+
+ {domain}
+
+
+
+
+
+
diff --git a/app/javascript/mastodon/components/blurhash.tsx b/app/javascript/mastodon/components/blurhash.tsx
index 181e2183d0..7005136765 100644
--- a/app/javascript/mastodon/components/blurhash.tsx
+++ b/app/javascript/mastodon/components/blurhash.tsx
@@ -8,7 +8,7 @@ type Props = {
dummy?: boolean; // Whether dummy mode is enabled. If enabled, nothing is rendered and canvas left untouched
children?: never;
[key: string]: any;
-}
+};
const Blurhash: React.FC = ({
hash,
width = 32,
diff --git a/app/javascript/mastodon/components/check.tsx b/app/javascript/mastodon/components/check.tsx
index 57b810a0e5..73d65595ea 100644
--- a/app/javascript/mastodon/components/check.tsx
+++ b/app/javascript/mastodon/components/check.tsx
@@ -1,7 +1,15 @@
import React from 'react';
export const Check: React.FC = () => (
-
-
{isLoading ? (
diff --git a/app/javascript/mastodon/components/image.tsx b/app/javascript/mastodon/components/server_hero_image.tsx
similarity index 93%
rename from app/javascript/mastodon/components/image.tsx
rename to app/javascript/mastodon/components/server_hero_image.tsx
index 490543424a..d10b8a620b 100644
--- a/app/javascript/mastodon/components/image.tsx
+++ b/app/javascript/mastodon/components/server_hero_image.tsx
@@ -9,7 +9,7 @@ type Props = {
className?: string;
};
-export const Image: React.FC = ({
+export const ServerHeroImage: React.FC = ({
src,
srcSet,
blurhash,
diff --git a/app/javascript/mastodon/features/about/index.jsx b/app/javascript/mastodon/features/about/index.jsx
index 11aff67c67..f025a9633a 100644
--- a/app/javascript/mastodon/features/about/index.jsx
+++ b/app/javascript/mastodon/features/about/index.jsx
@@ -11,7 +11,7 @@ import Account from 'mastodon/containers/account_container';
import Skeleton from 'mastodon/components/skeleton';
import { Icon } from 'mastodon/components/icon';
import classNames from 'classnames';
-import { Image } from 'mastodon/components/image';
+import { ServerHeroImage } from 'mastodon/components/server_hero_image';
const messages = defineMessages({
title: { id: 'column.about', defaultMessage: 'About' },
@@ -114,7 +114,7 @@ class About extends React.PureComponent {
;
+ localDomain: string;
+};
+export class DisplayName extends React.PureComponent {
+ handleMouseEnter: React.ReactEventHandler = ({
+ currentTarget,
+ }) => {
+ if (autoPlayGif) {
+ return;
+ }
+
+ const emojis =
+ currentTarget.querySelectorAll('img.custom-emoji');
+
+ emojis.forEach((emoji) => {
+ const originalSrc = emoji.getAttribute('data-original');
+ if (originalSrc != null) emoji.src = originalSrc;
+ });
+ };
+
+ handleMouseLeave: React.ReactEventHandler = ({
+ currentTarget,
+ }) => {
+ if (autoPlayGif) {
+ return;
+ }
+
+ const emojis =
+ currentTarget.querySelectorAll('img.custom-emoji');
+
+ emojis.forEach((emoji) => {
+ const staticSrc = emoji.getAttribute('data-static');
+ if (staticSrc != null) emoji.src = staticSrc;
+ });
+ };
+
+ render() {
+ const { others, localDomain } = this.props;
+
+ let displayName: React.ReactNode, suffix: React.ReactNode, account: Account;
+
+ if (others && others.size > 1) {
+ displayName = others
+ .take(2)
+ .map((a) => (
+
+
+
+ ))
+ .reduce((prev, cur) => [prev, ', ', cur]);
+
+ if (others.size - 2 > 0) {
+ suffix = `+${others.size - 2}`;
+ }
+ } else if ((others && others.size > 0) || this.props.account) {
+ if (others && others.size > 0) {
+ account = others.first();
+ } else {
+ account = this.props.account;
+ }
+
+ let acct = account.get('acct');
+
+ if (acct.indexOf('@') === -1 && localDomain) {
+ acct = `${acct}@${localDomain}`;
+ }
+
+ displayName = (
+
+
+
+ );
+ suffix = @{acct};
+ } else {
+ displayName = (
+
+
+
---
.../flavours/glitch/types/resources.ts | 52 +++++++++++++++++--
1 file changed, 48 insertions(+), 4 deletions(-)
diff --git a/app/javascript/flavours/glitch/types/resources.ts b/app/javascript/flavours/glitch/types/resources.ts
index 28fad2719a..0906504150 100644
--- a/app/javascript/flavours/glitch/types/resources.ts
+++ b/app/javascript/flavours/glitch/types/resources.ts
@@ -1,10 +1,54 @@
import type { Record } from 'immutable';
-type AccountValues = {
- id: number;
+type CustomEmoji = Record<{
+ shortcode: string;
+ static_url: string;
+ url: string;
+}>;
+
+type AccountField = Record<{
+ name: string;
+ value: string;
+ verified_at: string | null;
+}>;
+
+type AccountApiResponseValues = {
+ acct: string;
avatar: string;
avatar_static: string;
- [key: string]: any;
+ bot: boolean;
+ created_at: string;
+ discoverable: boolean;
+ display_name: string;
+ emojis: CustomEmoji[];
+ fields: AccountField[];
+ followers_count: number;
+ following_count: number;
+ group: boolean;
+ header: string;
+ header_static: string;
+ id: string;
+ last_status_at: string;
+ locked: boolean;
+ note: string;
+ statuses_count: number;
+ url: string;
+ username: string;
};
-export type Account = Record;
+type NormalizedAccountField = Record<{
+ name_emojified: string;
+ value_emojified: string;
+ value_plain: string;
+}>;
+
+type NormalizedAccountValues = {
+ display_name_html: string;
+ fields: NormalizedAccountField[];
+ note_emojified: string;
+ note_plain: string;
+};
+
+export type Account = Record<
+ AccountApiResponseValues & NormalizedAccountValues
+>;
From e8415aa727e4ba06aaef61566cca6b6866224804 Mon Sep 17 00:00:00 2001
From: Renaud Chaput
Date: Tue, 9 May 2023 14:55:35 +0200
Subject: [PATCH 042/508] [Glitch] Rework polyfills loading
Port b640f897776fd0ff4048fd3e15009749c7de4178 to glitch-soc
Signed-off-by: Claire
---
app/javascript/flavours/glitch/packs/home.js | 2 +-
.../flavours/glitch/packs/public.jsx | 2 +-
.../flavours/glitch/packs/settings.js | 2 +-
.../flavours/glitch/packs/share.jsx | 2 +-
.../base_polyfills.ts} | 22 +++++--------------
.../extra_polyfills.ts} | 0
.../{load_polyfills.js => polyfills/index.ts} | 16 ++++++--------
7 files changed, 17 insertions(+), 29 deletions(-)
rename app/javascript/flavours/glitch/{base_polyfills.js => polyfills/base_polyfills.ts} (58%)
rename app/javascript/flavours/glitch/{extra_polyfills.js => polyfills/extra_polyfills.ts} (100%)
rename app/javascript/flavours/glitch/{load_polyfills.js => polyfills/index.ts} (82%)
diff --git a/app/javascript/flavours/glitch/packs/home.js b/app/javascript/flavours/glitch/packs/home.js
index ace9dc3c4f..a28625d33b 100644
--- a/app/javascript/flavours/glitch/packs/home.js
+++ b/app/javascript/flavours/glitch/packs/home.js
@@ -1,5 +1,5 @@
import 'packs/public-path';
-import loadPolyfills from 'flavours/glitch/load_polyfills';
+import { loadPolyfills } from 'flavours/glitch/polyfills';
loadPolyfills().then(async () => {
const { default: main } = await import('flavours/glitch/main');
diff --git a/app/javascript/flavours/glitch/packs/public.jsx b/app/javascript/flavours/glitch/packs/public.jsx
index f77d6d3242..34a8f35133 100644
--- a/app/javascript/flavours/glitch/packs/public.jsx
+++ b/app/javascript/flavours/glitch/packs/public.jsx
@@ -1,5 +1,5 @@
import 'packs/public-path';
-import loadPolyfills from 'flavours/glitch/load_polyfills';
+import { loadPolyfills } from 'flavours/glitch/polyfills';
import ready from 'flavours/glitch/ready';
import loadKeyboardExtensions from 'flavours/glitch/load_keyboard_extensions';
import axios from 'axios';
diff --git a/app/javascript/flavours/glitch/packs/settings.js b/app/javascript/flavours/glitch/packs/settings.js
index cca71dae14..891b49337a 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 loadPolyfills from 'flavours/glitch/load_polyfills';
+import { loadPolyfills } from 'flavours/glitch/polyfills';
import loadKeyboardExtensions from 'flavours/glitch/load_keyboard_extensions';
import { delegate } from '@rails/ujs';
import 'cocoon-js-vanilla';
diff --git a/app/javascript/flavours/glitch/packs/share.jsx b/app/javascript/flavours/glitch/packs/share.jsx
index 26228e448a..47a51a5b01 100644
--- a/app/javascript/flavours/glitch/packs/share.jsx
+++ b/app/javascript/flavours/glitch/packs/share.jsx
@@ -1,5 +1,5 @@
import 'packs/public-path';
-import loadPolyfills from 'flavours/glitch/load_polyfills';
+import { loadPolyfills } from 'flavours/glitch/polyfills';
import ComposeContainer from 'flavours/glitch/containers/compose_container';
import React from 'react';
import ReactDOM from 'react-dom';
diff --git a/app/javascript/flavours/glitch/base_polyfills.js b/app/javascript/flavours/glitch/polyfills/base_polyfills.ts
similarity index 58%
rename from app/javascript/flavours/glitch/base_polyfills.js
rename to app/javascript/flavours/glitch/polyfills/base_polyfills.ts
index 91bc5d6dc8..2e583f580d 100644
--- a/app/javascript/flavours/glitch/base_polyfills.js
+++ b/app/javascript/flavours/glitch/polyfills/base_polyfills.ts
@@ -1,26 +1,16 @@
import 'intl';
import 'intl/locale-data/jsonp/en';
-import 'es6-symbol/implement';
-import assign from 'object-assign';
-import values from 'object.values';
-import { decode as decodeBase64 } from './utils/base64';
-import promiseFinally from 'promise.prototype.finally';
-
-if (!Object.assign) {
- Object.assign = assign;
-}
-
-if (!Object.values) {
- values.shim();
-}
-
-promiseFinally.shim();
+import 'core-js/features/object/assign';
+import 'core-js/features/object/values';
+import 'core-js/features/symbol';
+import 'core-js/features/promise/finally';
+import { decode as decodeBase64 } from '../utils/base64';
if (!HTMLCanvasElement.prototype.toBlob) {
const BASE64_MARKER = ';base64,';
Object.defineProperty(HTMLCanvasElement.prototype, 'toBlob', {
- value(callback, type = 'image/png', quality) {
+ value(callback: BlobCallback, type = 'image/png', quality: any) {
const dataURL = this.toDataURL(type, quality);
let data;
diff --git a/app/javascript/flavours/glitch/extra_polyfills.js b/app/javascript/flavours/glitch/polyfills/extra_polyfills.ts
similarity index 100%
rename from app/javascript/flavours/glitch/extra_polyfills.js
rename to app/javascript/flavours/glitch/polyfills/extra_polyfills.ts
diff --git a/app/javascript/flavours/glitch/load_polyfills.js b/app/javascript/flavours/glitch/polyfills/index.ts
similarity index 82%
rename from app/javascript/flavours/glitch/load_polyfills.js
rename to app/javascript/flavours/glitch/polyfills/index.ts
index 7909dc4ea3..6d2e5426e4 100644
--- a/app/javascript/flavours/glitch/load_polyfills.js
+++ b/app/javascript/flavours/glitch/polyfills/index.ts
@@ -10,14 +10,14 @@ function importExtraPolyfills() {
return import(/* webpackChunkName: "extra_polyfills" */ './extra_polyfills');
}
-function loadPolyfills() {
+export function loadPolyfills() {
const needsBasePolyfills = !(
- HTMLCanvasElement.prototype.toBlob &&
- window.Intl &&
- Object.assign &&
- Object.values &&
- window.Symbol &&
- Promise.prototype.finally
+ 'toBlob' in HTMLCanvasElement.prototype &&
+ 'Intl' in window &&
+ 'assign' in Object &&
+ 'values' in Object &&
+ 'Symbol' in window &&
+ 'finally' in Promise.prototype
);
// Latest version of Firefox and Safari do not have IntersectionObserver.
@@ -36,5 +36,3 @@ function loadPolyfills() {
needsExtraPolyfills && importExtraPolyfills(),
]);
}
-
-export default loadPolyfills;
From b21d2eaeb68675fa21ebafc7ff777de70c58398a Mon Sep 17 00:00:00 2001
From: Renaud Chaput
Date: Tue, 9 May 2023 15:48:53 +0200
Subject: [PATCH 043/508] [Glitch] Remove unused iOS agent sniffing function
Port d57be2731c24bba01a2137a22e3b8b916f5be8ab to glitch-soc
Signed-off-by: Claire
---
app/javascript/flavours/glitch/is_mobile.ts | 6 ------
1 file changed, 6 deletions(-)
diff --git a/app/javascript/flavours/glitch/is_mobile.ts b/app/javascript/flavours/glitch/is_mobile.ts
index d33246882d..a3437d28b1 100644
--- a/app/javascript/flavours/glitch/is_mobile.ts
+++ b/app/javascript/flavours/glitch/is_mobile.ts
@@ -27,10 +27,6 @@ export const layoutFromWindow = (layout_local_setting : string): LayoutType => {
}
};
-// eslint-disable-next-line @typescript-eslint/ban-ts-comment
-// @ts-expect-error
-const iOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && window.MSStream != null;
-
const listenerOptions = supportsPassiveEvents ? { passive: true } : false;
let userTouching = false;
@@ -44,5 +40,3 @@ const touchListener = () => {
window.addEventListener('touchstart', touchListener, listenerOptions);
export const isUserTouching = () => userTouching;
-
-export const isIOS = () => iOS;
From 487715a3e35301e2eda5ec94c4945b5f00bfb91c Mon Sep 17 00:00:00 2001
From: Renaud Chaput
Date: Tue, 9 May 2023 16:56:26 +0200
Subject: [PATCH 044/508] [Glitch] Type Redux store and middleware
Port d67de22458e599447c0d5c85ecbd6fb5aef9b4f4 to glitch-soc
Signed-off-by: Claire
---
.../glitch/containers/compose_container.jsx | 2 +-
.../flavours/glitch/containers/mastodon.jsx | 2 +-
app/javascript/flavours/glitch/main.jsx | 2 +-
.../glitch/reducers/{index.js => index.ts} | 4 ++-
.../flavours/glitch/store/configureStore.js | 16 ------------
app/javascript/flavours/glitch/store/index.ts | 23 ++++++++++++++++
.../errors.js => store/middlewares/errors.ts} | 7 ++---
.../middlewares/loading_bar.ts} | 12 ++++++---
.../sounds.js => store/middlewares/sounds.ts} | 26 +++++++++++++------
9 files changed, 60 insertions(+), 34 deletions(-)
rename app/javascript/flavours/glitch/reducers/{index.js => index.ts} (97%)
delete mode 100644 app/javascript/flavours/glitch/store/configureStore.js
create mode 100644 app/javascript/flavours/glitch/store/index.ts
rename app/javascript/flavours/glitch/{middleware/errors.js => store/middlewares/errors.ts} (66%)
rename app/javascript/flavours/glitch/{middleware/loading_bar.js => store/middlewares/loading_bar.ts} (68%)
rename app/javascript/flavours/glitch/{middleware/sounds.js => store/middlewares/sounds.ts} (54%)
diff --git a/app/javascript/flavours/glitch/containers/compose_container.jsx b/app/javascript/flavours/glitch/containers/compose_container.jsx
index dada4cfed7..9b84ed583d 100644
--- a/app/javascript/flavours/glitch/containers/compose_container.jsx
+++ b/app/javascript/flavours/glitch/containers/compose_container.jsx
@@ -1,7 +1,7 @@
import React from 'react';
import { Provider } from 'react-redux';
import PropTypes from 'prop-types';
-import { store } from 'flavours/glitch/store/configureStore';
+import { store } from 'flavours/glitch/store';
import { hydrateStore } from 'flavours/glitch/actions/store';
import { IntlProvider, addLocaleData } from 'react-intl';
import { getLocale } from 'mastodon/locales';
diff --git a/app/javascript/flavours/glitch/containers/mastodon.jsx b/app/javascript/flavours/glitch/containers/mastodon.jsx
index aca7f4dc59..1044fdd160 100644
--- a/app/javascript/flavours/glitch/containers/mastodon.jsx
+++ b/app/javascript/flavours/glitch/containers/mastodon.jsx
@@ -5,7 +5,7 @@ import { IntlProvider, addLocaleData } from 'react-intl';
import { Provider as ReduxProvider } from 'react-redux';
import { BrowserRouter, Route } from 'react-router-dom';
import { ScrollContext } from 'react-router-scroll-4';
-import { store } from 'flavours/glitch/store/configureStore';
+import { store } from 'flavours/glitch/store';
import UI from 'flavours/glitch/features/ui';
import { fetchCustomEmojis } from 'flavours/glitch/actions/custom_emojis';
import { hydrateStore } from 'flavours/glitch/actions/store';
diff --git a/app/javascript/flavours/glitch/main.jsx b/app/javascript/flavours/glitch/main.jsx
index fa8ba47d49..1ac7d579ec 100644
--- a/app/javascript/flavours/glitch/main.jsx
+++ b/app/javascript/flavours/glitch/main.jsx
@@ -2,7 +2,7 @@ import React from 'react';
import ReactDOM from 'react-dom';
import { setupBrowserNotifications } from 'flavours/glitch/actions/notifications';
import Mastodon from 'flavours/glitch/containers/mastodon';
-import { store } from 'flavours/glitch/store/configureStore';
+import { store } from 'flavours/glitch/store';
import { me } from 'flavours/glitch/initial_state';
import ready from 'flavours/glitch/ready';
diff --git a/app/javascript/flavours/glitch/reducers/index.js b/app/javascript/flavours/glitch/reducers/index.ts
similarity index 97%
rename from app/javascript/flavours/glitch/reducers/index.js
rename to app/javascript/flavours/glitch/reducers/index.ts
index 5b7bdbf699..da2174fc2c 100644
--- a/app/javascript/flavours/glitch/reducers/index.js
+++ b/app/javascript/flavours/glitch/reducers/index.ts
@@ -91,4 +91,6 @@ const reducers = {
followed_tags,
};
-export default combineReducers(reducers);
+const rootReducer = combineReducers(reducers);
+
+export { rootReducer };
diff --git a/app/javascript/flavours/glitch/store/configureStore.js b/app/javascript/flavours/glitch/store/configureStore.js
deleted file mode 100644
index cb17dd9ce8..0000000000
--- a/app/javascript/flavours/glitch/store/configureStore.js
+++ /dev/null
@@ -1,16 +0,0 @@
-import { configureStore } from '@reduxjs/toolkit';
-import thunk from 'redux-thunk';
-import appReducer from '../reducers';
-import loadingBarMiddleware from '../middleware/loading_bar';
-import errorsMiddleware from '../middleware/errors';
-import soundsMiddleware from '../middleware/sounds';
-
-export const store = configureStore({
- reducer: appReducer,
- middleware: [
- thunk,
- loadingBarMiddleware({ promiseTypeSuffixes: ['REQUEST', 'SUCCESS', 'FAIL'] }),
- errorsMiddleware(),
- soundsMiddleware(),
- ],
-});
diff --git a/app/javascript/flavours/glitch/store/index.ts b/app/javascript/flavours/glitch/store/index.ts
new file mode 100644
index 0000000000..822c01aa90
--- /dev/null
+++ b/app/javascript/flavours/glitch/store/index.ts
@@ -0,0 +1,23 @@
+import { configureStore } from '@reduxjs/toolkit';
+import { rootReducer } from '../reducers';
+import { loadingBarMiddleware } from './middlewares/loading_bar';
+import { errorsMiddleware } from './middlewares/errors';
+import { soundsMiddleware } from './middlewares/sounds';
+import { TypedUseSelectorHook, useDispatch, useSelector } from 'react-redux';
+
+export const store = configureStore({
+ reducer: rootReducer,
+ middleware: getDefaultMiddleware =>
+ getDefaultMiddleware().concat(
+ loadingBarMiddleware({ promiseTypeSuffixes: ['REQUEST', 'SUCCESS', 'FAIL'] }))
+ .concat(errorsMiddleware)
+ .concat(soundsMiddleware()),
+});
+
+// Infer the `RootState` and `AppDispatch` types from the store itself
+export type RootState = ReturnType
+// Inferred type: {posts: PostsState, comments: CommentsState, users: UsersState}
+export type AppDispatch = typeof store.dispatch
+
+export const useAppDispatch: () => AppDispatch = useDispatch;
+export const useAppSelector: TypedUseSelectorHook = useSelector;
diff --git a/app/javascript/flavours/glitch/middleware/errors.js b/app/javascript/flavours/glitch/store/middlewares/errors.ts
similarity index 66%
rename from app/javascript/flavours/glitch/middleware/errors.js
rename to app/javascript/flavours/glitch/store/middlewares/errors.ts
index 3639a59512..be9e586521 100644
--- a/app/javascript/flavours/glitch/middleware/errors.js
+++ b/app/javascript/flavours/glitch/store/middlewares/errors.ts
@@ -1,9 +1,11 @@
+import { Middleware } from 'redux';
import { showAlertForError } from 'flavours/glitch/actions/alerts';
+import { RootState } from '..';
const defaultFailSuffix = 'FAIL';
-export default function errorsMiddleware() {
- return ({ dispatch }) => next => action => {
+export const errorsMiddleware: Middleware, RootState> =
+ ({ dispatch }) => next => action => {
if (action.type && !action.skipAlert) {
const isFail = new RegExp(`${defaultFailSuffix}$`, 'g');
@@ -14,4 +16,3 @@ export default function errorsMiddleware() {
return next(action);
};
-}
diff --git a/app/javascript/flavours/glitch/middleware/loading_bar.js b/app/javascript/flavours/glitch/store/middlewares/loading_bar.ts
similarity index 68%
rename from app/javascript/flavours/glitch/middleware/loading_bar.js
rename to app/javascript/flavours/glitch/store/middlewares/loading_bar.ts
index da8cc4c7d3..e860b31b6f 100644
--- a/app/javascript/flavours/glitch/middleware/loading_bar.js
+++ b/app/javascript/flavours/glitch/store/middlewares/loading_bar.ts
@@ -1,8 +1,14 @@
import { showLoading, hideLoading } from 'react-redux-loading-bar';
+import { Middleware } from 'redux';
+import { RootState } from '..';
-const defaultTypeSuffixes = ['PENDING', 'FULFILLED', 'REJECTED'];
+interface Config {
+ promiseTypeSuffixes?: string[]
+}
-export default function loadingBarMiddleware(config = {}) {
+const defaultTypeSuffixes: Config['promiseTypeSuffixes'] = ['PENDING', 'FULFILLED', 'REJECTED'];
+
+export const loadingBarMiddleware = (config: Config = {}): Middleware, RootState> => {
const promiseTypeSuffixes = config.promiseTypeSuffixes || defaultTypeSuffixes;
return ({ dispatch }) => next => (action) => {
@@ -22,4 +28,4 @@ export default function loadingBarMiddleware(config = {}) {
return next(action);
};
-}
+};
diff --git a/app/javascript/flavours/glitch/middleware/sounds.js b/app/javascript/flavours/glitch/store/middlewares/sounds.ts
similarity index 54%
rename from app/javascript/flavours/glitch/middleware/sounds.js
rename to app/javascript/flavours/glitch/store/middlewares/sounds.ts
index 7f23889836..c9d51f857f 100644
--- a/app/javascript/flavours/glitch/middleware/sounds.js
+++ b/app/javascript/flavours/glitch/store/middlewares/sounds.ts
@@ -1,4 +1,12 @@
-const createAudio = sources => {
+import { Middleware, AnyAction } from 'redux';
+import { RootState } from '..';
+
+interface AudioSource {
+ src: string
+ type: string
+}
+
+const createAudio = (sources: AudioSource[]) => {
const audio = new Audio();
sources.forEach(({ type, src }) => {
const source = document.createElement('source');
@@ -9,7 +17,7 @@ const createAudio = sources => {
return audio;
};
-const play = audio => {
+const play = (audio: HTMLAudioElement) => {
if (!audio.paused) {
audio.pause();
if (typeof audio.fastSeek === 'function') {
@@ -22,8 +30,8 @@ const play = audio => {
audio.play();
};
-export default function soundsMiddleware() {
- const soundCache = {
+export const soundsMiddleware = (): Middleware, RootState> => {
+ const soundCache: {[key: string]: HTMLAudioElement} = {
boop: createAudio([
{
src: '/sounds/boop.ogg',
@@ -36,11 +44,13 @@ export default function soundsMiddleware() {
]),
};
- return () => next => action => {
- if (action.meta && action.meta.sound && soundCache[action.meta.sound]) {
- play(soundCache[action.meta.sound]);
+ return () => next => (action: AnyAction) => {
+ const sound = action?.meta?.sound;
+
+ if (sound && soundCache[sound]) {
+ play(soundCache[sound]);
}
return next(action);
};
-}
+};
From e63a08bafdf02d9db9e61626afd2d12f55a7e760 Mon Sep 17 00:00:00 2001
From: Claire
Date: Tue, 9 May 2023 23:41:18 +0200
Subject: [PATCH 045/508] Run prettier on Typescript files
Port 0886856bd2adecedcad6fad9dcb86ed8069c46c0 to glitch-soc
---
app/javascript/flavours/glitch/blurhash.ts | 4 +-
app/javascript/flavours/glitch/compare_id.ts | 2 +-
.../glitch/components/animated_number.tsx | 50 +++--
.../flavours/glitch/components/avatar.tsx | 15 +-
.../flavours/glitch/components/blurhash.tsx | 2 +-
.../flavours/glitch/components/gifv.tsx | 26 ++-
.../flavours/glitch/components/icon.tsx | 15 +-
.../glitch/components/icon_button.tsx | 28 +--
.../glitch/components/icon_with_badge.tsx | 15 +-
.../flavours/glitch/components/image.tsx | 14 +-
.../components/not_signed_in_indicator.tsx | 5 +-
.../glitch/components/radio_button.tsx | 8 +-
.../glitch/components/relative_timestamp.tsx | 189 ++++++++++++------
app/javascript/flavours/glitch/is_mobile.ts | 32 +--
app/javascript/flavours/glitch/permissions.ts | 6 +-
.../glitch/polyfills/base_polyfills.ts | 2 +-
app/javascript/flavours/glitch/scroll.ts | 37 +++-
app/javascript/flavours/glitch/store/index.ts | 14 +-
.../glitch/store/middlewares/errors.ts | 4 +-
.../glitch/store/middlewares/loading_bar.ts | 43 ++--
.../glitch/store/middlewares/sounds.ts | 13 +-
.../flavours/glitch/utils/filters.ts | 24 +--
.../flavours/glitch/utils/numbers.ts | 13 +-
app/javascript/flavours/glitch/uuid.ts | 7 +-
24 files changed, 373 insertions(+), 195 deletions(-)
diff --git a/app/javascript/flavours/glitch/blurhash.ts b/app/javascript/flavours/glitch/blurhash.ts
index cb1c3b2c82..dadf2b7f2c 100644
--- a/app/javascript/flavours/glitch/blurhash.ts
+++ b/app/javascript/flavours/glitch/blurhash.ts
@@ -98,9 +98,9 @@ export const decode83 = (str: string) => {
};
export const intToRGB = (int: number) => ({
- r: Math.max(0, (int >> 16)),
+ r: Math.max(0, int >> 16),
g: Math.max(0, (int >> 8) & 255),
- b: Math.max(0, (int & 255)),
+ b: Math.max(0, int & 255),
});
export const getAverageFromBlurhash = (blurhash: string) => {
diff --git a/app/javascript/flavours/glitch/compare_id.ts b/app/javascript/flavours/glitch/compare_id.ts
index 3ddfb76351..30b0572481 100644
--- a/app/javascript/flavours/glitch/compare_id.ts
+++ b/app/javascript/flavours/glitch/compare_id.ts
@@ -1,4 +1,4 @@
-export function compareId (id1: string, id2: string) {
+export function compareId(id1: string, id2: string) {
if (id1 === id2) {
return 0;
}
diff --git a/app/javascript/flavours/glitch/components/animated_number.tsx b/app/javascript/flavours/glitch/components/animated_number.tsx
index 20ffa1a4d0..f6c77d35ff 100644
--- a/app/javascript/flavours/glitch/components/animated_number.tsx
+++ b/app/javascript/flavours/glitch/components/animated_number.tsx
@@ -16,13 +16,10 @@ const obfuscatedCount = (count: number) => {
type Props = {
value: number;
obfuscate?: boolean;
-}
-export const AnimatedNumber: React.FC = ({
- value,
- obfuscate,
-})=> {
+};
+export const AnimatedNumber: React.FC = ({ value, obfuscate }) => {
const [previousValue, setPreviousValue] = useState(value);
- const [direction, setDirection] = useState<1|-1>(1);
+ const [direction, setDirection] = useState<1 | -1>(1);
if (previousValue !== value) {
setPreviousValue(value);
@@ -30,24 +27,45 @@ export const AnimatedNumber: React.FC = ({
}
const willEnter = useCallback(() => ({ y: -1 * direction }), [direction]);
- const willLeave = useCallback(() => ({ y: spring(1 * direction, { damping: 35, stiffness: 400 }) }), [direction]);
+ const willLeave = useCallback(
+ () => ({ y: spring(1 * direction, { damping: 35, stiffness: 400 }) }),
+ [direction]
+ );
if (reduceMotion) {
- return obfuscate ? <>{obfuscatedCount(value)} :
- {items => (
+
+ {(items) => (
{items.map(({ key, data, style }) => (
- 0 ? 'absolute' : 'static', transform: `translateY(${style.y * 100}%)` }}>{obfuscate ? obfuscatedCount(data) : = ({
account,
@@ -19,7 +19,8 @@ export const Avatar: React.FC = ({
inline = false,
style: styleFromParent,
}) => {
- const { hovering, handleMouseEnter, handleMouseLeave } = useHovering(autoPlayGif);
+ const { hovering, handleMouseEnter, handleMouseLeave } =
+ useHovering(autoPlayGif);
const style = {
...styleFromParent,
@@ -29,12 +30,18 @@ export const Avatar: React.FC = ({
};
if (account) {
- style.backgroundImage = `url(${account.get(hovering ? 'avatar' : 'avatar_static')})`;
+ style.backgroundImage = `url(${account.get(
+ hovering ? 'avatar' : 'avatar_static'
+ )})`;
}
return (
- `${value} ${key.replace('@', '')}`).join(', ')} className='about__header__hero' />
+ `${value} ${key.replace('@', '')}`).join(', ')} className='about__header__hero' />
{isLoading ?
From a150bb4f2ef7078ffe26f27cf9adab2d72c0bca8 Mon Sep 17 00:00:00 2001
From: fusagiko / takayamaki <24884114+takayamaki@users.noreply.github.com>
Date: Wed, 10 May 2023 06:08:54 +0900
Subject: [PATCH 040/508] Add type annotation for DisplayName component
(#24752)
---
.../__tests__/display_name-test.jsx | 2 +-
.../mastodon/components/account.jsx | 2 +-
.../mastodon/components/display_name.jsx | 79 ------------
.../mastodon/components/display_name.tsx | 115 ++++++++++++++++++
app/javascript/mastodon/components/status.jsx | 2 +-
.../components/moved_note.jsx | 2 +-
.../components/autosuggest_account.jsx | 2 +-
.../compose/components/reply_indicator.jsx | 2 +-
.../directory/components/account_card.jsx | 2 +-
.../components/account_authorize.jsx | 2 +-
.../list_adder/components/account.jsx | 2 +-
.../list_editor/components/account.jsx | 2 +-
.../components/follow_request.jsx | 2 +-
.../picture_in_picture/components/header.jsx | 2 +-
.../report/components/status_check_box.jsx | 2 +-
.../status/components/detailed_status.jsx | 2 +-
.../features/ui/components/boost_modal.jsx | 2 +-
17 files changed, 130 insertions(+), 94 deletions(-)
delete mode 100644 app/javascript/mastodon/components/display_name.jsx
create mode 100644 app/javascript/mastodon/components/display_name.tsx
diff --git a/app/javascript/mastodon/components/__tests__/display_name-test.jsx b/app/javascript/mastodon/components/__tests__/display_name-test.jsx
index 0d040c4cd8..afb6c4758a 100644
--- a/app/javascript/mastodon/components/__tests__/display_name-test.jsx
+++ b/app/javascript/mastodon/components/__tests__/display_name-test.jsx
@@ -1,7 +1,7 @@
import React from 'react';
import renderer from 'react-test-renderer';
import { fromJS } from 'immutable';
-import DisplayName from '../display_name';
+import { DisplayName } from '../display_name';
describe('{isLoading ?
= ({
hash,
width = 32,
diff --git a/app/javascript/flavours/glitch/components/gifv.tsx b/app/javascript/flavours/glitch/components/gifv.tsx
index 5d9f235e11..72914ba741 100644
--- a/app/javascript/flavours/glitch/components/gifv.tsx
+++ b/app/javascript/flavours/glitch/components/gifv.tsx
@@ -8,7 +8,7 @@ type Props = {
width: number;
height: number;
onClick?: () => void;
-}
+};
export const GIFV: React.FC = ({
src,
@@ -17,19 +17,23 @@ export const GIFV: React.FC = ({
width,
height,
onClick,
-})=> {
+}) => {
const [loading, setLoading] = useState(true);
- const handleLoadedData: React.ReactEventHandler = useCallback(() => {
- setLoading(false);
- }, [setLoading]);
+ const handleLoadedData: React.ReactEventHandler =
+ useCallback(() => {
+ setLoading(false);
+ }, [setLoading]);
- const handleClick: React.MouseEventHandler = useCallback((e) => {
- if (onClick) {
- e.stopPropagation();
- onClick();
- }
- }, [onClick]);
+ const handleClick: React.MouseEventHandler = useCallback(
+ (e) => {
+ if (onClick) {
+ e.stopPropagation();
+ onClick();
+ }
+ },
+ [onClick]
+ );
return (
diff --git a/app/javascript/flavours/glitch/components/icon.tsx b/app/javascript/flavours/glitch/components/icon.tsx
index f74437b555..4eb948dc76 100644
--- a/app/javascript/flavours/glitch/components/icon.tsx
+++ b/app/javascript/flavours/glitch/components/icon.tsx
@@ -7,6 +7,15 @@ type Props = {
fixedWidth?: boolean;
children?: never;
[key: string]: any;
-}
-export const Icon: React.FC = ({ id, className, fixedWidth, ...other }) =>
- ;
+};
+export const Icon: React.FC = ({
+ id,
+ className,
+ fixedWidth,
+ ...other
+}) => (
+
+);
diff --git a/app/javascript/flavours/glitch/components/icon_button.tsx b/app/javascript/flavours/glitch/components/icon_button.tsx
index d3d0609718..80b20ae1b0 100644
--- a/app/javascript/flavours/glitch/components/icon_button.tsx
+++ b/app/javascript/flavours/glitch/components/icon_button.tsx
@@ -26,13 +26,12 @@ type Props = {
obfuscateCount?: boolean;
href?: string;
ariaHidden: boolean;
-}
+};
type States = {
- activate: boolean,
- deactivate: boolean,
-}
+ activate: boolean;
+ deactivate: boolean;
+};
export class IconButton extends React.PureComponent {
-
static defaultProps = {
size: 18,
active: false,
@@ -48,7 +47,7 @@ export class IconButton extends React.PureComponent {
deactivate: false,
};
- UNSAFE_componentWillReceiveProps (nextProps: Props) {
+ UNSAFE_componentWillReceiveProps(nextProps: Props) {
if (!nextProps.animate) return;
if (this.props.active && !nextProps.active) {
@@ -58,7 +57,7 @@ export class IconButton extends React.PureComponent {
}
}
- handleClick: React.MouseEventHandler = (e) => {
+ handleClick: React.MouseEventHandler = (e) => {
e.preventDefault();
if (!this.props.disabled && this.props.onClick != null) {
@@ -84,7 +83,7 @@ export class IconButton extends React.PureComponent {
}
};
- render () {
+ render() {
// Hack required for some icons which have an overriden size
let containerSize = '1.28571429em';
if (this.props.style?.fontSize) {
@@ -120,10 +119,7 @@ export class IconButton extends React.PureComponent {
ariaHidden,
} = this.props;
- const {
- activate,
- deactivate,
- } = this.state;
+ const { activate, deactivate } = this.state;
const classes = classNames(className, 'icon-button', {
active,
@@ -141,7 +137,12 @@ export class IconButton extends React.PureComponent {
let contents = (
- {typeof counter !== 'undefined' &&
);
@@ -174,5 +175,4 @@ export class IconButton extends React.PureComponent {
);
}
-
}
diff --git a/app/javascript/flavours/glitch/components/icon_with_badge.tsx b/app/javascript/flavours/glitch/components/icon_with_badge.tsx
index a4af86ca9b..bf86814c03 100644
--- a/app/javascript/flavours/glitch/components/icon_with_badge.tsx
+++ b/app/javascript/flavours/glitch/components/icon_with_badge.tsx
@@ -1,18 +1,25 @@
import React from 'react';
import { Icon } from './icon';
-const formatNumber = (num: number): number | string => num > 40 ? '40+' : num;
+const formatNumber = (num: number): number | string => (num > 40 ? '40+' : num);
type Props = {
id: string;
count: number;
issueBadge: boolean;
className: string;
-}
-export const IconWithBadge: React.FC = ({ id, count, issueBadge, className }) => (
+};
+export const IconWithBadge: React.FC = ({
+ id,
+ count,
+ issueBadge,
+ className,
+}) => (
= ({ src, srcSet, blurhash, className }) => {
+export const Image: React.FC = ({
+ src,
+ srcSet,
+ blurhash,
+ className,
+}) => {
const [loaded, setLoaded] = useState(false);
const handleLoad = useCallback(() => {
@@ -17,7 +22,10 @@ export const Image: React.FC = ({ src, srcSet, blurhash, className }) =>
}, [setLoaded]);
return (
-
+
);
diff --git a/app/javascript/flavours/glitch/components/radio_button.tsx b/app/javascript/flavours/glitch/components/radio_button.tsx
index 194b67afe1..829f471747 100644
--- a/app/javascript/flavours/glitch/components/radio_button.tsx
+++ b/app/javascript/flavours/glitch/components/radio_button.tsx
@@ -9,7 +9,13 @@ type Props = {
label: React.ReactNode;
};
-export const RadioButton: React.FC = ({ name, value, checked, onChange, label }) => {
+export const RadioButton: React.FC = ({
+ name,
+ value,
+ checked,
+ onChange,
+ label,
+}) => {
return (
{blurhash &&
diff --git a/app/javascript/flavours/glitch/components/not_signed_in_indicator.tsx b/app/javascript/flavours/glitch/components/not_signed_in_indicator.tsx
index 3bfee6ae91..53945d6a7a 100644
--- a/app/javascript/flavours/glitch/components/not_signed_in_indicator.tsx
+++ b/app/javascript/flavours/glitch/components/not_signed_in_indicator.tsx
@@ -4,7 +4,10 @@ import { FormattedMessage } from 'react-intl';
export const NotSignedInIndicator: React.FC = () => (
-