diff --git a/pkg/interface/src/views/components/StatusBar.js b/pkg/interface/src/views/components/StatusBar.js
index 50affc276..478d98d22 100644
--- a/pkg/interface/src/views/components/StatusBar.js
+++ b/pkg/interface/src/views/components/StatusBar.js
@@ -28,8 +28,9 @@ import useSettingsState, { selectCalmState } from '~/logic/state/settings';
 const localSel = selectLocalState(['toggleOmnibox']);
 
 const StatusBar = (props) => {
-  const { ourContact, api, ship } = props;
+  const { api, ship } = props;
   const history = useHistory();
+  const ourContact = useContactState((state) => state.contacts[`~${ship}`]);
   const notificationsCount = useHarkState((state) => state.notificationsCount);
   const doNotDisturb = useHarkState((state) => state.doNotDisturb);
   const inviteState = useInviteState((state) => state.invites);
@@ -40,7 +41,7 @@ const StatusBar = (props) => {
   const { toggleOmnibox } = useLocalState(localSel);
   const { hideAvatars } = useSettingsState(selectCalmState);
 
-  const color = !!ourContact ? `#${uxToHex(props.ourContact.color)}` : '#000';
+  const color = !!ourContact ? `#${uxToHex(ourContact.color)}` : '#000';
   const xPadding = !hideAvatars && ourContact?.avatar ? '0' : '2';
   const bgColor = !hideAvatars && ourContact?.avatar ? '' : color;
   const profileImage =
@@ -63,8 +64,6 @@ const StatusBar = (props) => {
   const floatLeap =
     leapHighlight && window.matchMedia('(max-width: 550px)').matches;
 
-  const contact = useContactState((state) => state.contacts[`~${ship}`]);
-
   return (
     <Box
       display='grid'
@@ -180,7 +179,11 @@ const StatusBar = (props) => {
                 <Text color='gray' fontWeight='500' mb='1'>
                   Set Status:
                 </Text>
-                <ProfileStatus contact={contact} ship={`~${ship}`} api={api} />
+                <ProfileStatus
+                  contact={ourContact}
+                  ship={`~${ship}`}
+                  api={api}
+                />
               </Row>
             </Col>
           }