Refactor: cwd display label logic is duplicated in App.tsx and Terminal.tsx

[KrisPowers]

Summary

The logic that converts a full filesystem path into a short two-segment display label (e.g., /home/user/projects/myapp becomes projects/myapp) exists in two different places with the same implementation:

In app/frontend/src/App.tsx (lines 84-89):

function tabNameFromCwd(cwd: string): string {
 const parts = cwd.replace(/\/g, '/').replace(/\/$/, '').split('/').filter(Boolean)
 if (parts.length === 0) return '~'
 if (parts.length === 1) return parts[0]
 return parts.slice(-2).join('/')
}

In app/frontend/src/components/Terminal.tsx (lines 857-861):

const cwdLabel = React.useMemo(() => {
 const parts = cwd.replace(/\/g, '/').split('/').filter(Boolean)
 if (parts.length === 0) return '~'
 return parts.length <= 2 ? parts.join('/') : parts.slice(-2).join('/')
}, [cwd])

There are also subtle differences between the two (the App.tsx version strips trailing slashes; the Terminal.tsx version does not and handles 2-part paths differently). This means they can show different labels for the same path.

How to fix

Move the canonical implementation to app/frontend/src/lib/pathUtils.ts (create if it does not exist) and import it in both files:

export function shortCwd(cwd: string): string {
 const parts = cwd.replace(/\/g, '/').replace(/\/$/, '').split('/').filter(Boolean)
 if (parts.length === 0) return '~'
 if (parts.length === 1) return parts[0]
 return parts.slice(-2).join('/')
}

Files

• app/frontend/src/App.tsx (lines 84-89, tabNameFromCwd)
• app/frontend/src/components/Terminal.tsx (lines 857-861, cwdLabel useMemo)
• New file: app/frontend/src/lib/pathUtils.ts

[github-actions]

This issue has had no activity for 60 days and has been marked as stale. It will be closed automatically in 14 days unless there is new activity. If this issue is still relevant, please leave a comment or remove the stale label.