matty/ncd-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge remote-tracking branch 'soapbox/develop' into rss-button

Browse Source
This commit is contained in:
marcin mikołajczak
2022-11-21 20:41:25 +01:00
parent 5d10324127 a0597a6445
commit 8be2ee918d
617 changed files with 2758 additions and 6347 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/soapbox/features/ui/__tests__/index.test.tsx
View File

@@ -5,7 +5,7 @@ import { Route, Switch } from 'react-router-dom';
import { render, screen, waitFor } from '../../../jest/test-helpers';
import { normalizeAccount } from '../../../normalizers';
import UI from '../index';
import { WrappedRoute } from '../util/react_router_helpers';
import { WrappedRoute } from '../util/react-router-helpers';
const TestableComponent = () => (
<Switch>

53
app/soapbox/features/ui/components/accordion.tsx
View File

@@ -1,53 +0,0 @@
import classNames from 'clsx';
import React from 'react';
import { defineMessages, useIntl } from 'react-intl';
import { Text } from 'soapbox/components/ui';
import DropdownMenu from 'soapbox/containers/dropdown_menu_container';
import type { Menu } from 'soapbox/components/dropdown_menu';
const messages = defineMessages({
collapse: { id: 'accordion.collapse', defaultMessage: 'Collapse' },
expand: { id: 'accordion.expand', defaultMessage: 'Expand' },
});
interface IAccordion {
headline: React.ReactNode,
children?: React.ReactNode,
menu?: Menu,
expanded?: boolean,
onToggle?: (value: boolean) => void,
}
const Accordion: React.FC<IAccordion> = ({ headline, children, menu, expanded = false, onToggle = () => {} }) => {
const intl = useIntl();
const handleToggle = (e: React.MouseEvent<HTMLButtonElement>) => {
onToggle(!expanded);
e.preventDefault();
};
return (
<div className={classNames('accordion', { 'accordion--expanded': expanded })}>
{menu && (
<div className='accordion__menu'>
<DropdownMenu items={menu} src={require('@tabler/icons/dots-vertical.svg')} />
</div>
)}
<button
type='button'
className='accordion__title'
onClick={handleToggle}
title={intl.formatMessage(expanded ? messages.collapse : messages.expand)}
>
<Text weight='bold'>{headline}</Text>
</button>
<div className='accordion__content'>
<Text>{children}</Text>
</div>
</div>
);
};
export default Accordion;

0
app/soapbox/features/ui/components/background_shapes.tsx → app/soapbox/features/ui/components/background-shapes.tsx
View File

4
app/soapbox/features/ui/components/better_column.js → app/soapbox/features/ui/components/better-column.js
View File

@@ -2,9 +2,9 @@ import PropTypes from 'prop-types';
import React from 'react';
import { Column } from 'soapbox/components/ui';
import DropdownMenu from 'soapbox/containers/dropdown_menu_container';
import DropdownMenu from 'soapbox/containers/dropdown-menu-container';
import ColumnHeader from './column_header';
import ColumnHeader from './column-header';
// Yes, there are 3 types of columns at this point, but this one is better, I swear
export default class BetterColumn extends React.PureComponent {

0
app/soapbox/features/ui/components/bundle_column_error.tsx → app/soapbox/features/ui/components/bundle-column-error.tsx
View File

4
app/soapbox/features/ui/components/bundle_modal_error.tsx → app/soapbox/features/ui/components/bundle-modal-error.tsx
View File

@@ -1,7 +1,7 @@
import React from 'react';
import { defineMessages, useIntl } from 'react-intl';
import IconButton from 'soapbox/components/icon_button';
import IconButton from 'soapbox/components/icon-button';
const messages = defineMessages({
error: { id: 'bundle_modal_error.message', defaultMessage: 'Something went wrong while loading this page.' },
@@ -32,7 +32,7 @@ const BundleModalError: React.FC<IBundleModalError> = ({ onRetry, onClose }) =>
<div>
<button
onClick={onClose}
className='error-modal__nav onboarding-modal__skip'
className='error-modal__nav'
>
{intl.formatMessage(messages.close)}
</button>

6
app/soapbox/features/ui/components/bundle.tsx
View File

@@ -3,10 +3,10 @@ import React from 'react';
const emptyComponent = () => null;
const noop = () => { };
interface BundleProps {
export interface BundleProps {
fetchComponent: () => Promise<any>,
loading: React.ComponentType,
error: React.ComponentType<{ onRetry: (props: BundleProps) => void }>,
error: React.ComponentType<{ onRetry: (props?: BundleProps) => void }>,
children: (mod: any) => React.ReactNode,
renderDelay?: number,
onFetch: () => void,
@@ -57,7 +57,7 @@ class Bundle extends React.PureComponent<BundleProps, BundleState> {
}
}
load = (props: BundleProps) => {
load = (props?: BundleProps) => {
const { fetchComponent, onFetch, onFetchSuccess, onFetchFail, renderDelay } = props || this.props;
const cachedMod = Bundle.cache.get(fetchComponent);

0
app/soapbox/features/ui/components/column_forbidden.tsx → app/soapbox/features/ui/components/column-forbidden.tsx
View File

2
app/soapbox/features/ui/components/column_header.tsx → app/soapbox/features/ui/components/column-header.tsx
View File

@@ -2,7 +2,7 @@ import React from 'react';
// import classNames from 'clsx';
// import Icon from 'soapbox/components/icon';
import SubNavigation from 'soapbox/components/sub_navigation';
import SubNavigation from 'soapbox/components/sub-navigation';
interface IColumnHeader {
icon?: string,

0
app/soapbox/features/ui/components/column_loading.tsx → app/soapbox/features/ui/components/column-loading.tsx
View File

2
app/soapbox/features/ui/components/column.tsx
View File

@@ -3,7 +3,7 @@ import React from 'react';
import Pullable from 'soapbox/components/pullable';
import { Column } from 'soapbox/components/ui';
import ColumnHeader from './column_header';
import ColumnHeader from './column-header';
import type { IColumn } from 'soapbox/components/ui/column/column';

0
app/soapbox/features/ui/components/columns_area.tsx → app/soapbox/features/ui/components/columns-area.tsx
View File

29
app/soapbox/features/ui/components/funding_panel.tsx → app/soapbox/features/ui/components/funding-panel.tsx
View File

@@ -2,7 +2,7 @@ import React, { useEffect } from 'react';
import { FormattedMessage } from 'react-intl';
import { fetchPatronInstance } from 'soapbox/actions/patron';
import { Widget, Button, ProgressBar, Text } from 'soapbox/components/ui';
import { Widget, Button, ProgressBar, Text, Stack } from 'soapbox/components/ui';
import { useAppSelector, useAppDispatch } from 'soapbox/hooks';
/** Open link in a new tab. */
@@ -42,7 +42,7 @@ const FundingPanel: React.FC = () => {
let ratioText;
if (goalReached) {
ratioText = <><strong>{moneyFormat(goal)}</strong> per month<span className='funding-panel__reached'>&mdash; reached!</span></>;
ratioText = <><strong>{moneyFormat(goal)}</strong> per month <span>&mdash; reached!</span></>;
} else {
ratioText = <><strong>{moneyFormat(amount)} out of {moneyFormat(goal)}</strong> per month</>;
}
@@ -56,18 +56,19 @@ const FundingPanel: React.FC = () => {
title={<FormattedMessage id='patron.title' defaultMessage='Funding Goal' />}
onActionClick={handleDonateClick}
>
<div className='funding-panel__ratio'>
<Text>{ratioText}</Text>
</div>
<ProgressBar progress={amount / goal} />
<div className='funding-panel__description'>
<Text>{goalText}</Text>
</div>
<div>
<Button theme='secondary' onClick={handleDonateClick}>
<FormattedMessage id='patron.donate' defaultMessage='Donate' />
</Button>
</div>
<Stack space={4}>
<Stack space={2}>
<Text>{ratioText}</Text>
<ProgressBar progress={amount / goal} />
</Stack>
<Stack space={2}>
<Text theme='muted'>{goalText}</Text>
<Button block theme='primary' onClick={handleDonateClick}>
<FormattedMessage id='patron.donate' defaultMessage='Donate' />
</Button>
</Stack>
</Stack>
</Widget>
);
};

2
app/soapbox/features/ui/components/instance_info_panel.tsx → app/soapbox/features/ui/components/instance-info-panel.tsx
View File

@@ -3,7 +3,7 @@
import React from 'react';
import { useIntl, defineMessages } from 'react-intl';
import { pinHost, unpinHost } from 'soapbox/actions/remote_timeline';
import { pinHost, unpinHost } from 'soapbox/actions/remote-timeline';
import { Widget } from 'soapbox/components/ui';
import { useAppSelector, useAppDispatch, useSettings } from 'soapbox/hooks';
import { makeGetRemoteInstance } from 'soapbox/selectors';

4
app/soapbox/features/ui/components/instance_moderation_panel.tsx → app/soapbox/features/ui/components/instance-moderation-panel.tsx
View File

@@ -5,8 +5,8 @@ import { useIntl, defineMessages, FormattedMessage } from 'react-intl';
import { openModal } from 'soapbox/actions/modals';
import { Widget } from 'soapbox/components/ui';
import DropdownMenu from 'soapbox/containers/dropdown_menu_container';
import InstanceRestrictions from 'soapbox/features/federation_restrictions/components/instance_restrictions';
import DropdownMenu from 'soapbox/containers/dropdown-menu-container';
import InstanceRestrictions from 'soapbox/features/federation-restrictions/components/instance-restrictions';
import { useAppSelector, useAppDispatch, useOwnAccount } from 'soapbox/hooks';
import { makeGetRemoteInstance } from 'soapbox/selectors';

0
app/soapbox/features/ui/components/link_footer.tsx → app/soapbox/features/ui/components/link-footer.tsx
View File

0
app/soapbox/features/ui/components/list_panel.tsx → app/soapbox/features/ui/components/list-panel.tsx
View File

2
app/soapbox/features/ui/components/modal_loading.tsx → app/soapbox/features/ui/components/modal-loading.tsx
View File

@@ -11,7 +11,7 @@ const ModalLoading = () => (
</div>
<div className='error-modal__footer'>
<div>
<button className='error-modal__nav onboarding-modal__skip' />
<button className='error-modal__nav' />
</div>
</div>
</div>

32
app/soapbox/features/ui/components/modal_root.js → app/soapbox/features/ui/components/modal-root.tsx
View File

@@ -1,7 +1,6 @@
import PropTypes from 'prop-types';
import React from 'react';
import Base from 'soapbox/components/modal_root';
import Base from 'soapbox/components/modal-root';
import {
MediaModal,
VideoModal,
@@ -34,10 +33,11 @@ import {
AccountModerationModal,
} from 'soapbox/features/ui/util/async-components';
import BundleContainer from '../containers/bundle_container';
import BundleContainer from '../containers/bundle-container';
import BundleModalError from './bundle_modal_error';
import ModalLoading from './modal_loading';
import { BundleProps } from './bundle';
import BundleModalError from './bundle-modal-error';
import ModalLoading from './modal-loading';
const MODAL_COMPONENTS = {
'MEDIA': MediaModal,
@@ -71,19 +71,21 @@ const MODAL_COMPONENTS = {
'ACCOUNT_MODERATION': AccountModerationModal,
};
export default class ModalRoot extends React.PureComponent {
export type ModalType = keyof typeof MODAL_COMPONENTS | null;
static propTypes = {
type: PropTypes.string,
props: PropTypes.object,
onClose: PropTypes.func.isRequired,
};
interface IModalRoot {
type: ModalType,
props?: Record<string, any> | null,
onClose: (type?: ModalType) => void,
}
export default class ModalRoot extends React.PureComponent<IModalRoot> {
getSnapshotBeforeUpdate() {
return { visible: !!this.props.type };
}
componentDidUpdate(prevProps, prevState, { visible }) {
componentDidUpdate(prevProps: IModalRoot, prevState: any, { visible }: any) {
if (visible) {
document.body.classList.add('with-modals');
} else {
@@ -91,15 +93,15 @@ export default class ModalRoot extends React.PureComponent {
}
}
renderLoading = modalId => () => {
renderLoading = (modalId: string) => () => {
return !['MEDIA', 'VIDEO', 'BOOST', 'CONFIRM', 'ACTIONS'].includes(modalId) ? <ModalLoading /> : null;
}
renderError = (props) => {
renderError: React.ComponentType<{ onRetry: (props?: BundleProps) => void }> = (props) => {
return <BundleModalError {...props} onClose={this.onClickClose} />;
}
onClickClose = (_) => {
onClickClose = (_?: ModalType) => {
const { onClose, type } = this.props;
onClose(type);
}

2
app/soapbox/features/ui/components/modals/account-moderation-modal/account-moderation-modal.tsx
View File

@@ -12,7 +12,7 @@ import { deactivateUserModal, deleteUserModal } from 'soapbox/actions/moderation
import snackbar from 'soapbox/actions/snackbar';
import Account from 'soapbox/components/account';
import List, { ListItem } from 'soapbox/components/list';
import MissingIndicator from 'soapbox/components/missing_indicator';
import MissingIndicator from 'soapbox/components/missing-indicator';
import OutlineBox from 'soapbox/components/outline-box';
import { Button, Text, HStack, Modal, Stack, Toggle } from 'soapbox/components/ui';
import { useAppDispatch, useAppSelector, useFeatures, useOwnAccount } from 'soapbox/hooks';

0
app/soapbox/features/ui/components/account_note_modal.tsx → app/soapbox/features/ui/components/modals/account-note-modal.tsx
View File

8
app/soapbox/features/ui/components/actions_modal.tsx → app/soapbox/features/ui/components/modals/actions-modal.tsx
View File

@@ -4,13 +4,13 @@ import { FormattedMessage } from 'react-intl';
import { spring } from 'react-motion';
import Icon from 'soapbox/components/icon';
import StatusContent from 'soapbox/components/status_content';
import StatusContent from 'soapbox/components/status-content';
import { Stack } from 'soapbox/components/ui';
import AccountContainer from 'soapbox/containers/account_container';
import AccountContainer from 'soapbox/containers/account-container';
import Motion from '../util/optional_motion';
import Motion from '../../util/optional-motion';
import type { Menu, MenuItem } from 'soapbox/components/dropdown_menu';
import type { Menu, MenuItem } from 'soapbox/components/dropdown-menu';
import type { Status as StatusEntity } from 'soapbox/types/entities';
interface IActionsModal {

2
app/soapbox/features/ui/components/birthdays_modal.tsx → app/soapbox/features/ui/components/modals/birthdays-modal.tsx
View File

@@ -1,7 +1,7 @@
import React from 'react';
import { FormattedMessage } from 'react-intl';
import ScrollableList from 'soapbox/components/scrollable_list';
import ScrollableList from 'soapbox/components/scrollable-list';
import { Modal, Spinner } from 'soapbox/components/ui';
import Account from 'soapbox/features/birthdays/account';
import { useAppSelector } from 'soapbox/hooks';

2
app/soapbox/features/ui/components/boost_modal.tsx → app/soapbox/features/ui/components/modals/boost-modal.tsx
View File

@@ -3,7 +3,7 @@ import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
import Icon from 'soapbox/components/icon';
import { Modal, Stack, Text } from 'soapbox/components/ui';
import ReplyIndicator from 'soapbox/features/compose/components/reply_indicator';
import ReplyIndicator from 'soapbox/features/compose/components/reply-indicator';
import type { Status as StatusEntity } from 'soapbox/types/entities';

0
app/soapbox/features/ui/components/compare_history_modal.tsx → app/soapbox/features/ui/components/modals/compare-history-modal.tsx
View File

0
app/soapbox/features/ui/components/component_modal.tsx → app/soapbox/features/ui/components/modals/component-modal.tsx
View File

4
app/soapbox/features/ui/components/compose_modal.tsx → app/soapbox/features/ui/components/modals/compose-modal.tsx
View File

@@ -3,11 +3,11 @@ import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
import { cancelReplyCompose } from 'soapbox/actions/compose';
import { openModal, closeModal } from 'soapbox/actions/modals';
import { checkComposeContent } from 'soapbox/components/modal_root';
import { checkComposeContent } from 'soapbox/components/modal-root';
import { Modal } from 'soapbox/components/ui';
import { useAppDispatch, useCompose } from 'soapbox/hooks';
import ComposeForm from '../../compose/components/compose-form';
import ComposeForm from '../../../compose/components/compose-form';
const messages = defineMessages({
close: { id: 'lightbox.close', defaultMessage: 'Close' },

0
app/soapbox/features/ui/components/confirmation_modal.tsx → app/soapbox/features/ui/components/modals/confirmation-modal.tsx
View File

4
app/soapbox/features/ui/components/crypto_donate_modal.tsx → app/soapbox/features/ui/components/modals/crypto-donate-modal.tsx
View File

@@ -1,9 +1,9 @@
import React from 'react';
import { Modal } from 'soapbox/components/ui';
import DetailedCryptoAddress from 'soapbox/features/crypto_donate/components/detailed_crypto_address';
import DetailedCryptoAddress from 'soapbox/features/crypto-donate/components/detailed-crypto-address';
import type { ICryptoAddress } from '../../crypto_donate/components/crypto_address';
import type { ICryptoAddress } from '../../../crypto-donate/components/crypto-address';
const CryptoDonateModal: React.FC<ICryptoAddress & { onClose: () => void }> = ({ onClose, ...props }) => {

0
app/soapbox/features/ui/components/edit_federation_modal.tsx → app/soapbox/features/ui/components/modals/edit-federation-modal.tsx
View File

0
app/soapbox/features/ui/components/embed-modal.tsx → app/soapbox/features/ui/components/modals/embed-modal.tsx
View File

4
app/soapbox/features/ui/components/familiar_followers_modal.tsx → app/soapbox/features/ui/components/modals/familiar-followers-modal.tsx
View File

@@ -2,9 +2,9 @@ import { OrderedSet as ImmutableOrderedSet } from 'immutable';
import React from 'react';
import { FormattedMessage } from 'react-intl';
import ScrollableList from 'soapbox/components/scrollable_list';
import ScrollableList from 'soapbox/components/scrollable-list';
import { Modal, Spinner } from 'soapbox/components/ui';
import AccountContainer from 'soapbox/containers/account_container';
import AccountContainer from 'soapbox/containers/account-container';
import { useAppSelector } from 'soapbox/hooks';
import { makeGetAccount } from 'soapbox/selectors';

2
app/soapbox/features/ui/components/modals/favourites-modal.tsx
View File

@@ -3,7 +3,7 @@ import { FormattedMessage } from 'react-intl';
import { fetchFavourites } from 'soapbox/actions/interactions';
import { Modal, Spinner, Stack } from 'soapbox/components/ui';
import AccountContainer from 'soapbox/containers/account_container';
import AccountContainer from 'soapbox/containers/account-container';
import { useAppDispatch, useAppSelector } from 'soapbox/hooks';
interface IFavouritesModal {

0
app/soapbox/features/ui/components/hotkeys_modal.tsx → app/soapbox/features/ui/components/modals/hotkeys-modal.tsx
View File

9
app/soapbox/features/ui/components/media-modal.tsx → app/soapbox/features/ui/components/modals/media-modal.tsx
View File

@@ -4,13 +4,13 @@ import { defineMessages, useIntl, FormattedMessage } from 'react-intl';
import { useHistory } from 'react-router-dom';
import ReactSwipeableViews from 'react-swipeable-views';
import ExtendedVideoPlayer from 'soapbox/components/extended_video_player';
import ExtendedVideoPlayer from 'soapbox/components/extended-video-player';
import Icon from 'soapbox/components/icon';
import IconButton from 'soapbox/components/icon_button';
import IconButton from 'soapbox/components/icon-button';
import Audio from 'soapbox/features/audio';
import Video from 'soapbox/features/video';
import ImageLoader from './image-loader';
import ImageLoader from '../image-loader';
import type { List as ImmutableList } from 'immutable';
import type { Account, Attachment, Status } from 'soapbox/types/entities';
@@ -225,7 +225,6 @@ const MediaModal: React.FC<IMediaModal> = (props) => {
muted
controls={false}
width={width}
link={link}
height={height}
key={attachment.preview_url}
alt={attachment.description}
@@ -298,4 +297,4 @@ const MediaModal: React.FC<IMediaModal> = (props) => {
);
};
export default MediaModal;
export default MediaModal;

4
app/soapbox/features/ui/components/mentions_modal.tsx → app/soapbox/features/ui/components/modals/mentions-modal.tsx
View File

@@ -3,9 +3,9 @@ import React, { useCallback, useEffect } from 'react';
import { FormattedMessage } from 'react-intl';
import { fetchStatusWithContext } from 'soapbox/actions/statuses';
import ScrollableList from 'soapbox/components/scrollable_list';
import ScrollableList from 'soapbox/components/scrollable-list';
import { Modal, Spinner } from 'soapbox/components/ui';
import AccountContainer from 'soapbox/containers/account_container';
import AccountContainer from 'soapbox/containers/account-container';
import { useAppDispatch, useAppSelector } from 'soapbox/hooks';
import { makeGetStatus } from 'soapbox/selectors';

0
app/soapbox/features/ui/components/missing_description_modal.tsx → app/soapbox/features/ui/components/modals/missing-description-modal.tsx
View File

0
app/soapbox/features/ui/components/mute_modal.tsx → app/soapbox/features/ui/components/modals/mute-modal.tsx
View File

6
app/soapbox/features/ui/components/reactions_modal.tsx → app/soapbox/features/ui/components/modals/reactions-modal.tsx
View File

@@ -3,11 +3,11 @@ import React, { useEffect, useState } from 'react';
import { FormattedMessage, defineMessages, useIntl } from 'react-intl';
import { fetchFavourites, fetchReactions } from 'soapbox/actions/interactions';
import ScrollableList from 'soapbox/components/scrollable_list';
import ScrollableList from 'soapbox/components/scrollable-list';
import { Emoji, Modal, Spinner, Tabs } from 'soapbox/components/ui';
import AccountContainer from 'soapbox/containers/account_container';
import AccountContainer from 'soapbox/containers/account-container';
import { useAppDispatch, useAppSelector } from 'soapbox/hooks';
import { ReactionRecord } from 'soapbox/reducers/user_lists';
import { ReactionRecord } from 'soapbox/reducers/user-lists';
import type { Item } from 'soapbox/components/ui/tabs/tabs';

4
app/soapbox/features/ui/components/reblogs_modal.tsx → app/soapbox/features/ui/components/modals/reblogs-modal.tsx
View File

@@ -3,9 +3,9 @@ import { FormattedMessage } from 'react-intl';
import { fetchReblogs } from 'soapbox/actions/interactions';
import { fetchStatus } from 'soapbox/actions/statuses';
import ScrollableList from 'soapbox/components/scrollable_list';
import ScrollableList from 'soapbox/components/scrollable-list';
import { Modal, Spinner } from 'soapbox/components/ui';
import AccountContainer from 'soapbox/containers/account_container';
import AccountContainer from 'soapbox/containers/account-container';
import { useAppDispatch, useAppSelector } from 'soapbox/hooks';
interface IReblogsModal {

2
app/soapbox/features/ui/components/reply_mentions_modal.tsx → app/soapbox/features/ui/components/modals/reply-mentions-modal.tsx
View File

@@ -6,7 +6,7 @@ import { useAppSelector, useCompose } from 'soapbox/hooks';
import { statusToMentionsAccountIdsArray } from 'soapbox/reducers/compose';
import { makeGetStatus } from 'soapbox/selectors';
import Account from '../../reply_mentions/account';
import Account from '../../../reply-mentions/account';
import type { Account as AccountEntity, Status as StatusEntity } from 'soapbox/types/entities';

5
app/soapbox/features/ui/components/modals/report-modal/report-modal.tsx
View File

@@ -5,9 +5,9 @@ import { blockAccount } from 'soapbox/actions/accounts';
import { submitReport, submitReportSuccess, submitReportFail } from 'soapbox/actions/reports';
import { expandAccountTimeline } from 'soapbox/actions/timelines';
import AttachmentThumbs from 'soapbox/components/attachment-thumbs';
import StatusContent from 'soapbox/components/status_content';
import StatusContent from 'soapbox/components/status-content';
import { Modal, ProgressBar, Stack, Text } from 'soapbox/components/ui';
import AccountContainer from 'soapbox/containers/account_container';
import AccountContainer from 'soapbox/containers/account-container';
import { useAccount, useAppDispatch, useAppSelector } from 'soapbox/hooks';
import ConfirmationStep from './steps/confirmation-step';
@@ -179,6 +179,7 @@ const ReportModal = ({ onClose }: IReportModal) => {
<Modal
title={<FormattedMessage id='report.target' defaultMessage='Reporting {target}' values={{ target: <strong>@{account.acct}</strong> }} />}
onClose={onClose}
cancelText={<FormattedMessage id='common.cancel' defaultMessage='Cancel' />}
cancelAction={currentStep === Steps.THREE ? undefined : onClose}
confirmationAction={handleNextStep}
confirmationText={confirmationText}

2
app/soapbox/features/ui/components/modals/report-modal/steps/other-actions-step.tsx
View File

@@ -7,7 +7,7 @@ import Toggle from 'react-toggle';
import { changeReportBlock, changeReportForward } from 'soapbox/actions/reports';
import { fetchRules } from 'soapbox/actions/rules';
import { Button, FormGroup, HStack, Stack, Text } from 'soapbox/components/ui';
import StatusCheckBox from 'soapbox/features/report/components/status_check_box';
import StatusCheckBox from 'soapbox/features/report/components/status-check-box';
import { useAppSelector, useFeatures } from 'soapbox/hooks';
import { isRemote, getDomain } from 'soapbox/utils/accounts';

0
app/soapbox/features/ui/components/unauthorized_modal.tsx → app/soapbox/features/ui/components/modals/unauthorized-modal.tsx
View File

107
app/soapbox/features/ui/components/modals/verify-sms-modal.tsx
View File

@@ -1,5 +1,5 @@
import React, { useCallback, useEffect, useMemo, useState } from 'react';
import { useIntl } from 'react-intl';
import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
import OtpInput from 'react-otp-input';
import { verifyCredentials } from 'soapbox/actions/auth';
@@ -10,6 +10,37 @@ import { FormGroup, PhoneInput, Modal, Stack, Text } from 'soapbox/components/ui
import { useAppDispatch, useAppSelector } from 'soapbox/hooks';
import { getAccessToken } from 'soapbox/utils/auth';
const messages = defineMessages({
verificationInvalid: {
id: 'sms_verification.invalid',
defaultMessage: 'Please enter a valid phone number.',
},
verificationSuccess: {
id: 'sms_verification.success',
defaultMessage: 'A verification code has been sent to your phone number.',
},
verificationFail: {
id: 'sms_verification.fail',
defaultMessage: 'Failed to send SMS message to your phone number.',
},
verificationExpired: {
id: 'sms_verification.expired',
defaultMessage: 'Your SMS token has expired.',
},
verifySms: {
id: 'sms_verification.modal.verify_sms',
defaultMessage: 'Verify SMS',
},
verifyNumber: {
id: 'sms_verification.modal.verify_number',
defaultMessage: 'Verify phone number',
},
verifyCode: {
id: 'sms_verification.modal.verify_code',
defaultMessage: 'Verify code',
},
});
interface IVerifySmsModal {
onClose: (type: string) => void,
}
@@ -47,10 +78,7 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
setStatus(Statuses.IDLE);
dispatch(
snackbar.error(
intl.formatMessage({
id: 'sms_verification.invalid',
defaultMessage: 'Please enter a valid phone number.',
}),
intl.formatMessage(messages.verificationInvalid),
),
);
return;
@@ -59,10 +87,7 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
dispatch(reRequestPhoneVerification(phone!)).then(() => {
dispatch(
snackbar.success(
intl.formatMessage({
id: 'sms_verification.success',
defaultMessage: 'A verification code has been sent to your phone number.',
}),
intl.formatMessage(messages.verificationSuccess),
),
);
})
@@ -70,10 +95,7 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
.catch(() => {
dispatch(
snackbar.error(
intl.formatMessage({
id: 'sms_verification.fail',
defaultMessage: 'Failed to send SMS message to your phone number.',
}),
intl.formatMessage(messages.verificationFail),
),
);
});
@@ -102,20 +124,11 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
const confirmationText = useMemo(() => {
switch (status) {
case Statuses.IDLE:
return intl.formatMessage({
id: 'sms_verification.modal.verify_sms',
defaultMessage: 'Verify SMS',
});
return intl.formatMessage(messages.verifySms);
case Statuses.READY:
return intl.formatMessage({
id: 'sms_verification.modal.verify_number',
defaultMessage: 'Verify phone number',
});
return intl.formatMessage(messages.verifyNumber);
case Statuses.REQUESTED:
return intl.formatMessage({
id: 'sms_verification.modal.verify_code',
defaultMessage: 'Verify code',
});
return intl.formatMessage(messages.verifyCode);
default:
return null;
}
@@ -126,12 +139,13 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
case Statuses.IDLE:
return (
<Text theme='muted'>
{intl.formatMessage({
id: 'sms_verification.modal.verify_help_text',
defaultMessage: 'Verify your phone number to start using {instance}.',
}, {
instance: title,
})}
<FormattedMessage
id='sms_verification.modal.verify_help_text'
defaultMessage='Verify your phone number to start using {instance}.'
values={{
instance: title,
}}
/>
</Text>
);
case Statuses.READY:
@@ -149,10 +163,10 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
return (
<>
<Text theme='muted' size='sm' align='center'>
{intl.formatMessage({
id: 'sms_verification.modal.enter_code',
defaultMessage: 'We sent you a 6-digit code via SMS. Enter it below.',
})}
<FormattedMessage
id='sms_verification.modal.enter_code'
defaultMessage='We sent you a 6-digit code via SMS. Enter it below.'
/>
</Text>
<OtpInput
@@ -184,10 +198,7 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
})
.catch(() => dispatch(
snackbar.error(
intl.formatMessage({
id: 'sms_verification.invalid',
defaultMessage: 'Your SMS token has expired.',
}),
intl.formatMessage(messages.verificationExpired),
),
));
};
@@ -201,10 +212,10 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
return (
<Modal
title={
intl.formatMessage({
id: 'sms_verification.modal.verify_title',
defaultMessage: 'Verify your phone number',
})
<FormattedMessage
id='sms_verification.modal.verify_title'
defaultMessage='Verify your phone number'
/>
}
onClose={() => onClose('VERIFY_SMS')}
cancelAction={status === Statuses.IDLE ? () => onClose('VERIFY_SMS') : undefined}
@@ -212,10 +223,12 @@ const VerifySmsModal: React.FC<IVerifySmsModal> = ({ onClose }) => {
confirmationAction={onConfirmationClick}
confirmationText={confirmationText}
secondaryAction={status === Statuses.REQUESTED ? resendVerificationCode : undefined}
secondaryText={status === Statuses.REQUESTED ? intl.formatMessage({
id: 'sms_verification.modal.resend_code',
defaultMessage: 'Resend verification code?',
}) : undefined}
secondaryText={status === Statuses.REQUESTED ? (
<FormattedMessage
id='sms_verification.modal.resend_code'
defaultMessage='Resend verification code?'
/>
) : undefined}
secondaryDisabled={requestedAnother}
>
<Stack space={4}>

0
app/soapbox/features/ui/components/video_modal.tsx → app/soapbox/features/ui/components/modals/video-modal.tsx
View File

14
app/soapbox/features/ui/components/pending_status.tsx → app/soapbox/features/ui/components/pending-status.tsx
View File

@@ -1,18 +1,18 @@
import classNames from 'clsx';
import React from 'react';
import StatusContent from 'soapbox/components/status-content';
import StatusReplyMentions from 'soapbox/components/status-reply-mentions';
import StatusContent from 'soapbox/components/status_content';
import { Card, HStack } from 'soapbox/components/ui';
import AccountContainer from 'soapbox/containers/account_container';
import PlaceholderCard from 'soapbox/features/placeholder/components/placeholder_card';
import PlaceholderMediaGallery from 'soapbox/features/placeholder/components/placeholder_media_gallery';
import QuotedStatus from 'soapbox/features/status/containers/quoted_status_container';
import AccountContainer from 'soapbox/containers/account-container';
import PlaceholderCard from 'soapbox/features/placeholder/components/placeholder-card';
import PlaceholderMediaGallery from 'soapbox/features/placeholder/components/placeholder-media-gallery';
import QuotedStatus from 'soapbox/features/status/containers/quoted-status-container';
import { useAppSelector } from 'soapbox/hooks';
import { buildStatus } from '../util/pending_status_builder';
import { buildStatus } from '../util/pending-status-builder';
import PollPreview from './poll_preview';
import PollPreview from './poll-preview';
import type { Account as AccountEntity, Status as StatusEntity } from 'soapbox/types/entities';

4
app/soapbox/features/ui/components/pinned_accounts_panel.tsx → app/soapbox/features/ui/components/pinned-accounts-panel.tsx
View File

@@ -4,8 +4,8 @@ import { FormattedMessage } from 'react-intl';
import { fetchPinnedAccounts } from 'soapbox/actions/accounts';
import { Widget } from 'soapbox/components/ui';
import AccountContainer from 'soapbox/containers/account_container';
import BundleContainer from 'soapbox/features/ui/containers/bundle_container';
import AccountContainer from 'soapbox/containers/account-container';
import BundleContainer from 'soapbox/features/ui/containers/bundle-container';
import { WhoToFollowPanel } from 'soapbox/features/ui/util/async-components';
import { useAppDispatch, useAppSelector } from 'soapbox/hooks';

0
app/soapbox/features/ui/components/poll_preview.tsx → app/soapbox/features/ui/components/poll-preview.tsx
View File

6
app/soapbox/features/ui/components/profile_familiar_followers.tsx → app/soapbox/features/ui/components/profile-familiar-followers.tsx
View File

@@ -4,11 +4,11 @@ import { FormattedList, FormattedMessage } from 'react-intl';
import { useDispatch } from 'react-redux';
import { Link } from 'react-router-dom';
import { fetchAccountFamiliarFollowers } from 'soapbox/actions/familiar_followers';
import { fetchAccountFamiliarFollowers } from 'soapbox/actions/familiar-followers';
import { openModal } from 'soapbox/actions/modals';
import HoverRefWrapper from 'soapbox/components/hover_ref_wrapper';
import HoverRefWrapper from 'soapbox/components/hover-ref-wrapper';
import { Text } from 'soapbox/components/ui';
import VerificationBadge from 'soapbox/components/verification_badge';
import VerificationBadge from 'soapbox/components/verification-badge';
import { useAppSelector, useFeatures } from 'soapbox/hooks';
import { makeGetAccount } from 'soapbox/selectors';

2
app/soapbox/features/ui/components/profile_fields_panel.tsx → app/soapbox/features/ui/components/profile-fields-panel.tsx
View File

@@ -3,7 +3,7 @@ import React from 'react';
import { defineMessages, useIntl, FormattedMessage, FormatDateOptions } from 'react-intl';
import { Widget, Stack, HStack, Icon, Text } from 'soapbox/components/ui';
import BundleContainer from 'soapbox/features/ui/containers/bundle_container';
import BundleContainer from 'soapbox/features/ui/containers/bundle-container';
import { CryptoAddress } from 'soapbox/features/ui/util/async-components';
import type { Account, Field } from 'soapbox/types/entities';

6
app/soapbox/features/ui/components/profile_info_panel.tsx → app/soapbox/features/ui/components/profile-info-panel.tsx
View File

@@ -5,14 +5,14 @@ import { defineMessages, useIntl, FormattedMessage } from 'react-intl';
import Badge from 'soapbox/components/badge';
import { Icon, HStack, Stack, Text } from 'soapbox/components/ui';
import VerificationBadge from 'soapbox/components/verification_badge';
import VerificationBadge from 'soapbox/components/verification-badge';
import { useSoapboxConfig } from 'soapbox/hooks';
import { isLocal } from 'soapbox/utils/accounts';
import { badgeToTag, getBadges as getAccountBadges } from 'soapbox/utils/badges';
import { capitalize } from 'soapbox/utils/strings';
import ProfileFamiliarFollowers from './profile_familiar_followers';
import ProfileStats from './profile_stats';
import ProfileFamiliarFollowers from './profile-familiar-followers';
import ProfileStats from './profile-stats';
import type { Account } from 'soapbox/types/entities';

12
app/soapbox/features/ui/components/profile_media_panel.tsx → app/soapbox/features/ui/components/profile-media-panel.tsx
View File

@@ -5,11 +5,11 @@ import { useDispatch } from 'react-redux';
import { openModal } from 'soapbox/actions/modals';
import { expandAccountMediaTimeline } from 'soapbox/actions/timelines';
import { Spinner, Widget } from 'soapbox/components/ui';
import { Spinner, Text, Widget } from 'soapbox/components/ui';
import { useAppSelector } from 'soapbox/hooks';
import { getAccountGallery } from 'soapbox/selectors';
import MediaItem from '../../account_gallery/components/media_item';
import MediaItem from '../../account-gallery/components/media-item';
import type { Account, Attachment } from 'soapbox/types/entities';
@@ -52,7 +52,7 @@ const ProfileMediaPanel: React.FC<IProfileMediaPanel> = ({ account }) => {
if (!nineAttachments.isEmpty()) {
return (
<div className='media-panel__list'>
<div className='flex flex-wrap'>
{nineAttachments.map((attachment, _index) => (
<MediaItem
key={`${attachment.getIn(['status', 'id'])}+${attachment.id}`}
@@ -65,9 +65,9 @@ const ProfileMediaPanel: React.FC<IProfileMediaPanel> = ({ account }) => {
);
} else {
return (
<div className='media-panel__empty'>
<Text size='sm' theme='muted'>
<FormattedMessage id='media_panel.empty_message' defaultMessage='No media found.' />
</div>
</Text>
);
}
};
@@ -75,7 +75,7 @@ const ProfileMediaPanel: React.FC<IProfileMediaPanel> = ({ account }) => {
return (
<Widget title={<FormattedMessage id='media_panel.title' defaultMessage='Media' />}>
{account && (
<div className='media-panel__content'>
<div className='w-full py-2'>
{loading ? (
<Spinner />
) : (

0
app/soapbox/features/ui/components/profile_stats.tsx → app/soapbox/features/ui/components/profile-stats.tsx
View File

0
app/soapbox/features/ui/components/promo_panel.tsx → app/soapbox/features/ui/components/promo-panel.tsx
View File

2
app/soapbox/features/ui/components/timeline.tsx
View File

@@ -5,7 +5,7 @@ import { defineMessages } from 'react-intl';
import { dequeueTimeline, scrollTopTimeline } from 'soapbox/actions/timelines';
import ScrollTopButton from 'soapbox/components/scroll-top-button';
import StatusList, { IStatusList } from 'soapbox/components/status_list';
import StatusList, { IStatusList } from 'soapbox/components/status-list';
import { useAppSelector, useAppDispatch } from 'soapbox/hooks';
import { makeGetStatusIds } from 'soapbox/selectors';

2
app/soapbox/features/ui/components/upload_area.tsx → app/soapbox/features/ui/components/upload-area.tsx
View File

@@ -5,7 +5,7 @@ import { spring } from 'react-motion';
import { Icon, Stack, Text } from 'soapbox/components/ui';
import Motion from '../../ui/util/optional_motion';
import Motion from '../util/optional-motion';
interface IUploadArea {
/** Whether the upload area is active. */

4
app/soapbox/features/ui/components/user_panel.tsx → app/soapbox/features/ui/components/user-panel.tsx
View File

@@ -3,9 +3,9 @@ import { FormattedMessage, useIntl } from 'react-intl';
import { Link } from 'react-router-dom';
import Avatar from 'soapbox/components/avatar';
import StillImage from 'soapbox/components/still_image';
import StillImage from 'soapbox/components/still-image';
import { HStack, Stack, Text } from 'soapbox/components/ui';
import VerificationBadge from 'soapbox/components/verification_badge';
import VerificationBadge from 'soapbox/components/verification-badge';
import { useAppSelector } from 'soapbox/hooks';
import { makeGetAccount } from 'soapbox/selectors';
import { getAcct } from 'soapbox/utils/accounts';

2
app/soapbox/features/ui/components/who-to-follow-panel.tsx
View File

@@ -3,7 +3,7 @@ import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
import { Link } from 'react-router-dom';
import { Text, Widget } from 'soapbox/components/ui';
import AccountContainer from 'soapbox/containers/account_container';
import AccountContainer from 'soapbox/containers/account-container';
import PlaceholderSidebarSuggestions from 'soapbox/features/placeholder/components/placeholder-sidebar-suggestions';
import { useDismissSuggestion, useSuggestions } from 'soapbox/queries/suggestions';

3
app/soapbox/features/ui/containers/bundle_container.tsx → app/soapbox/features/ui/containers/bundle-container.tsx
View File

@@ -1,6 +1,7 @@
import { connect } from 'react-redux';
import { fetchBundleRequest, fetchBundleSuccess, fetchBundleFail } from '../../../actions/bundles';
import { fetchBundleRequest, fetchBundleSuccess, fetchBundleFail } from 'soapbox/actions/bundles';
import Bundle from '../components/bundle';
import type { AppDispatch } from 'soapbox/store';

14
app/soapbox/features/ui/containers/modal_container.js → app/soapbox/features/ui/containers/modal-container.ts
View File

@@ -4,22 +4,24 @@ import { cancelReplyCompose } from 'soapbox/actions/compose';
import { closeModal } from 'soapbox/actions/modals';
import { cancelReport } from 'soapbox/actions/reports';
import ModalRoot from '../components/modal_root';
import ModalRoot, { ModalType } from '../components/modal-root';
const mapStateToProps = state => {
const modal = state.get('modals').last({
import type { AppDispatch, RootState } from 'soapbox/store';
const mapStateToProps = (state: RootState) => {
const modal = state.modals.last({
modalType: null,
modalProps: {},
});
return {
type: modal.modalType,
type: modal.modalType as ModalType,
props: modal.modalProps,
};
};
const mapDispatchToProps = (dispatch) => ({
onClose(type) {
const mapDispatchToProps = (dispatch: AppDispatch) => ({
onClose(type?: ModalType) {
switch (type) {
case 'COMPOSE':
dispatch(cancelReplyCompose());

0
app/soapbox/features/ui/containers/notifications_container.tsx → app/soapbox/features/ui/containers/notifications-container.tsx
View File

26
app/soapbox/features/ui/index.tsx
View File

@@ -11,36 +11,36 @@ import { fetchReports, fetchUsers, fetchConfig } from 'soapbox/actions/admin';
import { fetchAnnouncements } from 'soapbox/actions/announcements';
import { fetchChats } from 'soapbox/actions/chats';
import { uploadCompose, resetCompose } from 'soapbox/actions/compose';
import { fetchCustomEmojis } from 'soapbox/actions/custom_emojis';
import { fetchCustomEmojis } from 'soapbox/actions/custom-emojis';
import { fetchFilters } from 'soapbox/actions/filters';
import { fetchMarker } from 'soapbox/actions/markers';
import { openModal } from 'soapbox/actions/modals';
import { expandNotifications } from 'soapbox/actions/notifications';
import { register as registerPushNotifications } from 'soapbox/actions/push_notifications';
import { fetchScheduledStatuses } from 'soapbox/actions/scheduled_statuses';
import { register as registerPushNotifications } from 'soapbox/actions/push-notifications';
import { fetchScheduledStatuses } from 'soapbox/actions/scheduled-statuses';
import { connectUserStream } from 'soapbox/actions/streaming';
import { fetchSuggestionsForTimeline } from 'soapbox/actions/suggestions';
import { expandHomeTimeline } from 'soapbox/actions/timelines';
import Icon from 'soapbox/components/icon';
import SidebarNavigation from 'soapbox/components/sidebar-navigation';
import ThumbNavigation from 'soapbox/components/thumb_navigation';
import ThumbNavigation from 'soapbox/components/thumb-navigation';
import { Layout } from 'soapbox/components/ui';
import { useAppDispatch, useAppSelector, useOwnAccount, useSoapboxConfig, useFeatures } from 'soapbox/hooks';
import AdminPage from 'soapbox/pages/admin_page';
import DefaultPage from 'soapbox/pages/default_page';
import AdminPage from 'soapbox/pages/admin-page';
import DefaultPage from 'soapbox/pages/default-page';
// import GroupsPage from 'soapbox/pages/groups_page';
// import GroupPage from 'soapbox/pages/group_page';
import HomePage from 'soapbox/pages/home_page';
import ProfilePage from 'soapbox/pages/profile_page';
import RemoteInstancePage from 'soapbox/pages/remote_instance_page';
import StatusPage from 'soapbox/pages/status_page';
import HomePage from 'soapbox/pages/home-page';
import ProfilePage from 'soapbox/pages/profile-page';
import RemoteInstancePage from 'soapbox/pages/remote-instance-page';
import StatusPage from 'soapbox/pages/status-page';
import { getAccessToken, getVapidKey } from 'soapbox/utils/auth';
import { isStandalone } from 'soapbox/utils/state';
// import GroupSidebarPanel from '../groups/sidebar_panel';
import BackgroundShapes from './components/background_shapes';
import BackgroundShapes from './components/background-shapes';
import Navbar from './components/navbar';
import BundleContainer from './containers/bundle_container';
import BundleContainer from './containers/bundle-container';
import {
Status,
CommunityTimeline,
@@ -114,7 +114,7 @@ import {
AuthTokenList,
ServiceWorkerInfo,
} from './util/async-components';
import { WrappedRoute } from './util/react_router_helpers';
import { WrappedRoute } from './util/react-router-helpers';
// Dummy import, to make sure that <Status /> ends up in the application bundle.
// Without this it ends up in ~8 very commonly used bundles.

168
app/soapbox/features/ui/util/async-components.ts
View File

@@ -1,5 +1,5 @@
export function EmojiPicker() {
return import(/* webpackChunkName: "emoji_picker" */'../../emoji/emoji_picker');
return import(/* webpackChunkName: "emoji_picker" */'../../emoji/emoji-picker');
}
export function Notifications() {
@@ -7,19 +7,19 @@ export function Notifications() {
}
export function HomeTimeline() {
return import(/* webpackChunkName: "features/home_timeline" */'../../home_timeline');
return import(/* webpackChunkName: "features/home_timeline" */'../../home-timeline');
}
export function PublicTimeline() {
return import(/* webpackChunkName: "features/public_timeline" */'../../public_timeline');
return import(/* webpackChunkName: "features/public_timeline" */'../../public-timeline');
}
export function RemoteTimeline() {
return import(/* webpackChunkName: "features/remote_timeline" */'../../remote_timeline');
return import(/* webpackChunkName: "features/remote_timeline" */'../../remote-timeline');
}
export function CommunityTimeline() {
return import(/* webpackChunkName: "features/community_timeline" */'../../community_timeline');
return import(/* webpackChunkName: "features/community_timeline" */'../../community-timeline');
}
export function HashtagTimeline() {
@@ -27,7 +27,7 @@ export function HashtagTimeline() {
}
export function DirectTimeline() {
return import(/* webpackChunkName: "features/direct_timeline" */'../../direct_timeline');
return import(/* webpackChunkName: "features/direct_timeline" */'../../direct-timeline');
}
export function Conversations() {
@@ -35,7 +35,7 @@ export function Conversations() {
}
export function ListTimeline() {
return import(/* webpackChunkName: "features/list_timeline" */'../../list_timeline');
return import(/* webpackChunkName: "features/list_timeline" */'../../list-timeline');
}
export function Lists() {
@@ -51,15 +51,15 @@ export function Status() {
}
export function PinnedStatuses() {
return import(/* webpackChunkName: "features/pinned_statuses" */'../../pinned_statuses');
return import(/* webpackChunkName: "features/pinned_statuses" */'../../pinned-statuses');
}
export function AccountTimeline() {
return import(/* webpackChunkName: "features/account_timeline" */'../../account_timeline');
return import(/* webpackChunkName: "features/account_timeline" */'../../account-timeline');
}
export function AccountGallery() {
return import(/* webpackChunkName: "features/account_gallery" */'../../account_gallery');
return import(/* webpackChunkName: "features/account_gallery" */'../../account-gallery');
}
export function Followers() {
@@ -71,15 +71,15 @@ export function Following() {
}
export function FollowRequests() {
return import(/* webpackChunkName: "features/follow_requests" */'../../follow_requests');
return import(/* webpackChunkName: "features/follow_requests" */'../../follow-requests');
}
export function GenericNotFound() {
return import(/* webpackChunkName: "features/generic_not_found" */'../../generic_not_found');
return import(/* webpackChunkName: "features/generic_not_found" */'../../generic-not-found');
}
export function FavouritedStatuses() {
return import(/* webpackChunkName: "features/favourited_statuses" */'../../favourited_statuses');
return import(/* webpackChunkName: "features/favourited_statuses" */'../../favourited-statuses');
}
export function Blocks() {
@@ -87,7 +87,7 @@ export function Blocks() {
}
export function DomainBlocks() {
return import(/* webpackChunkName: "features/domain_blocks" */'../../domain_blocks');
return import(/* webpackChunkName: "features/domain_blocks" */'../../domain-blocks');
}
export function Mutes() {
@@ -95,7 +95,7 @@ export function Mutes() {
}
export function MuteModal() {
return import(/* webpackChunkName: "modals/mute_modal" */'../components/mute_modal');
return import(/* webpackChunkName: "modals/mute_modal" */'../components/modals/mute-modal');
}
export function Filters() {
@@ -111,7 +111,7 @@ export function AccountModerationModal() {
}
export function MediaGallery() {
return import(/* webpackChunkName: "status/media_gallery" */'../../../components/media_gallery');
return import(/* webpackChunkName: "status/media_gallery" */'../../../components/media-gallery');
}
export function Video() {
@@ -123,59 +123,59 @@ export function Audio() {
}
export function MediaModal() {
return import(/* webpackChunkName: "features/ui" */'../components/media-modal');
return import(/* webpackChunkName: "features/ui" */'../components/modals/media-modal');
}
export function VideoModal() {
return import(/* webpackChunkName: "features/ui" */'../components/video_modal');
return import(/* webpackChunkName: "features/ui" */'../components/modals/video-modal');
}
export function BoostModal() {
return import(/* webpackChunkName: "features/ui" */'../components/boost_modal');
return import(/* webpackChunkName: "features/ui" */'../components/modals/boost-modal');
}
export function ConfirmationModal() {
return import(/* webpackChunkName: "features/ui" */'../components/confirmation_modal');
return import(/* webpackChunkName: "features/ui" */'../components/modals/confirmation-modal');
}
export function MissingDescriptionModal() {
return import(/* webpackChunkName: "features/ui" */'../components/missing_description_modal');
return import(/* webpackChunkName: "features/ui" */'../components/modals/missing-description-modal');
}
export function ActionsModal() {
return import(/* webpackChunkName: "features/ui" */'../components/actions_modal');
return import(/* webpackChunkName: "features/ui" */'../components/modals/actions-modal');
}
export function HotkeysModal() {
return import(/* webpackChunkName: "features/ui" */'../components/hotkeys_modal');
return import(/* webpackChunkName: "features/ui" */'../components/modals/hotkeys-modal');
}
export function ComposeModal() {
return import(/* webpackChunkName: "features/ui" */'../components/compose_modal');
return import(/* webpackChunkName: "features/ui" */'../components/modals/compose-modal');
}
export function ReplyMentionsModal() {
return import(/* webpackChunkName: "features/ui" */'../components/reply_mentions_modal');
return import(/* webpackChunkName: "features/ui" */'../components/modals/reply-mentions-modal');
}
export function UnauthorizedModal() {
return import(/* webpackChunkName: "features/ui" */'../components/unauthorized_modal');
return import(/* webpackChunkName: "features/ui" */'../components/modals/unauthorized-modal');
}
export function EditFederationModal() {
return import(/* webpackChunkName: "features/ui" */'../components/edit_federation_modal');
return import(/* webpackChunkName: "features/ui" */'../components/modals/edit-federation-modal');
}
export function EmbedModal() {
return import(/* webpackChunkName: "modals/embed_modal" */'../components/embed-modal');
return import(/* webpackChunkName: "modals/embed_modal" */'../components/modals/embed-modal');
}
export function ComponentModal() {
return import(/* webpackChunkName: "features/ui" */'../components/component_modal');
return import(/* webpackChunkName: "features/ui" */'../components/modals/component-modal');
}
export function ReblogsModal() {
return import(/* webpackChunkName: "features/ui" */'../components/reblogs_modal');
return import(/* webpackChunkName: "features/ui" */'../components/modals/reblogs-modal');
}
export function FavouritesModal() {
@@ -183,11 +183,11 @@ export function FavouritesModal() {
}
export function ReactionsModal() {
return import(/* webpackChunkName: "features/ui" */'../components/reactions_modal');
return import(/* webpackChunkName: "features/ui" */'../components/modals/reactions-modal');
}
export function MentionsModal() {
return import(/* webpackChunkName: "features/ui" */'../components/mentions_modal');
return import(/* webpackChunkName: "features/ui" */'../components/modals/mentions-modal');
}
export function LandingPageModal() {
@@ -195,7 +195,7 @@ export function LandingPageModal() {
}
export function BirthdaysModal() {
return import(/* webpackChunkName: "features/ui" */'../components/birthdays_modal');
return import(/* webpackChunkName: "features/ui" */'../components/modals/birthdays-modal');
}
export function BirthdayPanel() {
@@ -203,15 +203,15 @@ export function BirthdayPanel() {
}
export function AccountNoteModal() {
return import(/* webpackChunkName: "features/ui" */'../components/account_note_modal');
return import(/* webpackChunkName: "features/ui" */'../components/modals/account-note-modal');
}
export function ListEditor() {
return import(/* webpackChunkName: "features/list_editor" */'../../list_editor');
return import(/* webpackChunkName: "features/list_editor" */'../../list-editor');
}
export function ListAdder() {
return import(/*webpackChunkName: "features/list_adder" */'../../list_adder');
return import(/*webpackChunkName: "features/list_adder" */'../../list-adder');
}
export function Search() {
@@ -219,15 +219,15 @@ export function Search() {
}
export function LoginPage() {
return import(/* webpackChunkName: "features/auth_login" */'../../auth_login/components/login_page');
return import(/* webpackChunkName: "features/auth_login" */'../../auth-login/components/login-page');
}
export function ExternalLogin() {
return import(/* webpackChunkName: "features/external_login" */'../../external_login');
return import(/* webpackChunkName: "features/external_login" */'../../external-login');
}
export function LogoutPage() {
return import(/* webpackChunkName: "features/auth_login" */'../../auth_login/components/logout');
return import(/* webpackChunkName: "features/auth_login" */'../../auth-login/components/logout');
}
export function Settings() {
@@ -235,39 +235,39 @@ export function Settings() {
}
export function MediaDisplay() {
return import(/* webpackChunkName: "features/settings" */'../../settings/media_display');
return import(/* webpackChunkName: "features/settings" */'../../settings/media-display');
}
export function EditProfile() {
return import(/* webpackChunkName: "features/edit_profile" */'../../edit_profile');
return import(/* webpackChunkName: "features/edit_profile" */'../../edit-profile');
}
export function EditEmail() {
return import(/* webpackChunkName: "features/edit_email" */'../../edit_email');
return import(/* webpackChunkName: "features/edit_email" */'../../edit-email');
}
export function EmailConfirmation() {
return import(/* webpackChunkName: "features/email_confirmation" */'../../email_confirmation');
return import(/* webpackChunkName: "features/email_confirmation" */'../../email-confirmation');
}
export function EditPassword() {
return import(/* webpackChunkName: "features/edit_password" */'../../edit_password');
return import(/* webpackChunkName: "features/edit_password" */'../../edit-password');
}
export function DeleteAccount() {
return import(/* webpackChunkName: "features/delete_account" */'../../delete_account');
return import(/* webpackChunkName: "features/delete_account" */'../../delete-account');
}
export function SoapboxConfig() {
return import(/* webpackChunkName: "features/soapbox_config" */'../../soapbox_config');
return import(/* webpackChunkName: "features/soapbox_config" */'../../soapbox-config');
}
export function ExportData() {
return import(/* webpackChunkName: "features/export_data" */ '../../export_data');
return import(/* webpackChunkName: "features/export_data" */ '../../export-data');
}
export function ImportData() {
return import(/* webpackChunkName: "features/import_data" */'../../import_data');
return import(/* webpackChunkName: "features/import_data" */'../../import-data');
}
export function Backups() {
@@ -275,15 +275,15 @@ export function Backups() {
}
export function PasswordReset() {
return import(/* webpackChunkName: "features/auth_login" */'../../auth_login/components/password_reset');
return import(/* webpackChunkName: "features/auth_login" */'../../auth-login/components/password-reset');
}
export function PasswordResetConfirm() {
return import(/* webpackChunkName: "features/auth_login/password_reset_confirm" */'../../auth_login/components/password_reset_confirm');
return import(/* webpackChunkName: "features/auth_login/password_reset_confirm" */'../../auth-login/components/password-reset-confirm');
}
export function MfaForm() {
return import(/* webpackChunkName: "features/security/mfa_form" */'../../security/mfa_form');
return import(/* webpackChunkName: "features/security/mfa_form" */'../../security/mfa-form');
}
export function ChatIndex() {
@@ -299,7 +299,7 @@ export function ChatPanes() {
}
export function ServerInfo() {
return import(/* webpackChunkName: "features/server_info" */'../../server_info');
return import(/* webpackChunkName: "features/server_info" */'../../server-info');
}
export function Dashboard() {
@@ -307,15 +307,15 @@ export function Dashboard() {
}
export function ModerationLog() {
return import(/* webpackChunkName: "features/admin/moderation_log" */'../../admin/moderation_log');
return import(/* webpackChunkName: "features/admin/moderation_log" */'../../admin/moderation-log');
}
export function UserPanel() {
return import(/* webpackChunkName: "features/ui" */'../components/user_panel');
return import(/* webpackChunkName: "features/ui" */'../components/user-panel');
}
export function PromoPanel() {
return import(/* webpackChunkName: "features/ui" */'../components/promo_panel');
return import(/* webpackChunkName: "features/ui" */'../components/promo-panel');
}
export function SignUpPanel() {
@@ -327,7 +327,7 @@ export function CtaBanner() {
}
export function FundingPanel() {
return import(/* webpackChunkName: "features/ui" */'../components/funding_panel');
return import(/* webpackChunkName: "features/ui" */'../components/funding-panel');
}
export function TrendsPanel() {
@@ -335,47 +335,47 @@ export function TrendsPanel() {
}
export function ProfileInfoPanel() {
return import(/* webpackChunkName: "features/account_timeline" */'../components/profile_info_panel');
return import(/* webpackChunkName: "features/account_timeline" */'../components/profile-info-panel');
}
export function ProfileMediaPanel() {
return import(/* webpackChunkName: "features/account_gallery" */'../components/profile_media_panel');
return import(/* webpackChunkName: "features/account_gallery" */'../components/profile-media-panel');
}
export function ProfileFieldsPanel() {
return import(/* webpackChunkName: "features/account_timeline" */'../components/profile_fields_panel');
return import(/* webpackChunkName: "features/account_timeline" */'../components/profile-fields-panel');
}
export function PinnedAccountsPanel() {
return import(/* webpackChunkName: "features/pinned_accounts" */'../components/pinned_accounts_panel');
return import(/* webpackChunkName: "features/pinned_accounts" */'../components/pinned-accounts-panel');
}
export function InstanceInfoPanel() {
return import(/* webpackChunkName: "features/remote_timeline" */'../components/instance_info_panel');
return import(/* webpackChunkName: "features/remote_timeline" */'../components/instance-info-panel');
}
export function InstanceModerationPanel() {
return import(/* webpackChunkName: "features/remote_timeline" */'../components/instance_moderation_panel');
return import(/* webpackChunkName: "features/remote_timeline" */'../components/instance-moderation-panel');
}
export function LatestAccountsPanel() {
return import(/* webpackChunkName: "features/admin" */'../../admin/components/latest_accounts_panel');
return import(/* webpackChunkName: "features/admin" */'../../admin/components/latest-accounts-panel');
}
export function SidebarMenu() {
return import(/* webpackChunkName: "features/ui" */'../../../components/sidebar_menu');
return import(/* webpackChunkName: "features/ui" */'../../../components/sidebar-menu');
}
export function UploadArea() {
return import(/* webpackChunkName: "features/compose" */'../components/upload_area');
return import(/* webpackChunkName: "features/compose" */'../components/upload-area');
}
export function NotificationsContainer() {
return import(/* webpackChunkName: "features/ui" */'../containers/notifications_container');
return import(/* webpackChunkName: "features/ui" */'../containers/notifications-container');
}
export function ModalContainer() {
return import(/* webpackChunkName: "features/ui" */'../containers/modal_container');
return import(/* webpackChunkName: "features/ui" */'../containers/modal-container');
}
export function ProfileHoverCard() {
@@ -387,31 +387,31 @@ export function StatusHoverCard() {
}
export function CryptoDonate() {
return import(/* webpackChunkName: "features/crypto_donate" */'../../crypto_donate');
return import(/* webpackChunkName: "features/crypto_donate" */'../../crypto-donate');
}
export function CryptoDonatePanel() {
return import(/* webpackChunkName: "features/crypto_donate" */'../../crypto_donate/components/crypto_donate_panel');
return import(/* webpackChunkName: "features/crypto_donate" */'../../crypto-donate/components/crypto-donate-panel');
}
export function CryptoAddress() {
return import(/* webpackChunkName: "features/crypto_donate" */'../../crypto_donate/components/crypto_address');
return import(/* webpackChunkName: "features/crypto_donate" */'../../crypto-donate/components/crypto-address');
}
export function CryptoDonateModal() {
return import(/* webpackChunkName: "features/crypto_donate" */'../components/crypto_donate_modal');
return import(/* webpackChunkName: "features/crypto_donate" */'../components/modals/crypto-donate-modal');
}
export function ScheduledStatuses() {
return import(/* webpackChunkName: "features/scheduled_statuses" */'../../scheduled_statuses');
return import(/* webpackChunkName: "features/scheduled_statuses" */'../../scheduled-statuses');
}
export function UserIndex() {
return import(/* webpackChunkName: "features/admin/user_index" */'../../admin/user_index');
return import(/* webpackChunkName: "features/admin/user_index" */'../../admin/user-index');
}
export function FederationRestrictions() {
return import(/* webpackChunkName: "features/federation_restrictions" */'../../federation_restrictions');
return import(/* webpackChunkName: "features/federation_restrictions" */'../../federation-restrictions');
}
export function Aliases() {
@@ -423,7 +423,7 @@ export function Migration() {
}
export function ScheduleForm() {
return import(/* webpackChunkName: "features/compose" */'../../compose/components/schedule_form');
return import(/* webpackChunkName: "features/compose" */'../../compose/components/schedule-form');
}
export function WhoToFollowPanel() {
@@ -439,7 +439,7 @@ export function Directory() {
}
export function RegisterInvite() {
return import(/* webpackChunkName: "features/register_invite" */'../../register_invite');
return import(/* webpackChunkName: "features/register_invite" */'../../register-invite');
}
export function Share() {
@@ -447,11 +447,11 @@ export function Share() {
}
export function NewStatus() {
return import(/* webpackChunkName: "features/new_status" */'../../new_status');
return import(/* webpackChunkName: "features/new_status" */'../../new-status');
}
export function IntentionalError() {
return import(/* webpackChunkName: "error" */'../../intentional_error');
return import(/* webpackChunkName: "error" */'../../intentional-error');
}
export function Developers() {
@@ -467,7 +467,7 @@ export function SettingsStore() {
}
export function TestTimeline() {
return import(/* webpackChunkName: "features/test_timeline" */'../../test_timeline');
return import(/* webpackChunkName: "features/test_timeline" */'../../test-timeline');
}
export function ServiceWorkerInfo() {
@@ -475,7 +475,7 @@ export function ServiceWorkerInfo() {
}
export function DatePicker() {
return import(/* webpackChunkName: "date_picker" */'../../birthdays/date_picker');
return import(/* webpackChunkName: "date_picker" */'../../birthdays/date-picker');
}
export function OnboardingWizard() {
@@ -483,15 +483,15 @@ export function OnboardingWizard() {
}
export function WaitlistPage() {
return import(/* webpackChunkName: "features/verification" */'../../verification/waitlist_page');
return import(/* webpackChunkName: "features/verification" */'../../verification/waitlist-page');
}
export function CompareHistoryModal() {
return import(/*webpackChunkName: "modals/compare_history_modal" */'../components/compare_history_modal');
return import(/*webpackChunkName: "modals/compare_history_modal" */'../components/modals/compare-history-modal');
}
export function AuthTokenList() {
return import(/* webpackChunkName: "features/auth_token_list" */'../../auth_token_list');
return import(/* webpackChunkName: "features/auth_token_list" */'../../auth-token-list');
}
export function VerifySmsModal() {
@@ -499,7 +499,7 @@ export function VerifySmsModal() {
}
export function FamiliarFollowersModal() {
return import(/*webpackChunkName: "modals/familiar_followers_modal" */'../components/familiar_followers_modal');
return import(/*webpackChunkName: "modals/familiar_followers_modal" */'../components/modals/familiar-followers-modal');
}
export function AnnouncementsPanel() {

2
app/soapbox/features/ui/util/optional_motion.tsx → app/soapbox/features/ui/util/optional-motion.tsx
View File

@@ -3,7 +3,7 @@ import { Motion, MotionProps } from 'react-motion';
import { useSettings } from 'soapbox/hooks';
import ReducedMotion from './reduced_motion';
import ReducedMotion from './reduced-motion';
const OptionalMotion = (props: MotionProps) => {
const reduceMotion = useSettings().get('reduceMotion');

2
app/soapbox/features/ui/util/pending_status_builder.ts → app/soapbox/features/ui/util/pending-status-builder.ts
View File

@@ -4,7 +4,7 @@ import { normalizeStatus } from 'soapbox/normalizers/status';
import { calculateStatus } from 'soapbox/reducers/statuses';
import { makeGetAccount } from 'soapbox/selectors';
import type { PendingStatus } from 'soapbox/reducers/pending_statuses';
import type { PendingStatus } from 'soapbox/reducers/pending-statuses';
import type { RootState } from 'soapbox/store';
const getAccount = makeGetAccount();

10
app/soapbox/features/ui/util/react_router_helpers.tsx → app/soapbox/features/ui/util/react-router-helpers.tsx
View File

@@ -4,11 +4,11 @@ import { Redirect, Route, useHistory, RouteProps, RouteComponentProps, match as
import { Layout } from 'soapbox/components/ui';
import { useOwnAccount, useSettings } from 'soapbox/hooks';
import BundleColumnError from '../components/bundle_column_error';
import ColumnForbidden from '../components/column_forbidden';
import ColumnLoading from '../components/column_loading';
import ColumnsArea from '../components/columns_area';
import BundleContainer from '../containers/bundle_container';
import BundleColumnError from '../components/bundle-column-error';
import ColumnForbidden from '../components/column-forbidden';
import ColumnLoading from '../components/column-loading';
import ColumnsArea from '../components/columns-area';
import BundleContainer from '../containers/bundle-container';
type PageProps = {
params?: MatchType['params'],

0
app/soapbox/features/ui/util/reduced_motion.tsx → app/soapbox/features/ui/util/reduced-motion.tsx
View File