ProfilePage: fix tabs (fixes #927), redirect wrong case username
This commit is contained in:
parent
47d1a8e5d6
commit
c00b5f7476
1 changed files with 17 additions and 13 deletions
|
@ -27,23 +27,22 @@ interface IProfilePage {
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** Page to display a user's profile. */
|
||||||
const ProfilePage: React.FC<IProfilePage> = ({ params, children }) => {
|
const ProfilePage: React.FC<IProfilePage> = ({ params, children }) => {
|
||||||
const history = useHistory();
|
const history = useHistory();
|
||||||
|
const username = params?.username || '';
|
||||||
|
|
||||||
const { accountId, account, accountUsername, realAccount } = useAppSelector(state => {
|
const { accountId, account, realAccount } = useAppSelector(state => {
|
||||||
const username = params?.username || '';
|
|
||||||
const { accounts } = state;
|
const { accounts } = state;
|
||||||
const accountFetchError = (((state.accounts.getIn([-1, 'username']) || '') as string).toLowerCase() === username.toLowerCase());
|
const accountFetchError = (((state.accounts.getIn([-1, 'username']) || '') as string).toLowerCase() === username.toLowerCase());
|
||||||
|
|
||||||
let accountId: string | -1 | null = -1;
|
let accountId: string | -1 | null = -1;
|
||||||
let account = null;
|
let account = null;
|
||||||
let accountUsername = username;
|
|
||||||
if (accountFetchError) {
|
if (accountFetchError) {
|
||||||
accountId = null;
|
accountId = null;
|
||||||
} else {
|
} else {
|
||||||
account = findAccountByUsername(state, username);
|
account = findAccountByUsername(state, username);
|
||||||
accountId = account ? account.id : -1;
|
accountId = account ? account.id : -1;
|
||||||
accountUsername = account ? account.acct : '';
|
|
||||||
}
|
}
|
||||||
|
|
||||||
let realAccount;
|
let realAccount;
|
||||||
|
@ -57,7 +56,6 @@ const ProfilePage: React.FC<IProfilePage> = ({ params, children }) => {
|
||||||
return {
|
return {
|
||||||
account: typeof accountId === 'string' ? getAccount(state, accountId) : account,
|
account: typeof accountId === 'string' ? getAccount(state, accountId) : account,
|
||||||
accountId,
|
accountId,
|
||||||
accountUsername,
|
|
||||||
realAccount,
|
realAccount,
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
@ -66,24 +64,30 @@ const ProfilePage: React.FC<IProfilePage> = ({ params, children }) => {
|
||||||
const features = useFeatures();
|
const features = useFeatures();
|
||||||
const { displayFqn } = useSoapboxConfig();
|
const { displayFqn } = useSoapboxConfig();
|
||||||
|
|
||||||
|
// Redirect from a user ID
|
||||||
if (realAccount) {
|
if (realAccount) {
|
||||||
return <Redirect to={`/@${realAccount.acct}`} />;
|
return <Redirect to={`/@${realAccount.acct}`} />;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Fix case of username
|
||||||
|
if (account && account.acct !== username) {
|
||||||
|
return <Redirect to={`/@${account.acct}`} />;
|
||||||
|
}
|
||||||
|
|
||||||
const tabItems = [
|
const tabItems = [
|
||||||
{
|
{
|
||||||
text: <FormattedMessage id='account.posts' defaultMessage='Posts' />,
|
text: <FormattedMessage id='account.posts' defaultMessage='Posts' />,
|
||||||
to: `/@${accountUsername}`,
|
to: `/@${username}`,
|
||||||
name: 'profile',
|
name: 'profile',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: <FormattedMessage id='account.posts_with_replies' defaultMessage='Posts and replies' />,
|
text: <FormattedMessage id='account.posts_with_replies' defaultMessage='Posts and replies' />,
|
||||||
to: `/@${accountUsername}/with_replies`,
|
to: `/@${username}/with_replies`,
|
||||||
name: 'replies',
|
name: 'replies',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: <FormattedMessage id='account.media' defaultMessage='Media' />,
|
text: <FormattedMessage id='account.media' defaultMessage='Media' />,
|
||||||
to: `/@${accountUsername}/media`,
|
to: `/@${username}/media`,
|
||||||
name: 'media',
|
name: 'media',
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
@ -100,14 +104,14 @@ const ProfilePage: React.FC<IProfilePage> = ({ params, children }) => {
|
||||||
}
|
}
|
||||||
|
|
||||||
let activeItem;
|
let activeItem;
|
||||||
const pathname = history.location.pathname.replace(`@${accountUsername}/`, '');
|
const pathname = history.location.pathname.replace(`@${username}/`, '');
|
||||||
if (pathname.includes('with_replies')) {
|
if (pathname.includes('with_replies')) {
|
||||||
activeItem = 'replies';
|
activeItem = 'replies';
|
||||||
} else if (pathname.includes('media')) {
|
} else if (pathname.includes('media')) {
|
||||||
activeItem = 'media';
|
activeItem = 'media';
|
||||||
} else if (pathname.includes('favorites')) {
|
} else if (pathname.includes('favorites')) {
|
||||||
activeItem = 'likes';
|
activeItem = 'likes';
|
||||||
} else if (pathname === `/@${accountUsername}`) {
|
} else {
|
||||||
activeItem = 'profile';
|
activeItem = 'profile';
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -117,13 +121,13 @@ const ProfilePage: React.FC<IProfilePage> = ({ params, children }) => {
|
||||||
<Column label={account ? `@${getAcct(account, displayFqn)}` : ''} withHeader={false}>
|
<Column label={account ? `@${getAcct(account, displayFqn)}` : ''} withHeader={false}>
|
||||||
<div className='space-y-4'>
|
<div className='space-y-4'>
|
||||||
{/* @ts-ignore */}
|
{/* @ts-ignore */}
|
||||||
<HeaderContainer accountId={accountId} username={accountUsername} />
|
<HeaderContainer accountId={accountId} username={username} />
|
||||||
|
|
||||||
<BundleContainer fetchComponent={ProfileInfoPanel}>
|
<BundleContainer fetchComponent={ProfileInfoPanel}>
|
||||||
{Component => <Component username={accountUsername} account={account} />}
|
{Component => <Component username={username} account={account} />}
|
||||||
</BundleContainer>
|
</BundleContainer>
|
||||||
|
|
||||||
{account && activeItem && (
|
{account && (
|
||||||
<Tabs items={tabItems} activeItem={activeItem} />
|
<Tabs items={tabItems} activeItem={activeItem} />
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue