Handle acct_full on the frontend

app/gabsocial/components/display_name.js

@@ -2,6 +2,7 @@ import React from 'react';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import PropTypes from 'prop-types';
 import VerificationBadge from './verification_badge';
+import { acctFull } from '../utils/accounts';
 
 export default class DisplayName extends React.PureComponent {
 
@@ -40,7 +41,7 @@ export default class DisplayName extends React.PureComponent {
           {account.get('is_verified') && <VerificationBadge />}
         </>
       );
-      suffix = <span className='display-name__account'>@{account.get('acct_full')}</span>;
+      suffix = <span className='display-name__account'>@{acctFull(account)}</span>;
     }
 
     return (

app/gabsocial/features/ui/components/profile_info_panel.js

@@ -14,6 +14,7 @@ import ProBadge from 'gabsocial/components/pro_badge';
 import DonorBadge from 'gabsocial/components/donor_badge';
 import InvestorBadge from 'gabsocial/components/investor_badge';
 import { List as ImmutableList } from 'immutable';
+import { acctFull } from 'gabsocial/utils/accounts';
 
 const messages = defineMessages({
   linkVerifiedOn: { id: 'account.link_verified_on', defaultMessage: 'Ownership of this link was checked on {date}' },
@@ -73,7 +74,7 @@ class ProfileInfoPanel extends ImmutablePureComponent {
               <span dangerouslySetInnerHTML={displayNameHtml} />
                 {account.get('is_verified') && <VerificationBadge />}
                 {badge}
-              <small>@{account.get('acct_full')} {lockedIcon}</small>
+              <small>@{acctFull(account)} {lockedIcon}</small>
             </h1>
           </div>
 

app/gabsocial/features/ui/components/user_panel.js

@@ -9,6 +9,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import Avatar from 'gabsocial/components/avatar';
 import { shortNumberFormat } from 'gabsocial/utils/numbers';
+import { acctFull } from 'gabsocial/utils/accounts';
 
 class UserPanel extends ImmutablePureComponent {
   static propTypes = {
@@ -42,7 +43,7 @@ class UserPanel extends ImmutablePureComponent {
               <h1>
                 <Link to={`/@${account.get('acct')}`}>
                   <span className='user-panel__account__name' dangerouslySetInnerHTML={displayNameHtml} />
-                  <small className='user-panel__account__username'>@{account.get('acct_full')}</small>
+                  <small className='user-panel__account__username'>@{acctFull(account)}</small>
                 </Link>
               </h1>
             </div>

app/gabsocial/utils/accounts.js

@@ -0,0 +1,16 @@
+const getDomain = account => {
+  let re = /https?:\/\/(.*?)\//i;
+  return re.exec(account.get('url'))[1];
+}
+
+// user@domain even for local users
+export const acctFull = account => {
+  let [user, domain] = account.get('acct').split('@');
+  try {
+    if (!domain) domain = getDomain(account);
+  } catch(e) {
+    console.error('Could not get domain for acctFull.');
+    return account.get('acct');
+  }
+  return [user, domain].join('@');
+}