From e03f551676f7de2ebf08911ebf97f2ecebf7db0f Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Sat, 10 Apr 2021 14:13:07 -0500 Subject: [PATCH] acctFull --> getAcct throughout the UI, make it stateful --- app/soapbox/actions/soapbox.js | 5 ++++- app/soapbox/components/display_name.js | 18 ++++++++++++++---- app/soapbox/features/chats/chat_room.js | 9 ++++++--- .../features/chats/components/chat_window.js | 9 ++++++--- .../edit_profile/components/profile_preview.js | 16 ++++++++++++---- .../ui/components/profile_info_panel.js | 9 ++++++--- .../features/ui/components/user_panel.js | 9 ++++++--- app/soapbox/pages/profile_page.js | 9 ++++++--- app/soapbox/utils/accounts.js | 10 +++++++--- app/soapbox/utils/state.js | 6 ++++++ 10 files changed, 73 insertions(+), 27 deletions(-) create mode 100644 app/soapbox/utils/state.js diff --git a/app/soapbox/actions/soapbox.js b/app/soapbox/actions/soapbox.js index 023c4fccf..5de94328b 100644 --- a/app/soapbox/actions/soapbox.js +++ b/app/soapbox/actions/soapbox.js @@ -24,6 +24,8 @@ const allowedEmojiRGI = ImmutableList([ '😩', ]); +const year = new Date().getFullYear(); + export const defaultConfig = ImmutableMap({ logo: '', banner: '', @@ -34,12 +36,13 @@ export const defaultConfig = ImmutableMap({ }), extensions: ImmutableMap(), defaultSettings: ImmutableMap(), - copyright: '♥2020. Copying is an act of love. Please copy and share.', + copyright: `♥${year}. Copying is an act of love. Please copy and share.`, navlinks: ImmutableMap({ homeFooter: ImmutableList(), }), allowedEmoji: allowedEmoji, verifiedCanEditName: false, + displayFqn: false, }); export function getSoapboxConfig(state) { diff --git a/app/soapbox/components/display_name.js b/app/soapbox/components/display_name.js index 7d848a902..bf88a2168 100644 --- a/app/soapbox/components/display_name.js +++ b/app/soapbox/components/display_name.js @@ -1,21 +1,31 @@ import React from 'react'; import PropTypes from 'prop-types'; +import { connect } from 'react-redux'; import ImmutablePropTypes from 'react-immutable-proptypes'; import VerificationBadge from './verification_badge'; -import { acctFull } from '../utils/accounts'; +import { getAcct } from '../utils/accounts'; import { List as ImmutableList } from 'immutable'; import HoverRefWrapper from 'soapbox/components/hover_ref_wrapper'; +import { displayFqn } from 'soapbox/utils/state'; -export default class DisplayName extends React.PureComponent { +const mapStateToProps = state => { + return { + displayFqn: displayFqn(state), + }; +}; + +export default @connect(mapStateToProps) +class DisplayName extends React.PureComponent { static propTypes = { account: ImmutablePropTypes.map.isRequired, + displayFqn: PropTypes.bool, others: ImmutablePropTypes.list, children: PropTypes.node, }; render() { - const { account, others, children } = this.props; + const { account, displayFqn, others, children } = this.props; let displayName, suffix; const verified = account.getIn(['pleroma', 'tags'], ImmutableList()).includes('verified'); @@ -38,7 +48,7 @@ export default class DisplayName extends React.PureComponent { {verified && } ); - suffix = @{acctFull(account)}; + suffix = @{getAcct(account, displayFqn)}; } return ( diff --git a/app/soapbox/features/chats/chat_room.js b/app/soapbox/features/chats/chat_room.js index a9f0ccd5d..ecd19a495 100644 --- a/app/soapbox/features/chats/chat_room.js +++ b/app/soapbox/features/chats/chat_room.js @@ -6,13 +6,14 @@ import { injectIntl } from 'react-intl'; import { Link } from 'react-router-dom'; import ImmutablePureComponent from 'react-immutable-pure-component'; import Avatar from 'soapbox/components/avatar'; -import { acctFull } from 'soapbox/utils/accounts'; +import { getAcct } from 'soapbox/utils/accounts'; import { fetchChat, markChatRead } from 'soapbox/actions/chats'; import ChatBox from './components/chat_box'; import Column from 'soapbox/components/column'; import ColumnBackButton from 'soapbox/components/column_back_button'; import { Map as ImmutableMap } from 'immutable'; import { makeGetChat } from 'soapbox/selectors'; +import { displayFqn } from 'soapbox/utils/state'; const mapStateToProps = (state, { params }) => { const getChat = makeGetChat(); @@ -21,6 +22,7 @@ const mapStateToProps = (state, { params }) => { return { me: state.get('me'), chat: getChat(state, chat), + displayFqn: displayFqn(state), }; }; @@ -32,6 +34,7 @@ class ChatRoom extends ImmutablePureComponent { dispatch: PropTypes.func.isRequired, intl: PropTypes.object.isRequired, chat: ImmutablePropTypes.map, + displayFqn: PropTypes.bool, me: PropTypes.node, } @@ -68,7 +71,7 @@ class ChatRoom extends ImmutablePureComponent { } render() { - const { chat } = this.props; + const { chat, displayFqn } = this.props; if (!chat) return null; const account = chat.get('account'); @@ -79,7 +82,7 @@ class ChatRoom extends ImmutablePureComponent {
- @{acctFull(account)} + @{getAcct(account, displayFqn)}
diff --git a/app/soapbox/features/chats/components/chat_window.js b/app/soapbox/features/chats/components/chat_window.js index bb1a6346b..d23c27cad 100644 --- a/app/soapbox/features/chats/components/chat_window.js +++ b/app/soapbox/features/chats/components/chat_window.js @@ -6,7 +6,7 @@ import { injectIntl } from 'react-intl'; import { Link } from 'react-router-dom'; import ImmutablePureComponent from 'react-immutable-pure-component'; import Avatar from 'soapbox/components/avatar'; -import { acctFull } from 'soapbox/utils/accounts'; +import { getAcct } from 'soapbox/utils/accounts'; import IconButton from 'soapbox/components/icon_button'; import { closeChat, @@ -14,11 +14,13 @@ import { } from 'soapbox/actions/chats'; import ChatBox from './chat_box'; import { shortNumberFormat } from 'soapbox/utils/numbers'; +import { displayFqn } from 'soapbox/utils/state'; import HoverRefWrapper from 'soapbox/components/hover_ref_wrapper'; const mapStateToProps = (state, { pane }) => ({ me: state.get('me'), chat: state.getIn(['chats', pane.get('chat_id')]), + displayFqn: displayFqn(state), }); export default @connect(mapStateToProps) @@ -32,6 +34,7 @@ class ChatWindow extends ImmutablePureComponent { idx: PropTypes.number, chat: ImmutablePropTypes.map, me: PropTypes.node, + displayFqn: PropTypes.bool, } state = { @@ -73,7 +76,7 @@ class ChatWindow extends ImmutablePureComponent { } render() { - const { pane, idx, chat } = this.props; + const { pane, idx, chat, displayFqn } = this.props; const account = pane.getIn(['chat', 'account']); if (!chat || !account) return null; @@ -99,7 +102,7 @@ class ChatWindow extends ImmutablePureComponent {
{unreadCount > 0 ? unreadIcon : avatar }
diff --git a/app/soapbox/features/edit_profile/components/profile_preview.js b/app/soapbox/features/edit_profile/components/profile_preview.js index 808f18a55..32ca15cb5 100644 --- a/app/soapbox/features/edit_profile/components/profile_preview.js +++ b/app/soapbox/features/edit_profile/components/profile_preview.js @@ -1,11 +1,18 @@ import React from 'react'; +import { connect } from 'react-redux'; +import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; -import { acctFull } from 'soapbox/utils/accounts'; +import { getAcct } from 'soapbox/utils/accounts'; import StillImage from 'soapbox/components/still_image'; import VerificationBadge from 'soapbox/components/verification_badge'; import { List as ImmutableList } from 'immutable'; +import { displayFqn } from 'soapbox/utils/state'; -const ProfilePreview = ({ account }) => ( +const mapStateToProps = state => ({ + displayFqn: displayFqn(state), +}); + +const ProfilePreview = ({ account, displayFqn }) => ( @@ -32,6 +39,7 @@ const ProfilePreview = ({ account }) => ( ProfilePreview.propTypes = { account: ImmutablePropTypes.map, + displayFqn: PropTypes.bool, }; -export default ProfilePreview; +export default connect(mapStateToProps)(ProfilePreview); diff --git a/app/soapbox/features/ui/components/profile_info_panel.js b/app/soapbox/features/ui/components/profile_info_panel.js index efc5cb63c..4af0d84c4 100644 --- a/app/soapbox/features/ui/components/profile_info_panel.js +++ b/app/soapbox/features/ui/components/profile_info_panel.js @@ -10,7 +10,8 @@ import Icon from 'soapbox/components/icon'; import VerificationBadge from 'soapbox/components/verification_badge'; import Badge from 'soapbox/components/badge'; import { List as ImmutableList } from 'immutable'; -import { acctFull, isAdmin, isModerator } from 'soapbox/utils/accounts'; +import { getAcct, isAdmin, isModerator } from 'soapbox/utils/accounts'; +import { displayFqn } from 'soapbox/utils/state'; import classNames from 'classnames'; const messages = defineMessages({ @@ -36,10 +37,11 @@ class ProfileInfoPanel extends ImmutablePureComponent { identity_proofs: ImmutablePropTypes.list, intl: PropTypes.object.isRequired, username: PropTypes.string, + displayFqn: PropTypes.bool, }; render() { - const { account, intl, identity_proofs, username } = this.props; + const { account, displayFqn, intl, identity_proofs, username } = this.props; if (!account) { return ( @@ -73,7 +75,7 @@ class ProfileInfoPanel extends ImmutablePureComponent { {verified && } {account.get('bot') && } - { @{acctFull(account)} {lockedIcon} } + { @{getAcct(account, displayFqn)} {lockedIcon} }
@@ -144,6 +146,7 @@ const mapStateToProps = (state, { account }) => { return { identity_proofs, domain: state.getIn(['meta', 'domain']), + displayFqn: displayFqn(state), }; }; diff --git a/app/soapbox/features/ui/components/user_panel.js b/app/soapbox/features/ui/components/user_panel.js index 82415cd9d..ad50966c7 100644 --- a/app/soapbox/features/ui/components/user_panel.js +++ b/app/soapbox/features/ui/components/user_panel.js @@ -8,7 +8,8 @@ import ImmutablePropTypes from 'react-immutable-proptypes'; import ImmutablePureComponent from 'react-immutable-pure-component'; import Avatar from 'soapbox/components/avatar'; import { shortNumberFormat } from 'soapbox/utils/numbers'; -import { acctFull } from 'soapbox/utils/accounts'; +import { getAcct } from 'soapbox/utils/accounts'; +import { displayFqn } from 'soapbox/utils/state'; import StillImage from 'soapbox/components/still_image'; import VerificationBadge from 'soapbox/components/verification_badge'; import { List as ImmutableList } from 'immutable'; @@ -17,12 +18,13 @@ class UserPanel extends ImmutablePureComponent { static propTypes = { account: ImmutablePropTypes.map, + displayFqn: PropTypes.bool, intl: PropTypes.object.isRequired, domain: PropTypes.string, } render() { - const { account, intl, domain } = this.props; + const { account, displayFqn, intl, domain } = this.props; if (!account) return null; const displayNameHtml = { __html: account.get('display_name_html') }; const acct = account.get('acct').indexOf('@') === -1 && domain ? `${account.get('acct')}@${domain}` : account.get('acct'); @@ -49,7 +51,7 @@ class UserPanel extends ImmutablePureComponent { {verified && } - @{acctFull(account)} + @{getAcct(account, displayFqn)}
@@ -93,6 +95,7 @@ const makeMapStateToProps = () => { const mapStateToProps = (state, { accountId }) => ({ account: getAccount(state, accountId), + displayFqn: displayFqn(state), }); return mapStateToProps; diff --git a/app/soapbox/pages/profile_page.js b/app/soapbox/pages/profile_page.js index 091df531f..f1617dbdb 100644 --- a/app/soapbox/pages/profile_page.js +++ b/app/soapbox/pages/profile_page.js @@ -10,7 +10,8 @@ import LinkFooter from '../features/ui/components/link_footer'; import SignUpPanel from '../features/ui/components/sign_up_panel'; import ProfileInfoPanel from '../features/ui/components/profile_info_panel'; import ProfileMediaPanel from '../features/ui/components/profile_media_panel'; -import { acctFull } from 'soapbox/utils/accounts'; +import { getAcct } from 'soapbox/utils/accounts'; +import { displayFqn } from 'soapbox/utils/state'; import { getFeatures } from 'soapbox/utils/features'; import { makeGetAccount } from '../selectors'; import { Redirect } from 'react-router-dom'; @@ -47,6 +48,7 @@ const mapStateToProps = (state, { params: { username }, withReplies = false }) = accountUsername, features: getFeatures(state.get('instance')), realAccount, + displayFqn: displayFqn(state), }; }; @@ -56,11 +58,12 @@ class ProfilePage extends ImmutablePureComponent { static propTypes = { account: ImmutablePropTypes.map, accountUsername: PropTypes.string.isRequired, + displayFqn: PropTypes.bool, features: PropTypes.object, }; render() { - const { children, accountId, account, accountUsername, features, realAccount } = this.props; + const { children, accountId, account, displayFqn, accountUsername, features, realAccount } = this.props; const bg = account ? account.getIn(['customizations', 'background']) : undefined; if (realAccount) { @@ -70,7 +73,7 @@ class ProfilePage extends ImmutablePureComponent { return (
{account && - @{acctFull(account)} + @{getAcct(account, displayFqn)} }
diff --git a/app/soapbox/utils/accounts.js b/app/soapbox/utils/accounts.js index 7dc8b1cc5..ce52a5562 100644 --- a/app/soapbox/utils/accounts.js +++ b/app/soapbox/utils/accounts.js @@ -23,9 +23,13 @@ export const guessFqn = account => { }; // user@domain even for local users -export const acctFull = account => { - return account.get('fqn') || guessFqn(account); -}; +export const acctFull = account => ( + account.get('fqn') || guessFqn(account) +); + +export const getAcct = (account, displayFqn) => ( + displayFqn === true ? acctFull(account) : account.get('acct') +); export const isStaff = (account = ImmutableMap()) => ( [isAdmin, isModerator].some(f => f(account) === true) diff --git a/app/soapbox/utils/state.js b/app/soapbox/utils/state.js new file mode 100644 index 000000000..aacf07d18 --- /dev/null +++ b/app/soapbox/utils/state.js @@ -0,0 +1,6 @@ +import { getSoapboxConfig } from'soapbox/actions/soapbox'; + +export const displayFqn = state => { + const soapbox = getSoapboxConfig(state); + return soapbox.get('displayFqn'); +};