Navigation was not working on storage containers the correct view wasn't shown

package.json

@@ -62,7 +62,7 @@
     "chat-pane": "4.0.0",
     "contacts-pane": "4.0.0",
     "dompurify": "^3.4.4",
-    "folder-pane": "4.0.1-0",
+    "folder-pane": "4.0.1-1",
     "issue-pane": "4.0.0",
     "lit-html": "^3.3.2",
     "marked": "^18.0.3",

src/components/profile-heading/ProfileHeading.styles.css

@@ -241,6 +241,10 @@
   align-self: center;
 }
 
+:host([compact]) .profile__heading-edit-action {
+  align-self: center;
+}
+
 :host([compact]) .name {
   white-space: normal;
   overflow-wrap: anywhere;

src/components/profile-heading/ProfileHeading.ts

@@ -221,7 +221,7 @@ export default class ProfileHeading extends WebComponent {
           </header>
         </div>
 
-        ${(this.editContext || showFriend) && !this.compact
+        ${(this.editContext && !this.compact) || showFriend
           ? html`
             <div class="profile__actions profile__heading-edit-action">
               ${showFriend
@@ -246,7 +246,7 @@ export default class ProfileHeading extends WebComponent {
                 </div>
               `
                 : nothing}
-              ${this.editContext
+              ${this.editContext && !this.compact
                 ? html`
               <solid-ui-button
                 variant="tertiary"

src/mainPage/index.ts

@@ -4,6 +4,7 @@
  */
 
 import { LiveStore, NamedNode } from 'rdflib'
+import { authSession } from 'solid-logic'
 import type { RenderEnvironment } from 'pane-registry'
 import { getOutliner, OutlineManager } from '../index'
 import { createHeader } from './header'
@@ -12,6 +13,7 @@ import { navigationFor } from './navigation'
 import { initializeProfileHeading, placeProfileHeading } from './profileHeading'
 import { registerBrowserNavigation } from '../navigation/browserEvents'
 import { clearPaneState } from '../navigation/state'
+import { resetPodContexts } from '../navigation/podContext'
 import { HUMAN_READABLE_PREVIEW_FRAME_NAME } from '../humanReadablePane'
 
 // Symbol used to stash the last render-relevant env snapshot on the outliner
@@ -55,11 +57,22 @@ export async function initMainPage (
   // This is also what Enter on the current URL ends in where the Navigation API is missing (see
   // NAVIGATION API FALLBACK in navigation/browserEvents.ts): the browser reloads the page.
   clearPaneState()
-  initializeProfileHeading()
+  await initializeProfileHeading()
   const outliner = getOutliner(document, environment)
   ;(outliner as any)[LAST_RENDER_ENV_KEY] = renderEnvSignature(environment)
   const navigation = navigationFor(outliner, store)
   registerBrowserNavigation(navigation)
+  const refreshNavigationAfterAuth = () => {
+    resetPodContexts()
+    navigation.show({ kind: 'restore', forceHeading: true }).catch((error: unknown) => {
+      console.error('Failed to refresh navigation after an authentication change.', error)
+    })
+  }
+  authSession.events.on('login', refreshNavigationAfterAuth)
+  authSession.events.on('sessionRestore', refreshNavigationAfterAuth)
+  authSession.events.on('logout', refreshNavigationAfterAuth)
+  authSession.events.on('sessionChange', refreshNavigationAfterAuth)
+  authSession.events.on('identityReplaced', refreshNavigationAfterAuth)
   await navigation.show({ kind: 'restore', subject: subject.uri })
 
   const header = await createHeader(navigation)

src/mainPage/profileHeading.ts

@@ -7,7 +7,7 @@ import type { ViewerMode } from '../types'
 import { loadProfileFromURI } from '../utils/webIdUtils'
 import '../components/profile-heading'
 import './profileHeading.css'
-import { deriveHeading } from '../navigation/chrome'
+import { deriveHeading, offersFriendAction } from '../navigation/chrome'
 import { getPodContext } from '../navigation/podContext'
 import { onNavigated } from '../navigation/events'
 import { readNavigationState } from '../navigation/state'
@@ -212,7 +212,7 @@ export async function refreshProfileHeading (force = false): Promise<void> {
     }
   heading.profileData = profileData
   const viewer = authn.currentUser()
-  heading.friendSubject = isProfilePane && viewer && !viewer.sameTerm(subject)
+  heading.friendSubject = offersFriendAction(decision.paneName) && viewer && !viewer.sameTerm(subject)
     ? subject
     : undefined
   heading.editContext = canEdit
@@ -243,7 +243,7 @@ export function placeProfileHeading (): void {
   ensureMountPoint()
 }
 
-export function initializeProfileHeading (): void {
+export function initializeProfileHeading (): Promise<void> {
   ensureMountPoint()
 
   if (!profileSavedListenerRegistered) {
@@ -296,4 +296,5 @@ export function initializeProfileHeading (): void {
   readiness.then(() => refreshProfileHeading(true)).catch((error: unknown) => {
     console.error('Failed to refresh profile heading.', error)
   })
+  return readiness
 }

src/navigation/chrome.ts

@@ -9,6 +9,7 @@
  */
 
 import { type NavigationView } from './state'
+import type { FolderView } from './options'
 
 /** Registry names of the panes that present a person rather than a resource. */
 export const PERSON_PANES = ['profile', 'social']
@@ -17,6 +18,11 @@ export function isPersonPane (paneName?: string): boolean {
   return paneName !== undefined && PERSON_PANES.includes(paneName)
 }
 
+/** Whether the heading over this pane offers to add its person as a friend: on the Profile and Friends tabs. */
+export function offersFriendAction (paneName?: string): boolean {
+  return isPersonPane(paneName)
+}
+
 /** The parts of a navbar item that the rules look at. */
 export interface NavbarItemRef {
   paneName?: string
@@ -121,6 +127,24 @@ export function isNavbarHidden (input: { viaAccountMenu: boolean, ownProfile: bo
   return input.viaAccountMenu || input.ownProfile || input.inViewerPod
 }
 
+// Storage
+
+export interface StorageViewInput {
+  viaAccountMenu: boolean
+  /** The storage is one of the viewer's own. */
+  inViewerPod: boolean
+  /** The storage belongs to a person whose profile was found; the server root has none. */
+  hasOwner: boolean
+}
+
+/**
+ * The viewer's own storage, and the server root, come with the folder pane's storage header.
+ * Someone else's storage sits under the navbar of their pod, which already says whose it is.
+ */
+export function deriveStorageView (input: StorageViewInput): Extract<FolderView, 'explorer' | 'storage'> {
+  return input.viaAccountMenu || input.inViewerPod || !input.hasOwner ? 'explorer' : 'storage'
+}
+
 // File explorer header
 
 export interface ExplorerHeaderInput {
@@ -140,7 +164,11 @@ export function deriveExplorerHeader (input: ExplorerHeaderInput): boolean {
   return !input.viewerPodOnly || input.inViewerPod
 }
 
-/** The header is never shown over a person's profile or friends, whatever the resource. */
-export function explorerHeaderForPane (resourceHeader: boolean, paneName?: string): boolean {
+/**
+ * The header is never shown over a person's profile or friends, whatever the resource,
+ * nor over a storage view, which has its own header or the navbar.
+ */
+export function explorerHeaderForPane (resourceHeader: boolean, paneName?: string, folderView?: FolderView): boolean {
+  if (paneName === 'folder' && (folderView === 'explorer' || folderView === 'storage')) return false
   return resourceHeader && !isPersonPane(paneName)
 }