From 703be8a9fd21a2cb675acdee7d10f1aee678ea08 Mon Sep 17 00:00:00 2001
From: Baptiste Lemoine <contact@cipherbliss.com>
Date: Fri, 24 Jul 2020 17:42:22 +0200
Subject: [PATCH] fix account authorize page

---
 .../components/account_authorize.js           | 128 ++++++++----------
 .../features/ui/components/link_footer.js     |  57 ++++----
 app/javascript/mastodon/locales/fr.json       |   7 +-
 app/javascript/styles/bliss/accounts.scss     |  13 +-
 app/javascript/styles/bliss/statuses.scss     |   4 +-
 5 files changed, 107 insertions(+), 102 deletions(-)

diff --git a/app/javascript/mastodon/features/follow_requests/components/account_authorize.js b/app/javascript/mastodon/features/follow_requests/components/account_authorize.js
index 9bc258f27..c1522af45 100644
--- a/app/javascript/mastodon/features/follow_requests/components/account_authorize.js
+++ b/app/javascript/mastodon/features/follow_requests/components/account_authorize.js
@@ -4,10 +4,10 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
 import Permalink from '../../../components/permalink';
 import Avatar from '../../../components/avatar';
 import DisplayName from '../../../components/display_name';
-import { defineMessages, FormattedMessage, injectIntl } from 'react-intl';
-import { shortNumberFormat } from 'mastodon/utils/numbers';
-import ImmutablePureComponent from 'react-immutable-pure-component';
+import IconButton from '../../../components/icon_button';
 import { NavLink } from 'react-router-dom';
