fix: More "Followers you know" polish & bug fixes (#34697)
This commit is contained in:
parent
ae281f31db
commit
3f965d83b0
4 changed files with 18 additions and 15 deletions
|
@ -912,6 +912,8 @@ export const AccountHeader: React.FC<{
|
||||||
<div className='account__header__badges'>{badges}</div>
|
<div className='account__header__badges'>{badges}</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
{signedIn && <FamiliarFollowers accountId={accountId} />}
|
||||||
|
|
||||||
{!(suspended || hidden) && (
|
{!(suspended || hidden) && (
|
||||||
<div className='account__header__extra'>
|
<div className='account__header__extra'>
|
||||||
<div
|
<div
|
||||||
|
@ -1023,7 +1025,6 @@ export const AccountHeader: React.FC<{
|
||||||
/>
|
/>
|
||||||
</NavLink>
|
</NavLink>
|
||||||
</div>
|
</div>
|
||||||
{signedIn && <FamiliarFollowers accountId={accountId} />}
|
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -12,12 +12,16 @@ import { getAccountFamiliarFollowers } from '@/mastodon/selectors/accounts';
|
||||||
import { useAppDispatch, useAppSelector } from '@/mastodon/store';
|
import { useAppDispatch, useAppSelector } from '@/mastodon/store';
|
||||||
|
|
||||||
const AccountLink: React.FC<{ account?: Account }> = ({ account }) => {
|
const AccountLink: React.FC<{ account?: Account }> = ({ account }) => {
|
||||||
// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
|
if (!account) {
|
||||||
const name = account?.display_name || `@${account?.acct}`;
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Link to={`/@${account?.acct}`} data-hover-card-account={account?.id}>
|
<Link
|
||||||
{name}
|
to={`/@${account.acct}`}
|
||||||
</Link>
|
data-hover-card-account={account.id}
|
||||||
|
dangerouslySetInnerHTML={{ __html: account.display_name_html }}
|
||||||
|
/>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -50,7 +54,7 @@ const FamiliarFollowersReadout: React.FC<{ familiarFollowers: Account[] }> = ({
|
||||||
return (
|
return (
|
||||||
<FormattedMessage
|
<FormattedMessage
|
||||||
id='account.familiar_followers_many'
|
id='account.familiar_followers_many'
|
||||||
defaultMessage='Followed by {name1}, {name2}, and {othersCount, plural, one {# other} other {# others}}'
|
defaultMessage='Followed by {name1}, {name2}, and {othersCount, plural, one {one other you know} other {# others you know}}'
|
||||||
values={messageData}
|
values={messageData}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
|
@ -80,7 +84,7 @@ export const FamiliarFollowers: React.FC<{ accountId: string }> = ({
|
||||||
return (
|
return (
|
||||||
<div className='account__header__familiar-followers'>
|
<div className='account__header__familiar-followers'>
|
||||||
<AvatarGroup compact>
|
<AvatarGroup compact>
|
||||||
{familiarFollowers.map((account) => (
|
{familiarFollowers.slice(0, 3).map((account) => (
|
||||||
<Avatar withLink key={account.id} account={account} size={28} />
|
<Avatar withLink key={account.id} account={account} size={28} />
|
||||||
))}
|
))}
|
||||||
</AvatarGroup>
|
</AvatarGroup>
|
||||||
|
|
|
@ -28,7 +28,7 @@
|
||||||
"account.edit_profile": "Edit profile",
|
"account.edit_profile": "Edit profile",
|
||||||
"account.enable_notifications": "Notify me when @{name} posts",
|
"account.enable_notifications": "Notify me when @{name} posts",
|
||||||
"account.endorse": "Feature on profile",
|
"account.endorse": "Feature on profile",
|
||||||
"account.familiar_followers_many": "Followed by {name1}, {name2}, and {othersCount, plural, one {# other} other {# others}}",
|
"account.familiar_followers_many": "Followed by {name1}, {name2}, and {othersCount, plural, one {one other you know} other {# others you know}}",
|
||||||
"account.familiar_followers_one": "Followed by {name1}",
|
"account.familiar_followers_one": "Followed by {name1}",
|
||||||
"account.familiar_followers_two": "Followed by {name1} and {name2}",
|
"account.familiar_followers_two": "Followed by {name1} and {name2}",
|
||||||
"account.featured": "Featured",
|
"account.featured": "Featured",
|
||||||
|
|
|
@ -2091,6 +2091,7 @@ body > [data-popper-placement] {
|
||||||
display: block;
|
display: block;
|
||||||
position: relative;
|
position: relative;
|
||||||
border-radius: var(--avatar-border-radius);
|
border-radius: var(--avatar-border-radius);
|
||||||
|
background: var(--surface-background-color);
|
||||||
|
|
||||||
img {
|
img {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
@ -8151,16 +8152,13 @@ noscript {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 10px;
|
gap: 10px;
|
||||||
margin-block-end: 16px;
|
margin-block: 16px;
|
||||||
color: $darker-text-color;
|
color: $darker-text-color;
|
||||||
|
|
||||||
a:any-link {
|
a:any-link {
|
||||||
color: inherit;
|
font-weight: 500;
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
|
|
||||||
a:hover {
|
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
color: $primary-text-color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue