Strip down StatusContainer, offload actions into Status component itself
This commit is contained in:
Alex Gleason
@ -96,6 +96,8 @@ const messages = defineMessages({
|
||||
uploadErrorLimit: { id: 'upload_error.limit', defaultMessage: 'File upload limit exceeded.' },
|
||||
uploadErrorPoll: { id: 'upload_error.poll', defaultMessage: 'File upload not allowed with polls.' },
|
||||
view: { id: 'snackbar.view', defaultMessage: 'View' },
|
||||
replyConfirm: { id: 'confirmations.reply.confirm', defaultMessage: 'Reply' },
|
||||
replyMessage: { id: 'confirmations.reply.message', defaultMessage: 'Replying now will overwrite the message you are currently composing. Are you sure you want to proceed?' },
|
||||
});
|
||||
|
||||
const COMPOSE_PANEL_BREAKPOINT = 600 + (285 * 1) + (10 * 1);
|
||||
@ -144,6 +146,20 @@ const replyCompose = (status: Status) =>
|
||||
dispatch(openModal('COMPOSE'));
|
||||
};
|
||||
|
||||
const replyComposeWithConfirmation = (status: Status, intl: IntlShape) =>
|
||||
(dispatch: AppDispatch, getState: () => RootState) => {
|
||||
const state = getState();
|
||||
if (state.compose.text.trim().length !== 0) {
|
||||
dispatch(openModal('CONFIRM', {
|
||||
message: intl.formatMessage(messages.replyMessage),
|
||||
confirm: intl.formatMessage(messages.replyConfirm),
|
||||
onConfirm: () => dispatch(replyCompose(status)),
|
||||
}));
|
||||
} else {
|
||||
dispatch(replyCompose(status));
|
||||
}
|
||||
};
|
||||
|
||||
const cancelReplyCompose = () => ({
|
||||
type: COMPOSE_REPLY_CANCEL,
|
||||
});
|
||||
@ -739,6 +755,7 @@ export {
|
||||
setComposeToStatus,
|
||||
changeCompose,
|
||||
replyCompose,
|
||||
replyComposeWithConfirmation,
|
||||
cancelReplyCompose,
|
||||
quoteCompose,
|
||||
cancelQuoteCompose,
|
||||
|
||||
@ -297,6 +297,14 @@ const revealStatus = (ids: string[] | string) => {
|
||||
};
|
||||
};
|
||||
|
||||
const toggleStatusHidden = (status: Status) => {
|
||||
if (status.hidden) {
|
||||
return revealStatus(status.id);
|
||||
} else {
|
||||
return hideStatus(status.id);
|
||||
}
|
||||
};
|
||||
|
||||
export {
|
||||
STATUS_CREATE_REQUEST,
|
||||
STATUS_CREATE_SUCCESS,
|
||||
@ -336,4 +344,5 @@ export {
|
||||
toggleMuteStatus,
|
||||
hideStatus,
|
||||
revealStatus,
|
||||
toggleStatusHidden,
|
||||
};
|
||||
|
||||
@ -4,9 +4,14 @@ import { HotKeys } from 'react-hotkeys';
|
||||
import { useIntl, FormattedMessage, defineMessages } from 'react-intl';
|
||||
import { NavLink, useHistory } from 'react-router-dom';
|
||||
|
||||
import { mentionCompose, replyComposeWithConfirmation } from 'soapbox/actions/compose';
|
||||
import { toggleFavourite, toggleReblog } from 'soapbox/actions/interactions';
|
||||
import { openModal } from 'soapbox/actions/modals';
|
||||
import { toggleStatusHidden } from 'soapbox/actions/statuses';
|
||||
import Icon from 'soapbox/components/icon';
|
||||
import AccountContainer from 'soapbox/containers/account_container';
|
||||
import QuotedStatus from 'soapbox/features/status/containers/quoted_status_container';
|
||||
import { useAppDispatch, useSettings } from 'soapbox/hooks';
|
||||
import { defaultMediaVisibility, textForScreenReader, getActualStatus } from 'soapbox/utils/status';
|
||||
|
||||
import StatusMedia from './status-media';
|
||||
@ -15,10 +20,9 @@ import StatusActionBar from './status_action_bar';
|
||||
import StatusContent from './status_content';
|
||||
import { HStack, Text } from './ui';
|
||||
|
||||
import type { Map as ImmutableMap, List as ImmutableList } from 'immutable';
|
||||
import type { Map as ImmutableMap } from 'immutable';
|
||||
import type {
|
||||
Account as AccountEntity,
|
||||
Attachment as AttachmentEntity,
|
||||
Status as StatusEntity,
|
||||
} from 'soapbox/types/entities';
|
||||
|
||||
@ -29,44 +33,18 @@ const messages = defineMessages({
|
||||
reblogged_by: { id: 'status.reblogged_by', defaultMessage: '{name} reposted' },
|
||||
});
|
||||
|
||||
interface IStatus {
|
||||
export interface IStatus {
|
||||
id?: string,
|
||||
contextType?: string,
|
||||
status: StatusEntity,
|
||||
account: AccountEntity,
|
||||
otherAccounts: ImmutableList<AccountEntity>,
|
||||
onClick: () => void,
|
||||
onReply: (status: StatusEntity) => void,
|
||||
onFavourite: (status: StatusEntity) => void,
|
||||
onReblog: (status: StatusEntity, e?: KeyboardEvent) => void,
|
||||
onQuote: (status: StatusEntity) => void,
|
||||
onDelete: (status: StatusEntity) => void,
|
||||
onEdit: (status: StatusEntity) => void,
|
||||
onDirect: (status: StatusEntity) => void,
|
||||
onChat: (status: StatusEntity) => void,
|
||||
onMention: (account: StatusEntity['account']) => void,
|
||||
onPin: (status: StatusEntity) => void,
|
||||
onOpenMedia: (media: ImmutableList<AttachmentEntity>, index: number) => void,
|
||||
onOpenVideo: (media: ImmutableMap<string, any> | AttachmentEntity, startTime: number) => void,
|
||||
onOpenAudio: (media: ImmutableMap<string, any>, startTime: number) => void,
|
||||
onBlock: (status: StatusEntity) => void,
|
||||
onEmbed: (status: StatusEntity) => void,
|
||||
onHeightChange: (status: StatusEntity) => void,
|
||||
onToggleHidden: (status: StatusEntity) => void,
|
||||
onShowHoverProfileCard: (status: StatusEntity) => void,
|
||||
muted: boolean,
|
||||
hidden: boolean,
|
||||
unread: boolean,
|
||||
onMoveUp: (statusId: string, featured?: boolean) => void,
|
||||
onMoveDown: (statusId: string, featured?: boolean) => void,
|
||||
getScrollPosition?: () => ScrollPosition | undefined,
|
||||
updateScrollBottom?: (bottom: number) => void,
|
||||
group: ImmutableMap<string, any>,
|
||||
displayMedia: string,
|
||||
allowedEmoji: ImmutableList<string>,
|
||||
focusable: boolean,
|
||||
onClick?: () => void,
|
||||
muted?: boolean,
|
||||
hidden?: boolean,
|
||||
unread?: boolean,
|
||||
onMoveUp?: (statusId: string, featured?: boolean) => void,
|
||||
onMoveDown?: (statusId: string, featured?: boolean) => void,
|
||||
group?: ImmutableMap<string, any>,
|
||||
focusable?: boolean,
|
||||
featured?: boolean,
|
||||
withDismiss?: boolean,
|
||||
hideActionBar?: boolean,
|
||||
hoverable?: boolean,
|
||||
}
|
||||
@ -76,15 +54,7 @@ const Status: React.FC<IStatus> = (props) => {
|
||||
status,
|
||||
focusable = true,
|
||||
hoverable = true,
|
||||
onToggleHidden,
|
||||
displayMedia,
|
||||
onOpenMedia,
|
||||
onOpenVideo,
|
||||
onClick,
|
||||
onReply,
|
||||
onFavourite,
|
||||
onReblog,
|
||||
onMention,
|
||||
onMoveUp,
|
||||
onMoveDown,
|
||||
muted,
|
||||
@ -94,10 +64,12 @@ const Status: React.FC<IStatus> = (props) => {
|
||||
group,
|
||||
hideActionBar,
|
||||
} = props;
|
||||
|
||||
const intl = useIntl();
|
||||
const history = useHistory();
|
||||
const dispatch = useAppDispatch();
|
||||
|
||||
const settings = useSettings();
|
||||
const displayMedia = settings.get('displayMedia') as string;
|
||||
const didShowCard = useRef(false);
|
||||
const node = useRef<HTMLDivElement>(null);
|
||||
|
||||
@ -127,7 +99,7 @@ const Status: React.FC<IStatus> = (props) => {
|
||||
};
|
||||
|
||||
const handleExpandedToggle = (): void => {
|
||||
onToggleHidden(actualStatus);
|
||||
dispatch(toggleStatusHidden(actualStatus));
|
||||
};
|
||||
|
||||
const handleHotkeyOpenMedia = (e?: KeyboardEvent): void => {
|
||||
@ -138,29 +110,35 @@ const Status: React.FC<IStatus> = (props) => {
|
||||
|
||||
if (firstAttachment) {
|
||||
if (firstAttachment.type === 'video') {
|
||||
onOpenVideo(firstAttachment, 0);
|
||||
dispatch(openModal('VIDEO', { media: firstAttachment, time: 0 }));
|
||||
} else {
|
||||
onOpenMedia(status.media_attachments, 0);
|
||||
dispatch(openModal('MEDIA', { media: status.media_attachments, index: 0 }));
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const handleHotkeyReply = (e?: KeyboardEvent): void => {
|
||||
e?.preventDefault();
|
||||
onReply(actualStatus);
|
||||
dispatch(replyComposeWithConfirmation(actualStatus, intl));
|
||||
};
|
||||
|
||||
const handleHotkeyFavourite = (): void => {
|
||||
onFavourite(actualStatus);
|
||||
toggleFavourite(actualStatus);
|
||||
};
|
||||
|
||||
const handleHotkeyBoost = (e?: KeyboardEvent): void => {
|
||||
onReblog(actualStatus, e);
|
||||
const modalReblog = () => dispatch(toggleReblog(actualStatus));
|
||||
const boostModal = settings.get('boostModal');
|
||||
if ((e && e.shiftKey) || !boostModal) {
|
||||
modalReblog();
|
||||
} else {
|
||||
dispatch(openModal('BOOST', { status: actualStatus, onReblog: modalReblog }));
|
||||
}
|
||||
};
|
||||
|
||||
const handleHotkeyMention = (e?: KeyboardEvent): void => {
|
||||
e?.preventDefault();
|
||||
onMention(actualStatus.account);
|
||||
dispatch(mentionCompose(actualStatus.account as AccountEntity));
|
||||
};
|
||||
|
||||
const handleHotkeyOpen = (): void => {
|
||||
@ -172,15 +150,19 @@ const Status: React.FC<IStatus> = (props) => {
|
||||
};
|
||||
|
||||
const handleHotkeyMoveUp = (e?: KeyboardEvent): void => {
|
||||
onMoveUp(status.id, featured);
|
||||
if (onMoveUp) {
|
||||
onMoveUp(status.id, featured);
|
||||
}
|
||||
};
|
||||
|
||||
const handleHotkeyMoveDown = (e?: KeyboardEvent): void => {
|
||||
onMoveDown(status.id, featured);
|
||||
if (onMoveDown) {
|
||||
onMoveDown(status.id, featured);
|
||||
}
|
||||
};
|
||||
|
||||
const handleHotkeyToggleHidden = (): void => {
|
||||
onToggleHidden(actualStatus);
|
||||
dispatch(toggleStatusHidden(actualStatus));
|
||||
};
|
||||
|
||||
const handleHotkeyToggleSensitive = (): void => {
|
||||
|
||||
@ -155,14 +155,11 @@ const StatusActionBar: React.FC<IStatusActionBar> = ({ status, withDismiss = fal
|
||||
dispatch(toggleBookmark(status));
|
||||
};
|
||||
|
||||
const modalReblog = () => {
|
||||
dispatch(toggleReblog(status));
|
||||
};
|
||||
|
||||
const handleReblogClick: React.EventHandler<React.MouseEvent> = e => {
|
||||
e.stopPropagation();
|
||||
|
||||
if (me) {
|
||||
const modalReblog = () => dispatch(toggleReblog(status));
|
||||
const boostModal = settings.get('boostModal');
|
||||
if ((e && e.shiftKey) || !boostModal) {
|
||||
modalReblog();
|
||||
|
||||
@ -1,270 +0,0 @@
|
||||
import React from 'react';
|
||||
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
|
||||
import { connect } from 'react-redux';
|
||||
|
||||
import { launchChat } from 'soapbox/actions/chats';
|
||||
import { deactivateUserModal, deleteUserModal, deleteStatusModal, toggleStatusSensitivityModal } from 'soapbox/actions/moderation';
|
||||
import { getSoapboxConfig } from 'soapbox/actions/soapbox';
|
||||
|
||||
import { blockAccount } from '../actions/accounts';
|
||||
import { showAlertForError } from '../actions/alerts';
|
||||
import {
|
||||
replyCompose,
|
||||
mentionCompose,
|
||||
directCompose,
|
||||
quoteCompose,
|
||||
} from '../actions/compose';
|
||||
import {
|
||||
createRemovedAccount,
|
||||
groupRemoveStatus,
|
||||
} from '../actions/groups';
|
||||
import {
|
||||
reblog,
|
||||
favourite,
|
||||
unreblog,
|
||||
unfavourite,
|
||||
bookmark,
|
||||
unbookmark,
|
||||
pin,
|
||||
unpin,
|
||||
} from '../actions/interactions';
|
||||
import { openModal } from '../actions/modals';
|
||||
import { initMuteModal } from '../actions/mutes';
|
||||
import { initReport } from '../actions/reports';
|
||||
import { getSettings } from '../actions/settings';
|
||||
import {
|
||||
muteStatus,
|
||||
unmuteStatus,
|
||||
deleteStatus,
|
||||
hideStatus,
|
||||
revealStatus,
|
||||
editStatus,
|
||||
} from '../actions/statuses';
|
||||
import Status from '../components/status';
|
||||
import { makeGetStatus } from '../selectors';
|
||||
|
||||
const messages = defineMessages({
|
||||
deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
|
||||
deleteHeading: { id: 'confirmations.delete.heading', defaultMessage: 'Delete post' },
|
||||
deleteMessage: { id: 'confirmations.delete.message', defaultMessage: 'Are you sure you want to delete this post?' },
|
||||
redraftConfirm: { id: 'confirmations.redraft.confirm', defaultMessage: 'Delete & redraft' },
|
||||
redraftMessage: { id: 'confirmations.redraft.message', defaultMessage: 'Are you sure you want to delete this post and re-draft it? Favorites and reposts will be lost, and replies to the original post will be orphaned.' },
|
||||
blockConfirm: { id: 'confirmations.block.confirm', defaultMessage: 'Block' },
|
||||
replyConfirm: { id: 'confirmations.reply.confirm', defaultMessage: 'Reply' },
|
||||
redraftHeading: { id: 'confirmations.redraft.heading', defaultMessage: 'Delete & redraft' },
|
||||
replyMessage: { id: 'confirmations.reply.message', defaultMessage: 'Replying now will overwrite the message you are currently composing. Are you sure you want to proceed?' },
|
||||
blockAndReport: { id: 'confirmations.block.block_and_report', defaultMessage: 'Block & Report' },
|
||||
});
|
||||
|
||||
const makeMapStateToProps = () => {
|
||||
const getStatus = makeGetStatus();
|
||||
|
||||
const mapStateToProps = (state, props) => {
|
||||
const soapbox = getSoapboxConfig(state);
|
||||
|
||||
return {
|
||||
status: getStatus(state, props),
|
||||
displayMedia: getSettings(state).get('displayMedia'),
|
||||
allowedEmoji: soapbox.get('allowedEmoji'),
|
||||
};
|
||||
};
|
||||
|
||||
return mapStateToProps;
|
||||
};
|
||||
|
||||
const mapDispatchToProps = (dispatch, { intl }) => {
|
||||
function onModalReblog(status) {
|
||||
if (status.get('reblogged')) {
|
||||
dispatch(unreblog(status));
|
||||
} else {
|
||||
dispatch(reblog(status));
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
onReply(status) {
|
||||
dispatch((_, getState) => {
|
||||
const state = getState();
|
||||
if (state.getIn(['compose', 'text']).trim().length !== 0) {
|
||||
dispatch(openModal('CONFIRM', {
|
||||
message: intl.formatMessage(messages.replyMessage),
|
||||
confirm: intl.formatMessage(messages.replyConfirm),
|
||||
onConfirm: () => dispatch(replyCompose(status)),
|
||||
}));
|
||||
} else {
|
||||
dispatch(replyCompose(status));
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
onModalReblog,
|
||||
|
||||
onReblog(status, e) {
|
||||
dispatch((_, getState) => {
|
||||
const boostModal = getSettings(getState()).get('boostModal');
|
||||
if ((e && e.shiftKey) || !boostModal) {
|
||||
onModalReblog(status);
|
||||
} else {
|
||||
dispatch(openModal('BOOST', { status, onReblog: onModalReblog }));
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
onQuote(status) {
|
||||
dispatch((_, getState) => {
|
||||
const state = getState();
|
||||
if (state.getIn(['compose', 'text']).trim().length !== 0) {
|
||||
dispatch(openModal('CONFIRM', {
|
||||
message: intl.formatMessage(messages.replyMessage),
|
||||
confirm: intl.formatMessage(messages.replyConfirm),
|
||||
onConfirm: () => dispatch(quoteCompose(status)),
|
||||
}));
|
||||
} else {
|
||||
dispatch(quoteCompose(status));
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
onFavourite(status) {
|
||||
if (status.get('favourited')) {
|
||||
dispatch(unfavourite(status));
|
||||
} else {
|
||||
dispatch(favourite(status));
|
||||
}
|
||||
},
|
||||
|
||||
onBookmark(status) {
|
||||
if (status.get('bookmarked')) {
|
||||
dispatch(unbookmark(status));
|
||||
} else {
|
||||
dispatch(bookmark(status));
|
||||
}
|
||||
},
|
||||
|
||||
onPin(status) {
|
||||
if (status.get('pinned')) {
|
||||
dispatch(unpin(status));
|
||||
} else {
|
||||
dispatch(pin(status));
|
||||
}
|
||||
},
|
||||
|
||||
onEmbed(status) {
|
||||
dispatch(openModal('EMBED', {
|
||||
url: status.get('url'),
|
||||
onError: error => dispatch(showAlertForError(error)),
|
||||
}));
|
||||
},
|
||||
|
||||
onDelete(status, withRedraft = false) {
|
||||
dispatch((_, getState) => {
|
||||
const deleteModal = getSettings(getState()).get('deleteModal');
|
||||
if (!deleteModal) {
|
||||
dispatch(deleteStatus(status.get('id'), withRedraft));
|
||||
} else {
|
||||
dispatch(openModal('CONFIRM', {
|
||||
icon: withRedraft ? require('@tabler/icons/edit.svg') : require('@tabler/icons/trash.svg'),
|
||||
heading: intl.formatMessage(withRedraft ? messages.redraftHeading : messages.deleteHeading),
|
||||
message: intl.formatMessage(withRedraft ? messages.redraftMessage : messages.deleteMessage),
|
||||
confirm: intl.formatMessage(withRedraft ? messages.redraftConfirm : messages.deleteConfirm),
|
||||
onConfirm: () => dispatch(deleteStatus(status.get('id'), withRedraft)),
|
||||
}));
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
onEdit(status) {
|
||||
dispatch(editStatus(status.get('id')));
|
||||
},
|
||||
|
||||
onDirect(account) {
|
||||
dispatch(directCompose(account));
|
||||
},
|
||||
|
||||
onChat(account, router) {
|
||||
dispatch(launchChat(account.get('id'), router));
|
||||
},
|
||||
|
||||
onMention(account) {
|
||||
dispatch(mentionCompose(account));
|
||||
},
|
||||
|
||||
onOpenMedia(media, index) {
|
||||
dispatch(openModal('MEDIA', { media, index }));
|
||||
},
|
||||
|
||||
onOpenVideo(media, time) {
|
||||
dispatch(openModal('VIDEO', { media, time }));
|
||||
},
|
||||
|
||||
onOpenAudio(media, time) {
|
||||
dispatch(openModal('AUDIO', { media, time }));
|
||||
},
|
||||
|
||||
onBlock(status) {
|
||||
const account = status.get('account');
|
||||
dispatch(openModal('CONFIRM', {
|
||||
icon: require('@tabler/icons/ban.svg'),
|
||||
heading: <FormattedMessage id='confirmations.block.heading' defaultMessage='Block @{name}' values={{ name: account.get('acct') }} />,
|
||||
message: <FormattedMessage id='confirmations.block.message' defaultMessage='Are you sure you want to block {name}?' values={{ name: <strong>@{account.get('acct')}</strong> }} />,
|
||||
confirm: intl.formatMessage(messages.blockConfirm),
|
||||
onConfirm: () => dispatch(blockAccount(account.get('id'))),
|
||||
secondary: intl.formatMessage(messages.blockAndReport),
|
||||
onSecondary: () => {
|
||||
dispatch(blockAccount(account.get('id')));
|
||||
dispatch(initReport(account, status));
|
||||
},
|
||||
}));
|
||||
},
|
||||
|
||||
onReport(status) {
|
||||
dispatch(initReport(status.get('account'), status));
|
||||
},
|
||||
|
||||
onMute(account) {
|
||||
dispatch(initMuteModal(account));
|
||||
},
|
||||
|
||||
onMuteConversation(status) {
|
||||
if (status.get('muted')) {
|
||||
dispatch(unmuteStatus(status.get('id')));
|
||||
} else {
|
||||
dispatch(muteStatus(status.get('id')));
|
||||
}
|
||||
},
|
||||
|
||||
onToggleHidden(status) {
|
||||
if (status.get('hidden')) {
|
||||
dispatch(revealStatus(status.get('id')));
|
||||
} else {
|
||||
dispatch(hideStatus(status.get('id')));
|
||||
}
|
||||
},
|
||||
|
||||
onGroupRemoveAccount(groupId, accountId) {
|
||||
dispatch(createRemovedAccount(groupId, accountId));
|
||||
},
|
||||
|
||||
onGroupRemoveStatus(groupId, statusId) {
|
||||
dispatch(groupRemoveStatus(groupId, statusId));
|
||||
},
|
||||
|
||||
onDeactivateUser(status) {
|
||||
dispatch(deactivateUserModal(intl, status.getIn(['account', 'id'])));
|
||||
},
|
||||
|
||||
onDeleteUser(status) {
|
||||
dispatch(deleteUserModal(intl, status.getIn(['account', 'id'])));
|
||||
},
|
||||
|
||||
onDeleteStatus(status) {
|
||||
dispatch(deleteStatusModal(intl, status.get('id')));
|
||||
},
|
||||
|
||||
onToggleStatusSensitivity(status) {
|
||||
dispatch(toggleStatusSensitivityModal(intl, status.get('id'), status.get('sensitive')));
|
||||
},
|
||||
};
|
||||
};
|
||||
|
||||
export default injectIntl(connect(makeMapStateToProps, mapDispatchToProps)(Status));
|
||||
37
app/soapbox/containers/status_container.tsx
Normal file
37
app/soapbox/containers/status_container.tsx
Normal file
@ -0,0 +1,37 @@
|
||||
import React from 'react';
|
||||
|
||||
import Status, { IStatus } from 'soapbox/components/status';
|
||||
import { useAppSelector } from 'soapbox/hooks';
|
||||
import { makeGetStatus } from 'soapbox/selectors';
|
||||
|
||||
interface IStatusContainer extends Omit<IStatus, 'id'> {
|
||||
id: string,
|
||||
/** @deprecated Unused. */
|
||||
contextType?: any,
|
||||
/** @deprecated Unused. */
|
||||
otherAccounts?: any,
|
||||
/** @deprecated Unused. */
|
||||
withDismiss?: any,
|
||||
/** @deprecated Unused. */
|
||||
getScrollPosition?: any,
|
||||
/** @deprecated Unused. */
|
||||
updateScrollBottom?: any,
|
||||
}
|
||||
|
||||
const getStatus = makeGetStatus();
|
||||
|
||||
/**
|
||||
* Legacy Status wrapper accepting a status ID instead of the full entity.
|
||||
* @deprecated Use the Status component directly.
|
||||
*/
|
||||
const StatusContainer: React.FC<IStatusContainer> = ({ id }) => {
|
||||
const status = useAppSelector(state => getStatus(state, { id }));
|
||||
|
||||
if (status) {
|
||||
return <Status status={status} />;
|
||||
} else {
|
||||
return null;
|
||||
}
|
||||
};
|
||||
|
||||
export default StatusContainer;
|
||||
Reference in New Issue
Block a user