diff --git a/pkg/interface/src/logic/lib/tutorialModal.ts b/pkg/interface/src/logic/lib/tutorialModal.ts
index 8e93c7a53..25dfaaf28 100644
--- a/pkg/interface/src/logic/lib/tutorialModal.ts
+++ b/pkg/interface/src/logic/lib/tutorialModal.ts
@@ -156,7 +156,7 @@ export const progressDetails: Record<TutorialProgress, StepDetail> = {
     alignX: 'right',
     arrow: 'South',
     offsetX: -300 + MODAL_WIDTH / 2,
-    offsetY: -60,
+    offsetY: -4,
   },
   leap: {
     title: 'Leap',
diff --git a/pkg/interface/src/views/apps/profile/components/Profile.tsx b/pkg/interface/src/views/apps/profile/components/Profile.tsx
index ca120ecda..0f7b641d6 100644
--- a/pkg/interface/src/views/apps/profile/components/Profile.tsx
+++ b/pkg/interface/src/views/apps/profile/components/Profile.tsx
@@ -29,6 +29,10 @@ export function ProfileImages(props: any): ReactElement {
   const { contact, hideCover, ship } = { ...props };
   const hexColor = contact?.color ? `#${uxToHex(contact.color)}` : '#000000';
 
+  const anchorRef = useRef<HTMLElement | null>(null)
+
+  useTutorialModal('profile', ship === `~${window.ship}`, anchorRef);
+
   const cover =
     contact?.cover && !hideCover ? (
       <BaseImage
@@ -60,7 +64,7 @@ export function ProfileImages(props: any): ReactElement {
 
   return (
     <>
-      <Row width='100%' height='300px' position='relative'>
+      <Row ref={anchorRef} width='100%' height='300px' position='relative'>
         {cover}
         <Center position='absolute' width='100%' height='100%'>
           {props.children}
@@ -145,9 +149,6 @@ export function ProfileOwnControls(props: any): ReactElement {
 export function Profile(props: any): ReactElement {
   const history = useHistory();
 
-  if (!props.ship) {
-    return null;
-  }
   const { contact, nackedContacts, hasLoaded, isPublic, isEdit, ship } = props;
   const nacked = nackedContacts.has(ship);
   const formRef = useRef(null);
@@ -160,30 +161,17 @@ export function Profile(props: any): ReactElement {
 
   const anchorRef = useRef<HTMLElement | null>(null);
 
-  useTutorialModal('profile', ship === `~${window.ship}`, anchorRef);
+  console.log(ship);
 
-  const ViewInterface = () => {
-    return (
-      <Center p={[0, 4]} height='100%' width='100%'>
-        <Box ref={anchorRef} maxWidth='600px' width='100%' position='relative'>
-          <ViewProfile
-            nacked={nacked}
-            ship={ship}
-            contact={contact}
-            isPublic={isPublic}
-            api={props.api}
-            groups={props.groups}
-            associations={props.associations}
-          />
-        </Box>
-      </Center>
-    );
-  };
 
-  const EditInterface = () => {
-    return (
-      <Center p={[0, 4]} height='100%' width='100%'>
-        <Box ref={anchorRef} maxWidth='600px' width='100%' position='relative'>
+  if (!props.ship) {
+    return null;
+  }
+
+  return (
+    <Center p={[0, 4]} height='100%' width='100%'>
+      <Box maxWidth='600px' width='100%' position='relative'>
+        { isEdit ? (
           <EditProfile
             ship={ship}
             contact={contact}
@@ -193,10 +181,18 @@ export function Profile(props: any): ReactElement {
             associations={props.associations}
             isPublic={isPublic}
           />
-        </Box>
-      </Center>
-    );
-  };
-
-  return isEdit ? <EditInterface /> : <ViewInterface />;
+        ) : (
+          <ViewProfile
+            nacked={nacked}
+            ship={ship}
+            contact={contact}
+            isPublic={isPublic}
+            api={props.api}
+            groups={props.groups}
+            associations={props.associations}
+          />
+        )}
+      </Box>
+    </Center>
+  );
 }