fix account authorize page

This commit is contained in:
Baptiste Lemoine 2020-07-24 17:42:22 +02:00
parent b64d02798d
commit 703be8a9fd
5 changed files with 107 additions and 102 deletions

View File

@ -4,10 +4,10 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
import Permalink from '../../../components/permalink'; import Permalink from '../../../components/permalink';
import Avatar from '../../../components/avatar'; import Avatar from '../../../components/avatar';
import DisplayName from '../../../components/display_name'; import DisplayName from '../../../components/display_name';
import { defineMessages, FormattedMessage, injectIntl } from 'react-intl'; import IconButton from '../../../components/icon_button';
import { shortNumberFormat } from 'mastodon/utils/numbers';
import ImmutablePureComponent from 'react-immutable-pure-component';
import { NavLink } from 'react-router-dom'; import { NavLink } from 'react-router-dom';
import { defineMessages, FormattedMessage, injectIntl } from 'react-intl';
import ImmutablePureComponent from 'react-immutable-pure-component';
const messages = defineMessages({ const messages = defineMessages({
authorize: { id: 'follow_request.authorize', defaultMessage: 'Authorize' }, authorize: { id: 'follow_request.authorize', defaultMessage: 'Authorize' },
@ -28,6 +28,8 @@ class AccountAuthorize extends ImmutablePureComponent {
const { intl, account, onAuthorize, onReject } = this.props; const { intl, account, onAuthorize, onReject } = this.props;
const content = { __html: account.get('note_emojified') }; const content = { __html: account.get('note_emojified') };
const fields = account.get('fields');
return ( return (
<div className='account-authorize__wrapper'> <div className='account-authorize__wrapper'>
<div className='account-authorize'> <div className='account-authorize'>
@ -36,84 +38,72 @@ class AccountAuthorize extends ImmutablePureComponent {
to={`/accounts/${account.get('id')}`} to={`/accounts/${account.get('id')}`}
className='detailed-status__display-name' className='detailed-status__display-name'
> >
<div className='account-authorize__avatar'> <div className='account-authorize__avatar'><Avatar
<Avatar account={account}
account={account} size={48}
size={100} /></div >
/>
</div >
<DisplayName account={account} /> <DisplayName account={account} />
</Permalink > </Permalink >
{/*count posts*/} <div className='more'>
<span className='account-authorize--more-data'> {account.get('remote_url')}
<NavLink </div>
isActive={this.isStatusesPageActive}
activeClassName='active'
to={`/accounts/${account.get('id')}`}
title={intl.formatNumber(account.get('statuses_count'))}
>
<i className='fa fa-comment' />
<strong >{shortNumberFormat(account.get('statuses_count'))}</strong > <FormattedMessage
id='account.posts'
defaultMessage='Toots'
/>
</NavLink >
<NavLink
exact
activeClassName='active'
to={`/accounts/${account.get('id')}/following`}
title={intl.formatNumber(account.get('following_count'))}
>
<strong >{shortNumberFormat(account.get('following_count'))}</strong > <FormattedMessage
id='account.follows'
defaultMessage='Follows'
/>
</NavLink >
<NavLink
exact
activeClassName='active'
to={`/accounts/${account.get('id')}/followers`}
title={intl.formatNumber(account.get('followers_count'))}
>
<strong >{shortNumberFormat(account.get('followers_count'))}</strong > <FormattedMessage
id='account.followers'
defaultMessage='Followers'
/>
</NavLink >
</span >
<div <div
className='account__header__content' className='account__header__content'
dangerouslySetInnerHTML={content} dangerouslySetInnerHTML={content}
/> />
</div > </div >
<span className='account-authorize--more-data'>
<NavLink
isActive={this.isStatusesPageActive}
activeClassName='active'
to={`/accounts/${account.get('id')}`}
title={intl.formatNumber(account.get('statuses_count'))}
>
<i className='fa fa-comment' />
<strong >{(account.get('statuses_count'))}</strong > <FormattedMessage
id='account.posts'
defaultMessage='Toots'
/>
</NavLink >
<NavLink
exact
activeClassName='active'
to={`/accounts/${account.get('id')}/following`}
title={intl.formatNumber(account.get('following_count'))}
>
<strong >{(account.get('following_count'))}</strong > <FormattedMessage
id='account.follows'
defaultMessage='Follows'
/>
</NavLink >
<NavLink
exact
activeClassName='active'
to={`/accounts/${account.get('id')}/followers`}
title={intl.formatNumber(account.get('followers_count'))}
>
<strong >{(account.get('followers_count'))}</strong > <FormattedMessage
id='account.followers'
defaultMessage='Followers'
/>
</NavLink >
</span >
<div className='account--panel'> <div className='account--panel'>
<div <div className='account--panel__button'><IconButton
className='account--panel__button account--panel__button__allow clickable' title={intl.formatMessage(messages.authorize)}
icon='check'
onClick={onAuthorize} onClick={onAuthorize}
> /></div >
<i <div className='account--panel__button'><IconButton
className='fa fa-check' title={intl.formatMessage(messages.reject)}
title={intl.formatMessage(messages.authorize)} icon='times'
/>
{intl.formatMessage(messages.authorize)}
</div >
<div
className='account--panel__button account--panel__button__reject clickable'
onClick={onReject} onClick={onReject}
> /></div >
<i
className='fa fa-times'
title={intl.formatMessage(messages.reject)}
/>
{intl.formatMessage(messages.reject)}
</div >
</div > </div >
</div > </div >
); );

View File

@ -24,7 +24,7 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
}); });
// const themeIsDark = true; // const themeIsDark = true;
// const displaythemetoggler = true; const displayMoreLinks = false;
export default @injectIntl export default @injectIntl
@connect(null, mapDispatchToProps) @connect(null, mapDispatchToProps)
class LinkFooter extends React.PureComponent { class LinkFooter extends React.PureComponent {
@ -65,11 +65,12 @@ class LinkFooter extends React.PureComponent {
}; };
var weekNumber = (new Date()).getWeek(); var weekNumber = (new Date()).getWeek();
console.log('we are the week number weekNumber', weekNumber);
// display snow during the last two weeks of the year // display snow during the last two weeks of the year
const shouldWeDisplaySnow = (weekNumber > props.minimumWeekToShowSnow) && props.enableChristmasSnow; const shouldWeDisplaySnow = (weekNumber > props.minimumWeekToShowSnow) && props.enableChristmasSnow;
this.state = { this.state = {
displayMoreLinks : false, displayMoreLinks : displayMoreLinks,
enableChristmasSnow: shouldWeDisplaySnow, enableChristmasSnow: shouldWeDisplaySnow,
theme : props.theme, theme : props.theme,
}; };
@ -89,8 +90,8 @@ class LinkFooter extends React.PureComponent {
} }
toggleMoreLinks = () => { toggleMoreLinks = () => {
this.state.displayMoreLinks = !this.state.displayMoreLinks; this.setState({ displayMoreLinks: !this.state.displayMoreLinks });
console.log('this.state.displayMoreLinks', this.state.displayMoreLinks) console.log('this.state.displayMoreLinks', this.state.displayMoreLinks);
}; };
toggleSnow = () => { toggleSnow = () => {
@ -136,6 +137,13 @@ class LinkFooter extends React.PureComponent {
<div className='links-started__footer desktop-only'> <div className='links-started__footer desktop-only'>
<a href='https://mastodon.cipherbliss.com/@tykayn'>
<i className='fa fa-paper-plane' />
contactez l'admin
</a >
<a href='https://liberapay.com/cipherbliss'>
<i className='fa fa-coffee' /> Supportez
Cipherbliss</a >
<div className='extras'> <div className='extras'>
{this.state.enableChristmasSnow && ( {this.state.enableChristmasSnow && (
@ -161,7 +169,7 @@ class LinkFooter extends React.PureComponent {
href='/admin/tags?pending_review=1' href='/admin/tags?pending_review=1'
> >
<i className='fa fa-fire' /> <i className='fa fa-fire' />
Trending hashtags Trending hashtags
</a > </a >
<a <a
className='btn-warning' className='btn-warning'
@ -178,7 +186,7 @@ class LinkFooter extends React.PureComponent {
href='#external_utilities' href='#external_utilities'
onClick={this.toggleMoreLinks} onClick={this.toggleMoreLinks}
> >
<i className='fa fa-list-ul'></i > toggle links ( {this.state.displayMoreLinks} ) <i className='fa fa-list-ul' />
</a > </a >
{this.state.displayMoreLinks && ( {this.state.displayMoreLinks && (
@ -188,13 +196,6 @@ class LinkFooter extends React.PureComponent {
> >
<div > <div >
<a href='https://mastodon.cipherbliss.com/@tykayn'>
<i className='fa fa-paper-plane' />
contactez nous
</a >
<a href='https://liberapay.com/cipherbliss'><i className='fa fa-coffee' /> Supportez
Cipherbliss</a >
<a href='https://peertube.cipherbliss.com'> <i className='fa fa-play ' /> Videos</a > <a href='https://peertube.cipherbliss.com'> <i className='fa fa-play ' /> Videos</a >
<a href='https://framadate.org/'> <i className='fa fa-calendar' /> FramaDate</a > <a href='https://framadate.org/'> <i className='fa fa-calendar' /> FramaDate</a >
<a href='https://framapad.org/'> <i className='fa fa-file-text' /> Pad</a > <a href='https://framapad.org/'> <i className='fa fa-file-text' /> Pad</a >
@ -203,7 +204,7 @@ class LinkFooter extends React.PureComponent {
</div > </div >
<div className='suggested-tags'> <div className='suggested-tags'>
<ul > <ul >
navToTags {navToTags}
</ul > </ul >
</div > </div >
</div > </div >
@ -215,8 +216,8 @@ class LinkFooter extends React.PureComponent {
href='/invites' href='/invites'
target='_blank' target='_blank'
><FormattedMessage ><FormattedMessage
id='getting_started.invite' id='getting_started.invite'
defaultMessage='Invite people' defaultMessage='Invite people'
/></a > · </li >} /></a > · </li >}
{withHotkeys && <li > {withHotkeys && <li >
<Link to='/keyboard-shortcuts'><FormattedMessage <Link to='/keyboard-shortcuts'><FormattedMessage
@ -232,48 +233,48 @@ class LinkFooter extends React.PureComponent {
href='/about/more' href='/about/more'
target='_blank' target='_blank'
><FormattedMessage ><FormattedMessage
id='navigation_bar.info' id='navigation_bar.info'
defaultMessage='About this server' defaultMessage='About this server'
/></a > · /></a > ·
</li > </li >
<li ><a <li ><a
href='https://joinmastodon.org/apps' href='https://joinmastodon.org/apps'
target='_blank' target='_blank'
><FormattedMessage ><FormattedMessage
id='navigation_bar.apps' id='navigation_bar.apps'
defaultMessage='Mobile apps' defaultMessage='Mobile apps'
/></a > · /></a > ·
</li > </li >
<li ><a <li ><a
href='/terms' href='/terms'
target='_blank' target='_blank'
><FormattedMessage ><FormattedMessage
id='getting_started.terms' id='getting_started.terms'
defaultMessage='Terms of service' defaultMessage='Terms of service'
/></a > · /></a > ·
</li > </li >
<li ><a <li ><a
href='/settings/applications' href='/settings/applications'
target='_blank' target='_blank'
><FormattedMessage ><FormattedMessage
id='getting_started.developers' id='getting_started.developers'
defaultMessage='Developers' defaultMessage='Developers'
/></a > · /></a > ·
</li > </li >
<li ><a <li ><a
href='https://docs.joinmastodon.org' href='https://docs.joinmastodon.org'
target='_blank' target='_blank'
><FormattedMessage ><FormattedMessage
id='getting_started.documentation' id='getting_started.documentation'
defaultMessage='Documentation' defaultMessage='Documentation'
/></a > · /></a > ·
</li > </li >
<li ><a <li ><a
href='/auth/sign_out' href='/auth/sign_out'
onClick={this.handleLogoutClick} onClick={this.handleLogoutClick}
><FormattedMessage ><FormattedMessage
id='navigation_bar.logout' id='navigation_bar.logout'
defaultMessage='Logout' defaultMessage='Logout'
/></a ></li > /></a ></li >
</ul > </ul >

View File

@ -13,7 +13,8 @@
"account.edit_profile": "Modifier le profil", "account.edit_profile": "Modifier le profil",
"account.endorse": "Recommander sur le profil", "account.endorse": "Recommander sur le profil",
"account.follow": "Suivre", "account.follow": "Suivre",
"account.followers": "Abonné·e·s", "account.follows": "Adeptes",
"account.followers": "Adept·e·s",
"account.followers.empty": "Personne ne suit cet·te utilisateur·rice pour linstant.", "account.followers.empty": "Personne ne suit cet·te utilisateur·rice pour linstant.",
"account.followers_counter": "{count, plural, one {{counter} Abonné·e} other {{counter} Abonné·e·s}}", "account.followers_counter": "{count, plural, one {{counter} Abonné·e} other {{counter} Abonné·e·s}}",
"account.following_counter": "{count, plural, other {{counter} Abonnements}}", "account.following_counter": "{count, plural, other {{counter} Abonnements}}",
@ -69,7 +70,7 @@
"column.home": "Accueil", "column.home": "Accueil",
"column.lists": "Listes", "column.lists": "Listes",
"column.mutes": "Comptes masqués", "column.mutes": "Comptes masqués",
"column.notifications": "Notifications", "column.notifications": "Bafouilles",
"column.pins": "Pouets épinglés", "column.pins": "Pouets épinglés",
"column.public": "Fil public global", "column.public": "Fil public global",
"column_back_button.label": "Retour", "column_back_button.label": "Retour",
@ -277,7 +278,7 @@
"navigation_bar.direct": "Messages privés", "navigation_bar.direct": "Messages privés",
"navigation_bar.discover": "Découvrir", "navigation_bar.discover": "Découvrir",
"navigation_bar.domain_blocks": "Domaines bloqués", "navigation_bar.domain_blocks": "Domaines bloqués",
"navigation_bar.edit_profile": "Modifier le profil", "navigation_bar.edit_profile": "profil",
"navigation_bar.favourites": "Favoris", "navigation_bar.favourites": "Favoris",
"navigation_bar.filters": "Mots masqués", "navigation_bar.filters": "Mots masqués",
"navigation_bar.follow_requests": "Demandes de suivi", "navigation_bar.follow_requests": "Demandes de suivi",

View File

@ -331,7 +331,18 @@
.sidebar__toggle__logo, .sidebar__toggle{ .sidebar__toggle__logo, .sidebar__toggle{
display: none; display: none;
} }
.account--panel{
width: 100%;
}
.account-authorize--more-data{
margin-bottom: 1em;
display: flex;
a{
padding: 1em;
margin-bottom: 1em;
flex: auto;
}
}
@media screen and (max-width: 600px) { @media screen and (max-width: 600px) {

View File

@ -34,7 +34,9 @@
div[data-component] { div[data-component] {
width: 100%; width: 100%;
} }
.status__content__text{
min-height: 3em;
}
.entry { .entry {
background: $ui-base-color; background: $ui-base-color;