+import { defineMessages, FormattedMessage, injectIntl } from 'react-intl';
+import ImmutablePureComponent from 'react-immutable-pure-component';
 
 const messages = defineMessages({
   authorize: { id: 'follow_request.authorize', defaultMessage: 'Authorize' },
@@ -28,6 +28,8 @@ class AccountAuthorize extends ImmutablePureComponent {
     const { intl, account, onAuthorize, onReject } = this.props;
     const content = { __html: account.get('note_emojified') };
 
+
+    const fields          = account.get('fields');
     return (
       <div className='account-authorize__wrapper'>
         <div className='account-authorize'>
@@ -36,84 +38,72 @@ class AccountAuthorize extends ImmutablePureComponent {
             to={`/accounts/${account.get('id')}`}
             className='detailed-status__display-name'
           >
-            <div className='account-authorize__avatar'>
-              <Avatar
-                account={account}
-                size={100}
-              />
-
-            </div >
+            <div className='account-authorize__avatar'><Avatar
+              account={account}
+              size={48}
+            /></div >
             <DisplayName account={account} />
-
           </Permalink >
-          {/*count posts*/}
-          <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 >{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 className='more'>
+            {account.get('remote_url')}
+          </div>
 
           <div
             className='account__header__content'
             dangerouslySetInnerHTML={content}
           />
         </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__button account--panel__button__allow clickable'
+          <div className='account--panel__button'><IconButton
+            title={intl.formatMessage(messages.authorize)}
+            icon='check'
             onClick={onAuthorize}
-          >
-            <i
-              className='fa fa-check'
-              title={intl.formatMessage(messages.authorize)}
-            />
-            {intl.formatMessage(messages.authorize)}
-          </div >
-          <div
-            className='account--panel__button  account--panel__button__reject clickable'
+          /></div >
+          <div className='account--panel__button'><IconButton
+            title={intl.formatMessage(messages.reject)}
+            icon='times'
             onClick={onReject}
-          >
-            <i
-              className='fa fa-times'
-              title={intl.formatMessage(messages.reject)}
-            />
-            {intl.formatMessage(messages.reject)}
-          </div >
+          /></div >
         </div >
       </div >
     );
diff --git a/app/javascript/mastodon/features/ui/components/link_footer.js b/app/javascript/mastodon/features/ui/components/link_footer.js
index 12651974b..37818df69 100644
--- a/app/javascript/mastodon/features/ui/components/link_footer.js
+++ b/app/javascript/mastodon/features/ui/components/link_footer.js
@@ -24,7 +24,7 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
 });
 
 // const themeIsDark = true;
-// const displaythemetoggler = true;
+const displayMoreLinks = false;
 export default @injectIntl
 @connect(null, mapDispatchToProps)
 class LinkFooter extends React.PureComponent {
@@ -65,11 +65,12 @@ class LinkFooter extends React.PureComponent {
     };
 
     var weekNumber = (new Date()).getWeek();
+    console.log('we are the week number weekNumber', weekNumber);
     // display snow during the last two weeks of the year
     const shouldWeDisplaySnow = (weekNumber > props.minimumWeekToShowSnow) && props.enableChristmasSnow;
 
     this.state = {
-      displayMoreLinks   : false,
+      displayMoreLinks   : displayMoreLinks,
       enableChristmasSnow: shouldWeDisplaySnow,
       theme              : props.theme,
     };
@@ -89,8 +90,8 @@ class LinkFooter extends React.PureComponent {
   }
 
   toggleMoreLinks = () => {
-    this.state.displayMoreLinks = !this.state.displayMoreLinks;
-    console.log('this.state.displayMoreLinks', this.state.displayMoreLinks)
+    this.setState({ displayMoreLinks: !this.state.displayMoreLinks });
+    console.log('this.state.displayMoreLinks', this.state.displayMoreLinks);
   };
 
   toggleSnow = () => {
@@ -136,6 +137,13 @@ class LinkFooter extends React.PureComponent {
 
       <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'>
 
           {this.state.enableChristmasSnow && (
@@ -161,7 +169,7 @@ class LinkFooter extends React.PureComponent {
                 href='/admin/tags?pending_review=1'
               >
                 <i className='fa fa-fire' />
-              Trending hashtags
+                Trending hashtags
               </a >
               <a
                 className='btn-warning'
@@ -178,7 +186,7 @@ class LinkFooter extends React.PureComponent {
             href='#external_utilities'
             onClick={this.toggleMoreLinks}
           >
-            <i className='fa fa-list-ul'></i > toggle links ( {this.state.displayMoreLinks} )
+            <i className='fa fa-list-ul' />
           </a >
           {this.state.displayMoreLinks && (
 
@@ -188,13 +196,6 @@ class LinkFooter extends React.PureComponent {
             >
               <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://framadate.org/'> <i className='fa fa-calendar' /> FramaDate</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 className='suggested-tags'>
                 <ul >
-                  navToTags
+                  {navToTags}
                 </ul >
               </div >
             </div >
@@ -215,8 +216,8 @@ class LinkFooter extends React.PureComponent {
             href='/invites'
             target='_blank'
           ><FormattedMessage
-            id='getting_started.invite'
-            defaultMessage='Invite people'
+              id='getting_started.invite'
+              defaultMessage='Invite people'
           /></a > · </li >}
           {withHotkeys && <li >
             <Link to='/keyboard-shortcuts'><FormattedMessage
@@ -232,48 +233,48 @@ class LinkFooter extends React.PureComponent {
             href='/about/more'
             target='_blank'
           ><FormattedMessage
-            id='navigation_bar.info'
-            defaultMessage='About this server'
+              id='navigation_bar.info'
+              defaultMessage='About this server'
           /></a > ·
           </li >
           <li ><a
             href='https://joinmastodon.org/apps'
             target='_blank'
           ><FormattedMessage
-            id='navigation_bar.apps'
-            defaultMessage='Mobile apps'
+              id='navigation_bar.apps'
+              defaultMessage='Mobile apps'
           /></a > ·
           </li >
           <li ><a
             href='/terms'
             target='_blank'
           ><FormattedMessage
-            id='getting_started.terms'
-            defaultMessage='Terms of service'
+              id='getting_started.terms'
+              defaultMessage='Terms of service'
           /></a > ·
           </li >
           <li ><a
             href='/settings/applications'
             target='_blank'
           ><FormattedMessage
-            id='getting_started.developers'
-            defaultMessage='Developers'
+              id='getting_started.developers'
+              defaultMessage='Developers'
           /></a > ·
           </li >
           <li ><a
             href='https://docs.joinmastodon.org'
             target='_blank'
           ><FormattedMessage
-            id='getting_started.documentation'
-            defaultMessage='Documentation'
+              id='getting_started.documentation'
+              defaultMessage='Documentation'
           /></a > ·
           </li >
           <li ><a
             href='/auth/sign_out'
             onClick={this.handleLogoutClick}
           ><FormattedMessage
-            id='navigation_bar.logout'
-            defaultMessage='Logout'
+              id='navigation_bar.logout'
+              defaultMessage='Logout'
           /></a ></li >
         </ul >
 
diff --git a/app/javascript/mastodon/locales/fr.json b/app/javascript/mastodon/locales/fr.json
index a3a03038d..6c13c09d1 100644
--- a/app/javascript/mastodon/locales/fr.json
+++ b/app/javascript/mastodon/locales/fr.json
@@ -13,7 +13,8 @@
   "account.edit_profile": "Modifier le profil",
   "account.endorse": "Recommander sur le profil",
   "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 l’instant.",
   "account.followers_counter": "{count, plural, one {{counter} Abonné·e} other {{counter} Abonné·e·s}}",
   "account.following_counter": "{count, plural, other {{counter} Abonnements}}",
@@ -69,7 +70,7 @@
   "column.home": "Accueil",
   "column.lists": "Listes",
   "column.mutes": "Comptes masqués",
-  "column.notifications": "Notifications",
+  "column.notifications": "Bafouilles",
   "column.pins": "Pouets épinglés",
   "column.public": "Fil public global",
   "column_back_button.label": "Retour",
@@ -277,7 +278,7 @@
   "navigation_bar.direct": "Messages privés",
   "navigation_bar.discover": "Découvrir",
   "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.filters": "Mots masqués",
   "navigation_bar.follow_requests": "Demandes de suivi",
diff --git a/app/javascript/styles/bliss/accounts.scss b/app/javascript/styles/bliss/accounts.scss
index bb8899e32..4bd0f1caf 100644
--- a/app/javascript/styles/bliss/accounts.scss
+++ b/app/javascript/styles/bliss/accounts.scss
@@ -331,7 +331,18 @@
 .sidebar__toggle__logo, .sidebar__toggle{
   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) {
 
diff --git a/app/javascript/styles/bliss/statuses.scss b/app/javascript/styles/bliss/statuses.scss
index dc7f9e4dc..93c10e2fa 100644
--- a/app/javascript/styles/bliss/statuses.scss
+++ b/app/javascript/styles/bliss/statuses.scss
@@ -34,7 +34,9 @@
 div[data-component] {
   width: 100%;
 }
-
+.status__content__text{
+  min-height: 3em;
+}
 .entry {
   background: $ui-base-color;