From a86886b1fdc927ed51810fb6b43a0458bedf1cbb Mon Sep 17 00:00:00 2001 From: alfe Date: Wed, 14 Jun 2023 02:26:25 +0900 Subject: [PATCH] Rewrite `` as FC and TS (#25364) --- .../mastodon/components/circular_progress.tsx | 27 ++++++++++++++++ .../mastodon/components/dropdown_menu.jsx | 3 +- .../mastodon/components/loading_indicator.jsx | 31 ------------------- .../mastodon/components/loading_indicator.tsx | 7 +++++ .../mastodon/components/scrollable_list.jsx | 2 +- .../features/account_gallery/index.jsx | 2 +- .../features/account_timeline/index.jsx | 2 +- .../mastodon/features/blocks/index.jsx | 2 +- .../mastodon/features/directory/index.jsx | 2 +- .../mastodon/features/domain_blocks/index.jsx | 2 +- .../mastodon/features/explore/links.jsx | 2 +- .../mastodon/features/explore/results.jsx | 2 +- .../mastodon/features/explore/suggestions.jsx | 2 +- .../mastodon/features/explore/tags.jsx | 2 +- .../mastodon/features/favourites/index.jsx | 2 +- .../mastodon/features/followers/index.jsx | 2 +- .../mastodon/features/following/index.jsx | 2 +- .../mastodon/features/list_timeline/index.jsx | 2 +- .../mastodon/features/lists/index.jsx | 2 +- .../mastodon/features/mutes/index.jsx | 2 +- .../mastodon/features/reblogs/index.jsx | 2 +- .../mastodon/features/report/statuses.jsx | 2 +- .../mastodon/features/status/index.jsx | 2 +- .../features/ui/components/modal_loading.jsx | 2 +- 24 files changed, 55 insertions(+), 53 deletions(-) create mode 100644 app/javascript/mastodon/components/circular_progress.tsx delete mode 100644 app/javascript/mastodon/components/loading_indicator.jsx create mode 100644 app/javascript/mastodon/components/loading_indicator.tsx diff --git a/app/javascript/mastodon/components/circular_progress.tsx b/app/javascript/mastodon/components/circular_progress.tsx new file mode 100644 index 000000000..850eb93e4 --- /dev/null +++ b/app/javascript/mastodon/components/circular_progress.tsx @@ -0,0 +1,27 @@ +interface Props { + size: number; + strokeWidth: number; +} + +export const CircularProgress: React.FC = ({ size, strokeWidth }) => { + const viewBox = `0 0 ${size} ${size}`; + const radius = (size - strokeWidth) / 2; + + return ( + + + + ); +}; diff --git a/app/javascript/mastodon/components/dropdown_menu.jsx b/app/javascript/mastodon/components/dropdown_menu.jsx index 3cfa0ee12..0416df5d4 100644 --- a/app/javascript/mastodon/components/dropdown_menu.jsx +++ b/app/javascript/mastodon/components/dropdown_menu.jsx @@ -8,8 +8,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes'; import { supportsPassiveEvents } from 'detect-passive-events'; import Overlay from 'react-overlays/Overlay'; -import { CircularProgress } from 'mastodon/components/loading_indicator'; - +import { CircularProgress } from "./circular_progress"; import { IconButton } from './icon_button'; const listenerOptions = supportsPassiveEvents ? { passive: true, capture: true } : true; diff --git a/app/javascript/mastodon/components/loading_indicator.jsx b/app/javascript/mastodon/components/loading_indicator.jsx deleted file mode 100644 index c3f7a4e9e..000000000 --- a/app/javascript/mastodon/components/loading_indicator.jsx +++ /dev/null @@ -1,31 +0,0 @@ -import PropTypes from 'prop-types'; - -export const CircularProgress = ({ size, strokeWidth }) => { - const viewBox = `0 0 ${size} ${size}`; - const radius = (size - strokeWidth) / 2; - - return ( - - - - ); -}; - -CircularProgress.propTypes = { - size: PropTypes.number.isRequired, - strokeWidth: PropTypes.number.isRequired, -}; - -const LoadingIndicator = () => ( -
- -
-); - -export default LoadingIndicator; diff --git a/app/javascript/mastodon/components/loading_indicator.tsx b/app/javascript/mastodon/components/loading_indicator.tsx new file mode 100644 index 000000000..6bc24a0d6 --- /dev/null +++ b/app/javascript/mastodon/components/loading_indicator.tsx @@ -0,0 +1,7 @@ +import { CircularProgress } from './circular_progress'; + +export const LoadingIndicator: React.FC = () => ( +
+ +
+); diff --git a/app/javascript/mastodon/components/scrollable_list.jsx b/app/javascript/mastodon/components/scrollable_list.jsx index 5c990d6dc..ce0b579f5 100644 --- a/app/javascript/mastodon/components/scrollable_list.jsx +++ b/app/javascript/mastodon/components/scrollable_list.jsx @@ -17,7 +17,7 @@ import IntersectionObserverWrapper from '../features/ui/util/intersection_observ import { LoadMore } from './load_more'; import { LoadPending } from './load_pending'; -import LoadingIndicator from './loading_indicator'; +import { LoadingIndicator } from './loading_indicator'; const MOUSE_IDLE_DELAY = 300; diff --git a/app/javascript/mastodon/features/account_gallery/index.jsx b/app/javascript/mastodon/features/account_gallery/index.jsx index 653a25866..19c10fa9f 100644 --- a/app/javascript/mastodon/features/account_gallery/index.jsx +++ b/app/javascript/mastodon/features/account_gallery/index.jsx @@ -10,7 +10,7 @@ import { lookupAccount, fetchAccount } from 'mastodon/actions/accounts'; import { openModal } from 'mastodon/actions/modal'; import ColumnBackButton from 'mastodon/components/column_back_button'; import { LoadMore } from 'mastodon/components/load_more'; -import LoadingIndicator from 'mastodon/components/loading_indicator'; +import { LoadingIndicator } from 'mastodon/components/loading_indicator'; import ScrollContainer from 'mastodon/containers/scroll_container'; import BundleColumnError from 'mastodon/features/ui/components/bundle_column_error'; import { normalizeForLookup } from 'mastodon/reducers/accounts_map'; diff --git a/app/javascript/mastodon/features/account_timeline/index.jsx b/app/javascript/mastodon/features/account_timeline/index.jsx index 7bb0152ce..0f18c043b 100644 --- a/app/javascript/mastodon/features/account_timeline/index.jsx +++ b/app/javascript/mastodon/features/account_timeline/index.jsx @@ -17,7 +17,7 @@ import { lookupAccount, fetchAccount } from '../../actions/accounts'; import { fetchFeaturedTags } from '../../actions/featured_tags'; import { expandAccountFeaturedTimeline, expandAccountTimeline, connectTimeline, disconnectTimeline } from '../../actions/timelines'; import ColumnBackButton from '../../components/column_back_button'; -import LoadingIndicator from '../../components/loading_indicator'; +import { LoadingIndicator } from '../../components/loading_indicator'; import StatusList from '../../components/status_list'; import Column from '../ui/components/column'; diff --git a/app/javascript/mastodon/features/blocks/index.jsx b/app/javascript/mastodon/features/blocks/index.jsx index 66e42dc41..d976174ce 100644 --- a/app/javascript/mastodon/features/blocks/index.jsx +++ b/app/javascript/mastodon/features/blocks/index.jsx @@ -10,7 +10,7 @@ import { debounce } from 'lodash'; import { fetchBlocks, expandBlocks } from '../../actions/blocks'; import ColumnBackButtonSlim from '../../components/column_back_button_slim'; -import LoadingIndicator from '../../components/loading_indicator'; +import { LoadingIndicator } from '../../components/loading_indicator'; import ScrollableList from '../../components/scrollable_list'; import AccountContainer from '../../containers/account_container'; import Column from '../ui/components/column'; diff --git a/app/javascript/mastodon/features/directory/index.jsx b/app/javascript/mastodon/features/directory/index.jsx index 635b6f411..df2533196 100644 --- a/app/javascript/mastodon/features/directory/index.jsx +++ b/app/javascript/mastodon/features/directory/index.jsx @@ -14,7 +14,7 @@ import { fetchDirectory, expandDirectory } from 'mastodon/actions/directory'; import Column from 'mastodon/components/column'; import ColumnHeader from 'mastodon/components/column_header'; import { LoadMore } from 'mastodon/components/load_more'; -import LoadingIndicator from 'mastodon/components/loading_indicator'; +import { LoadingIndicator } from 'mastodon/components/loading_indicator'; import { RadioButton } from 'mastodon/components/radio_button'; import ScrollContainer from 'mastodon/containers/scroll_container'; diff --git a/app/javascript/mastodon/features/domain_blocks/index.jsx b/app/javascript/mastodon/features/domain_blocks/index.jsx index 34f0afa2b..9e63b2f81 100644 --- a/app/javascript/mastodon/features/domain_blocks/index.jsx +++ b/app/javascript/mastodon/features/domain_blocks/index.jsx @@ -12,7 +12,7 @@ import { debounce } from 'lodash'; import { fetchDomainBlocks, expandDomainBlocks } from '../../actions/domain_blocks'; import ColumnBackButtonSlim from '../../components/column_back_button_slim'; -import LoadingIndicator from '../../components/loading_indicator'; +import { LoadingIndicator } from '../../components/loading_indicator'; import ScrollableList from '../../components/scrollable_list'; import DomainContainer from '../../containers/domain_container'; import Column from '../ui/components/column'; diff --git a/app/javascript/mastodon/features/explore/links.jsx b/app/javascript/mastodon/features/explore/links.jsx index fba958993..df91337fd 100644 --- a/app/javascript/mastodon/features/explore/links.jsx +++ b/app/javascript/mastodon/features/explore/links.jsx @@ -8,7 +8,7 @@ import { connect } from 'react-redux'; import { fetchTrendingLinks } from 'mastodon/actions/trends'; import DismissableBanner from 'mastodon/components/dismissable_banner'; -import LoadingIndicator from 'mastodon/components/loading_indicator'; +import { LoadingIndicator } from 'mastodon/components/loading_indicator'; import Story from './components/story'; diff --git a/app/javascript/mastodon/features/explore/results.jsx b/app/javascript/mastodon/features/explore/results.jsx index dc1f72022..bf2f0b95a 100644 --- a/app/javascript/mastodon/features/explore/results.jsx +++ b/app/javascript/mastodon/features/explore/results.jsx @@ -12,7 +12,7 @@ import { connect } from 'react-redux'; import { expandSearch } from 'mastodon/actions/search'; import { ImmutableHashtag as Hashtag } from 'mastodon/components/hashtag'; import { LoadMore } from 'mastodon/components/load_more'; -import LoadingIndicator from 'mastodon/components/loading_indicator'; +import { LoadingIndicator } from 'mastodon/components/loading_indicator'; import Account from 'mastodon/containers/account_container'; import Status from 'mastodon/containers/status_container'; diff --git a/app/javascript/mastodon/features/explore/suggestions.jsx b/app/javascript/mastodon/features/explore/suggestions.jsx index bcb710f3e..f2907cdb2 100644 --- a/app/javascript/mastodon/features/explore/suggestions.jsx +++ b/app/javascript/mastodon/features/explore/suggestions.jsx @@ -7,7 +7,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes'; import { connect } from 'react-redux'; import { fetchSuggestions } from 'mastodon/actions/suggestions'; -import LoadingIndicator from 'mastodon/components/loading_indicator'; +import { LoadingIndicator } from 'mastodon/components/loading_indicator'; import AccountCard from 'mastodon/features/directory/components/account_card'; const mapStateToProps = state => ({ diff --git a/app/javascript/mastodon/features/explore/tags.jsx b/app/javascript/mastodon/features/explore/tags.jsx index 1859c6279..ba6f31cd0 100644 --- a/app/javascript/mastodon/features/explore/tags.jsx +++ b/app/javascript/mastodon/features/explore/tags.jsx @@ -9,7 +9,7 @@ import { connect } from 'react-redux'; import { fetchTrendingHashtags } from 'mastodon/actions/trends'; import DismissableBanner from 'mastodon/components/dismissable_banner'; import { ImmutableHashtag as Hashtag } from 'mastodon/components/hashtag'; -import LoadingIndicator from 'mastodon/components/loading_indicator'; +import { LoadingIndicator } from 'mastodon/components/loading_indicator'; const mapStateToProps = state => ({ hashtags: state.getIn(['trends', 'tags', 'items']), diff --git a/app/javascript/mastodon/features/favourites/index.jsx b/app/javascript/mastodon/features/favourites/index.jsx index 8ea137fd2..57911c3a1 100644 --- a/app/javascript/mastodon/features/favourites/index.jsx +++ b/app/javascript/mastodon/features/favourites/index.jsx @@ -11,7 +11,7 @@ import { connect } from 'react-redux'; import { fetchFavourites } from 'mastodon/actions/interactions'; import ColumnHeader from 'mastodon/components/column_header'; import { Icon } from 'mastodon/components/icon'; -import LoadingIndicator from 'mastodon/components/loading_indicator'; +import { LoadingIndicator } from 'mastodon/components/loading_indicator'; import ScrollableList from 'mastodon/components/scrollable_list'; import AccountContainer from 'mastodon/containers/account_container'; import Column from 'mastodon/features/ui/components/column'; diff --git a/app/javascript/mastodon/features/followers/index.jsx b/app/javascript/mastodon/features/followers/index.jsx index c9a474ea2..ec3939551 100644 --- a/app/javascript/mastodon/features/followers/index.jsx +++ b/app/javascript/mastodon/features/followers/index.jsx @@ -20,7 +20,7 @@ import { expandFollowers, } from '../../actions/accounts'; import ColumnBackButton from '../../components/column_back_button'; -import LoadingIndicator from '../../components/loading_indicator'; +import { LoadingIndicator } from '../../components/loading_indicator'; import ScrollableList from '../../components/scrollable_list'; import AccountContainer from '../../containers/account_container'; import LimitedAccountHint from '../account_timeline/components/limited_account_hint'; diff --git a/app/javascript/mastodon/features/following/index.jsx b/app/javascript/mastodon/features/following/index.jsx index 7b203341e..c28c3a3b2 100644 --- a/app/javascript/mastodon/features/following/index.jsx +++ b/app/javascript/mastodon/features/following/index.jsx @@ -20,7 +20,7 @@ import { expandFollowing, } from '../../actions/accounts'; import ColumnBackButton from '../../components/column_back_button'; -import LoadingIndicator from '../../components/loading_indicator'; +import { LoadingIndicator } from '../../components/loading_indicator'; import ScrollableList from '../../components/scrollable_list'; import AccountContainer from '../../containers/account_container'; import LimitedAccountHint from '../account_timeline/components/limited_account_hint'; diff --git a/app/javascript/mastodon/features/list_timeline/index.jsx b/app/javascript/mastodon/features/list_timeline/index.jsx index f9f3a7c31..a5acc416e 100644 --- a/app/javascript/mastodon/features/list_timeline/index.jsx +++ b/app/javascript/mastodon/features/list_timeline/index.jsx @@ -18,7 +18,7 @@ import { expandListTimeline } from 'mastodon/actions/timelines'; import Column from 'mastodon/components/column'; import ColumnHeader from 'mastodon/components/column_header'; import { Icon } from 'mastodon/components/icon'; -import LoadingIndicator from 'mastodon/components/loading_indicator'; +import { LoadingIndicator } from 'mastodon/components/loading_indicator'; import { RadioButton } from 'mastodon/components/radio_button'; import BundleColumnError from 'mastodon/features/ui/components/bundle_column_error'; import StatusListContainer from 'mastodon/features/ui/containers/status_list_container'; diff --git a/app/javascript/mastodon/features/lists/index.jsx b/app/javascript/mastodon/features/lists/index.jsx index 3bc2cd3a9..ecec4b68d 100644 --- a/app/javascript/mastodon/features/lists/index.jsx +++ b/app/javascript/mastodon/features/lists/index.jsx @@ -12,7 +12,7 @@ import { createSelector } from 'reselect'; import { fetchLists } from 'mastodon/actions/lists'; import Column from 'mastodon/components/column'; import ColumnHeader from 'mastodon/components/column_header'; -import LoadingIndicator from 'mastodon/components/loading_indicator'; +import { LoadingIndicator } from 'mastodon/components/loading_indicator'; import ScrollableList from 'mastodon/components/scrollable_list'; import ColumnLink from 'mastodon/features/ui/components/column_link'; import ColumnSubheading from 'mastodon/features/ui/components/column_subheading'; diff --git a/app/javascript/mastodon/features/mutes/index.jsx b/app/javascript/mastodon/features/mutes/index.jsx index 1c74f34ea..947fe4c9b 100644 --- a/app/javascript/mastodon/features/mutes/index.jsx +++ b/app/javascript/mastodon/features/mutes/index.jsx @@ -12,7 +12,7 @@ import { debounce } from 'lodash'; import { fetchMutes, expandMutes } from '../../actions/mutes'; import ColumnBackButtonSlim from '../../components/column_back_button_slim'; -import LoadingIndicator from '../../components/loading_indicator'; +import { LoadingIndicator } from '../../components/loading_indicator'; import ScrollableList from '../../components/scrollable_list'; import AccountContainer from '../../containers/account_container'; import Column from '../ui/components/column'; diff --git a/app/javascript/mastodon/features/reblogs/index.jsx b/app/javascript/mastodon/features/reblogs/index.jsx index 31048eba0..8bcef863f 100644 --- a/app/javascript/mastodon/features/reblogs/index.jsx +++ b/app/javascript/mastodon/features/reblogs/index.jsx @@ -12,7 +12,7 @@ import { Icon } from 'mastodon/components/icon'; import { fetchReblogs } from '../../actions/interactions'; import ColumnHeader from '../../components/column_header'; -import LoadingIndicator from '../../components/loading_indicator'; +import { LoadingIndicator } from '../../components/loading_indicator'; import ScrollableList from '../../components/scrollable_list'; import AccountContainer from '../../containers/account_container'; import Column from '../ui/components/column'; diff --git a/app/javascript/mastodon/features/report/statuses.jsx b/app/javascript/mastodon/features/report/statuses.jsx index 78408c96b..4ba8d6065 100644 --- a/app/javascript/mastodon/features/report/statuses.jsx +++ b/app/javascript/mastodon/features/report/statuses.jsx @@ -8,7 +8,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes'; import { connect } from 'react-redux'; import Button from 'mastodon/components/button'; -import LoadingIndicator from 'mastodon/components/loading_indicator'; +import { LoadingIndicator } from 'mastodon/components/loading_indicator'; import StatusCheckBox from 'mastodon/features/report/containers/status_check_box_container'; const mapStateToProps = (state, { accountId }) => ({ diff --git a/app/javascript/mastodon/features/status/index.jsx b/app/javascript/mastodon/features/status/index.jsx index c31607c8e..892cfbb7b 100644 --- a/app/javascript/mastodon/features/status/index.jsx +++ b/app/javascript/mastodon/features/status/index.jsx @@ -14,7 +14,7 @@ import { createSelector } from 'reselect'; import { HotKeys } from 'react-hotkeys'; import { Icon } from 'mastodon/components/icon'; -import LoadingIndicator from 'mastodon/components/loading_indicator'; +import { LoadingIndicator } from 'mastodon/components/loading_indicator'; import ScrollContainer from 'mastodon/containers/scroll_container'; import BundleColumnError from 'mastodon/features/ui/components/bundle_column_error'; diff --git a/app/javascript/mastodon/features/ui/components/modal_loading.jsx b/app/javascript/mastodon/features/ui/components/modal_loading.jsx index 7a6bbf5fa..7d19e7351 100644 --- a/app/javascript/mastodon/features/ui/components/modal_loading.jsx +++ b/app/javascript/mastodon/features/ui/components/modal_loading.jsx @@ -1,4 +1,4 @@ -import LoadingIndicator from '../../../components/loading_indicator'; +import { LoadingIndicator } from '../../../components/loading_indicator'; // Keep the markup in sync with // (make sure they have the same dimensions)