From da70097960e83f017ebfe1cb2ed4b3683c121a1a Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Tue, 7 Jun 2022 14:48:24 -0500 Subject: [PATCH] Convert QuotedStatus containers to TSX --- app/soapbox/components/status.tsx | 2 +- .../containers/quoted_status_container.js | 26 --------------- .../containers/quoted_status_container.tsx | 32 +++++++++++++++++++ .../status/components/detailed-status.tsx | 2 +- .../containers/quoted_status_container.js | 17 ---------- .../containers/quoted_status_container.tsx | 29 +++++++++++++++++ .../features/ui/components/pending_status.tsx | 2 +- 7 files changed, 64 insertions(+), 46 deletions(-) delete mode 100644 app/soapbox/features/compose/containers/quoted_status_container.js create mode 100644 app/soapbox/features/compose/containers/quoted_status_container.tsx delete mode 100644 app/soapbox/features/status/containers/quoted_status_container.js create mode 100644 app/soapbox/features/status/containers/quoted_status_container.tsx diff --git a/app/soapbox/components/status.tsx b/app/soapbox/components/status.tsx index 774ffed7c..4389b1fc1 100644 --- a/app/soapbox/components/status.tsx +++ b/app/soapbox/components/status.tsx @@ -422,7 +422,7 @@ class Status extends ImmutablePureComponent { ); } else { - quote = ; + quote = ; } } diff --git a/app/soapbox/features/compose/containers/quoted_status_container.js b/app/soapbox/features/compose/containers/quoted_status_container.js deleted file mode 100644 index c15fa1764..000000000 --- a/app/soapbox/features/compose/containers/quoted_status_container.js +++ /dev/null @@ -1,26 +0,0 @@ -import { connect } from 'react-redux'; - -import { cancelQuoteCompose } from 'soapbox/actions/compose'; -import QuotedStatus from 'soapbox/features/status/components/quoted_status'; -import { makeGetStatus } from 'soapbox/selectors'; - -const makeMapStateToProps = () => { - const getStatus = makeGetStatus(); - - const mapStateToProps = state => ({ - status: getStatus(state, { id: state.getIn(['compose', 'quote']) }), - compose: true, - }); - - return mapStateToProps; -}; - -const mapDispatchToProps = dispatch => ({ - - onCancel() { - dispatch(cancelQuoteCompose()); - }, - -}); - -export default connect(makeMapStateToProps, mapDispatchToProps)(QuotedStatus); \ No newline at end of file diff --git a/app/soapbox/features/compose/containers/quoted_status_container.tsx b/app/soapbox/features/compose/containers/quoted_status_container.tsx new file mode 100644 index 000000000..e9a968573 --- /dev/null +++ b/app/soapbox/features/compose/containers/quoted_status_container.tsx @@ -0,0 +1,32 @@ +import React from 'react'; + +import { cancelQuoteCompose } from 'soapbox/actions/compose'; +import QuotedStatus from 'soapbox/features/status/components/quoted_status'; +import { useAppSelector, useAppDispatch } from 'soapbox/hooks'; +import { makeGetStatus } from 'soapbox/selectors'; + +const getStatus = makeGetStatus(); + +/** QuotedStatus shown in post composer. */ +const QuotedStatusContainer: React.FC = () => { + const dispatch = useAppDispatch(); + const status = useAppSelector(state => getStatus(state, { id: state.compose.get('quote') })); + + const onCancel = () => { + dispatch(cancelQuoteCompose()); + }; + + if (!status) { + return null; + } + + return ( + + ); +}; + +export default QuotedStatusContainer; diff --git a/app/soapbox/features/status/components/detailed-status.tsx b/app/soapbox/features/status/components/detailed-status.tsx index 1387fd2cf..4f9b584af 100644 --- a/app/soapbox/features/status/components/detailed-status.tsx +++ b/app/soapbox/features/status/components/detailed-status.tsx @@ -116,7 +116,7 @@ class DetailedStatus extends ImmutablePureComponent ); } else { - quote = ; + quote = ; } } diff --git a/app/soapbox/features/status/containers/quoted_status_container.js b/app/soapbox/features/status/containers/quoted_status_container.js deleted file mode 100644 index a375b2562..000000000 --- a/app/soapbox/features/status/containers/quoted_status_container.js +++ /dev/null @@ -1,17 +0,0 @@ -import { connect } from 'react-redux'; - -import { makeGetStatus } from 'soapbox/selectors'; - -import QuotedStatus from '../components/quoted_status'; - -const makeMapStateToProps = () => { - const getStatus = makeGetStatus(); - - const mapStateToProps = (state, { statusId }) => ({ - status: getStatus(state, { id: statusId }), - }); - - return mapStateToProps; -}; - -export default connect(makeMapStateToProps)(QuotedStatus); diff --git a/app/soapbox/features/status/containers/quoted_status_container.tsx b/app/soapbox/features/status/containers/quoted_status_container.tsx new file mode 100644 index 000000000..e7e4ad151 --- /dev/null +++ b/app/soapbox/features/status/containers/quoted_status_container.tsx @@ -0,0 +1,29 @@ +import React from 'react'; + +import { useAppSelector } from 'soapbox/hooks'; +import { makeGetStatus } from 'soapbox/selectors'; + +import QuotedStatus from '../components/quoted_status'; + +const getStatus = makeGetStatus(); + +interface IQuotedStatusContainer { + /** Status ID to the quoted status. */ + statusId: string, +} + +const QuotedStatusContainer: React.FC = ({ statusId }) => { + const status = useAppSelector(state => getStatus(state, { id: statusId })); + + if (!status) { + return null; + } + + return ( + + ); +}; + +export default QuotedStatusContainer; diff --git a/app/soapbox/features/ui/components/pending_status.tsx b/app/soapbox/features/ui/components/pending_status.tsx index f4b990fc6..03853008c 100644 --- a/app/soapbox/features/ui/components/pending_status.tsx +++ b/app/soapbox/features/ui/components/pending_status.tsx @@ -83,7 +83,7 @@ const PendingStatus: React.FC = ({ idempotencyKey, className, mu {status.poll && } - {status.quote && } + {status.quote && } {/* TODO */}