profile: address comments

pkg/interface/src/views/apps/chat/components/lib/message.js

@@ -47,12 +47,14 @@ const renderWithSigil = (props, timestamp) => {
 
     const contact = props.msg.author in props.contacts
       ? props.contacts[props.msg.author] : false;
+    const showNickname = !props.hideNicknames && contact?.nickname;
     let name = `~${props.msg.author}`;
     let color = '#000000';
     let sigilClass = 'mix-blend-diff';
     if (contact) {
-      name = (contact.nickname.length > 0 && !props.hideNicknames)
-        ? contact.nickname : `~${props.msg.author}`;
+      name = showNickname
+        ? contact.nickname
+        : `~${props.msg.author}`;
       color = `#${uxToHex(contact.color)}`;
       sigilClass = '';
     }
@@ -71,6 +73,7 @@ const renderWithSigil = (props, timestamp) => {
           association={props.association}
           group={props.group}
           hideAvatars={props.hideAvatars}
+          hideNicknames={props.hideNicknames}
           className="fl pr3 v-top bg-white bg-gray0-d"
         />
         <div className="fr clamp-message white-d"
@@ -80,7 +83,7 @@ const renderWithSigil = (props, timestamp) => {
               <span
                 className={
                   'mw5 db truncate pointer ' +
-                  (contact.nickname ? '' : 'mono')
+                  (showNickname ? '' : 'mono')
                 }
                 onClick={() => {
                   writeText(props.msg.author);

pkg/interface/src/views/apps/chat/components/lib/overlay-sigil.js

@@ -90,6 +90,8 @@ export class OverlaySigil extends Component {
             association={props.association}
             group={props.group}
             onDismiss={this.profileHide}
+            hideAvatars={hideAvatars}
+            hideNicknames={props.hideNicknames}
           />
         )}
         {img}

pkg/interface/src/views/apps/chat/components/lib/profile-overlay.js

@@ -34,7 +34,7 @@ export class ProfileOverlay extends Component {
   }
 
   render() {
-    const { contact, ship, color, topSpace, bottomSpace, group, association } = this.props;
+    const { contact, ship, color, topSpace, bottomSpace, group, association, hideNicknames, hideAvatars } = this.props;
 
     let top, bottom;
     if (topSpace < OVERLAY_HEIGHT / 2) {
@@ -51,10 +51,10 @@ export class ProfileOverlay extends Component {
     const isOwn = window.ship === ship;
 
     const identityHref = group.hidden
-      ? '/~groups/me'
+      ? '/~profile/identity'
       : `/~groups/view${association['group-path']}/${window.ship}`;
 
-    let img = (contact && (contact.avatar !== null))
+    let img = contact?.avatar && !hideAvatars
       ? <img src={contact.avatar} height={160} width={160} className="brt2 dib" />
       : <Sigil
         ship={ship}
@@ -63,6 +63,7 @@ export class ProfileOverlay extends Component {
         classes="brt2"
         svgClass="brt2"
         />;
+    const showNickname = contact?.nickname && !hideNicknames;
 
       if (!group.hidden) {
         img = <Link to={`/~groups/view${association['group-path']}/${ship}`}>{img}</Link>;
@@ -78,7 +79,7 @@ export class ProfileOverlay extends Component {
         {img}
         </div>
         <div className="pv3 pl3 pr2">
-          {contact && contact.nickname && (
+          {showNickname && (
             <div className="b white-d truncate">{contact.nickname}</div>
           )}
           <div className="mono gray2">{cite(`~${ship}`)}</div>

pkg/interface/src/views/apps/profile/profile.tsx

@@ -86,12 +86,12 @@ export default function ProfileScreen(props: any) {
                   </Box>
                 </Box>
                 <Box width="100%" py={3}>
-                  <SidebarItem current={view} view="settings">
-                    Ship Settings
-                  </SidebarItem>
                   <SidebarItem current={view} view="identity">
                     Your Identity
                   </SidebarItem>
+                  <SidebarItem current={view} view="settings">
+                    Ship Settings
+                  </SidebarItem>
                 </Box>
               </Col>
               <Box