diff --git a/services/web/frontend/js/features/ide-react/context/tabs-context.tsx b/services/web/frontend/js/features/ide-react/context/tabs-context.tsx index 9568393823..6b6865ffb6 100644 --- a/services/web/frontend/js/features/ide-react/context/tabs-context.tsx +++ b/services/web/frontend/js/features/ide-react/context/tabs-context.tsx @@ -9,6 +9,10 @@ import { debugConsole } from '@/utils/debugging' import { disambiguatePaths } from '../util/disambiguate-paths' import { isSplitTestEnabled } from '@/utils/splitTestUtils' import { useUserSettingsContext } from '@/shared/context/user-settings-context' +import { + FileTreeFindResult, + isFileRefResult, +} from '@/features/ide-react/types/file-tree' type PersistedTabInfo = { id: string; lifetime: Lifetime } @@ -16,7 +20,9 @@ type Lifetime = 'permanent' | 'temporary' export type EditorFileTab = { id: string + name: string displayPath: string + isLinkedFile: boolean lifetime: Lifetime } @@ -64,19 +70,29 @@ export const TabsProvider: FC = ({ children }) => { lifetime: tab.lifetime, result: findInTree(fileTreeData, tab.id), })) - .filter(x => !!x.result) + .filter(x => !!x.result) as { + lifetime: Lifetime + result: FileTreeFindResult + }[] const pathLookup = disambiguatePaths( - tabsFileTreeLookup.map(tab => tab.result!), + tabsFileTreeLookup.map(tab => tab.result), fileTreeData ) - return tabsFileTreeLookup.map(tab => ({ - id: tab.result!.entity._id, - displayPath: - pathLookup.get(tab.result!.entity._id) || tab.result!.entity.name, - lifetime: tab.lifetime, - })) + return tabsFileTreeLookup.map(tab => { + const entity = tab.result.entity + + return { + id: entity._id, + name: entity.name, + displayPath: pathLookup.get(entity._id) || entity.name, + isLinkedFile: + isFileRefResult(tab.result) && + !!tab.result.entity.linkedFileData?.provider, + lifetime: tab.lifetime, + } + }) }, [fileTreeData, openTabs, tabsEnabled]) const openTab = useCallback( diff --git a/services/web/frontend/js/features/ide-react/types/file-tree.ts b/services/web/frontend/js/features/ide-react/types/file-tree.ts index 64217314c5..040fd5a5b0 100644 --- a/services/web/frontend/js/features/ide-react/types/file-tree.ts +++ b/services/web/frontend/js/features/ide-react/types/file-tree.ts @@ -29,3 +29,15 @@ export type FileTreeFindResult = | FileTreeFolderFindResult | FileTreeDocumentFindResult | FileTreeFileRefFindResult + +export const isFolderResult = ( + result: FileTreeFindResult +): result is FileTreeFolderFindResult => result.type === 'folder' + +export const isDocResult = ( + result: FileTreeFindResult +): result is FileTreeDocumentFindResult => result.type === 'doc' + +export const isFileRefResult = ( + result: FileTreeFindResult +): result is FileTreeFileRefFindResult => result.type === 'fileRef' diff --git a/services/web/frontend/js/features/source-editor/components/tabs/tab.tsx b/services/web/frontend/js/features/source-editor/components/tabs/tab.tsx index e0ea074cee..a417f11fa2 100644 --- a/services/web/frontend/js/features/source-editor/components/tabs/tab.tsx +++ b/services/web/frontend/js/features/source-editor/components/tabs/tab.tsx @@ -2,6 +2,7 @@ import { EditorFileTab, TAB_TRANSFER_TYPE, } from '@/features/ide-react/context/tabs-context' +import FileTreeIcon from '@/features/file-tree/components/file-tree-icon' import MaterialIcon from '@/shared/components/material-icon' import { debugConsole } from '@/utils/debugging' import classNames from 'classnames' @@ -196,6 +197,9 @@ export const Tab = memo(function Tab({ 'tab-temporary': tab.lifetime === 'temporary', })} > + + +
‎{tab.displayPath}