From 7a21749c96f2e093017af3a9503b97c39807919a Mon Sep 17 00:00:00 2001 From: Brendan Date: Thu, 2 Oct 2025 11:17:34 +0200 Subject: [PATCH 1/3] Initial draft of new file tree browser page --- .../repository/files/file_tree_browser.md | 98 +++++++++++++++++++ 1 file changed, 98 insertions(+) create mode 100644 doc/user/project/repository/files/file_tree_browser.md diff --git a/doc/user/project/repository/files/file_tree_browser.md b/doc/user/project/repository/files/file_tree_browser.md new file mode 100644 index 00000000000000..378f160c0cfb94 --- /dev/null +++ b/doc/user/project/repository/files/file_tree_browser.md @@ -0,0 +1,98 @@ +--- +stage: Create +group: Source Code +info: To determine the technical writer assigned to the Stage/Group associated with this page, see https://handbook.gitlab.com/handbook/product/ux/technical-writing/#assignments +description: Use the file tree browser to navigate repository files and directories. +title: File tree browser +--- + +{{< details >}} + +- Tier: Free, Premium, Ultimate +- Offering: GitLab.com, GitLab Self-Managed, GitLab Dedicated + +{{< /details >}} + +{{< history >}} + +- [Introduced](https://gitlab.com/gitlab-org/gitlab/-/issues/19530) in GitLab 18.0 [with a flag](../../../../administration/feature_flags/_index.md) named `repository_file_tree_browser`. Disabled by default. + +{{< /history >}} + +{{< alert type="flag" >}} + +The availability of this feature is controlled by a feature flag. +For more information, see the history. + +{{< /alert >}} + +The file tree browser is a sidebar that displays your repository's files and directories in +a collapsible tree structure. Use it to navigate your repository without scrolling +through long file listings. + +The file tree browser helps you: + +- Navigate nested directory structures. +- View the repository hierarchy. +- Switch between files while maintaining context of the directory structure. + +## Show or hide the file tree browser + +To show or hide the file tree browser: + +1. On the left sidebar, select **Search or go to** and find your project. +1. Go to your repository files at `//-/tree/`. +1. In the upper-left corner, select the file tree browser icon ({{< icon name="file-tree" >}}). + +You can also press Shift+F to toggle the file tree browser. + +## Navigate files and directories + +The file tree browser displays your repository's structure with files and directories you can +expand and collapse. + +To navigate in the file tree browser: + +1. Open the file tree browser. Either: + + - In the upper-left corner, select the file tree browser icon ({{< icon name="file-tree" >}}). + - Press Shift+F. + +1. To expand a directory, select the directory name. +1. To view a file, select the filename. + +When you navigate directly to a nested file, the file tree browser automatically expands parent +directories and highlights the current file. + +## Filter files + +Use the filter to quickly find files by name in your repository. + +To filter files: + +1. Open the file tree browser. Either: + + - In the upper-left corner, select the file tree browser icon ({{< icon name="file-tree" >}}). + - Press Shift+F. + +1. In the filter text box, enter part of the filename you want to find. + The file tree browser filters the list to show matching files and their parent directories. + +If no files match your search, the file tree browser displays **No files found**. + +The filter text persists when you close and reopen the file tree browser, unless you clear it. + +## Keyboard shortcuts + +The file tree browser supports these keyboard shortcuts: + +| Shortcut | Action | +|----------|--------| +| Shift+F | Show or hide the file tree browser | +| F | Focus on the filter text box | + +## Related topics + +- [Web Editor](../web_editor.md) +- [Git file history](git_history.md) +- [Git file blame](git_blame.md) -- GitLab From 41f35265e140ebbc7b32393f1bebcc10cdd08dd7 Mon Sep 17 00:00:00 2001 From: Brendan Date: Thu, 2 Oct 2025 11:20:33 +0200 Subject: [PATCH 2/3] Add reference links to related topics --- doc/user/project/repository/files/git_blame.md | 1 + doc/user/project/repository/files/git_history.md | 1 + doc/user/project/repository/web_editor.md | 1 + 3 files changed, 3 insertions(+) diff --git a/doc/user/project/repository/files/git_blame.md b/doc/user/project/repository/files/git_blame.md index f27e83008a4a5d..0b23cd55b2dd74 100644 --- a/doc/user/project/repository/files/git_blame.md +++ b/doc/user/project/repository/files/git_blame.md @@ -93,3 +93,4 @@ showing the previous meaningful changes instead. - [Git file blame REST API](../../../../api/repository_files.md#get-file-blame-from-repository) - [Common Git commands](../../../../topics/git/commands.md) - [File management with Git](../../../../topics/git/file_management.md) +- [File tree browser](file_tree_browser.md) diff --git a/doc/user/project/repository/files/git_history.md b/doc/user/project/repository/files/git_history.md index 14641ea52ae414..405493eb3b2f24 100644 --- a/doc/user/project/repository/files/git_history.md +++ b/doc/user/project/repository/files/git_history.md @@ -80,3 +80,4 @@ https://gitlab.com/gitlab-org/gitlab/-/commits/master/CONTRIBUTING.md?ref_type=h - [Git blame](git_blame.md) - [Common Git commands](../../../../topics/git/commands.md) - [File management with Git](../../../../topics/git/file_management.md) +- [File tree browser](file_tree_browser.md) diff --git a/doc/user/project/repository/web_editor.md b/doc/user/project/repository/web_editor.md index 6ec0a8abf6224e..07545887149cd1 100644 --- a/doc/user/project/repository/web_editor.md +++ b/doc/user/project/repository/web_editor.md @@ -333,3 +333,4 @@ production releases and release candidates. To create a tag in the Web Editor: - [Default branch](branches/default.md) - [Protected branches](branches/protected.md) - [Web IDE](../web_ide/_index.md) +- [File tree browser](files/file_tree_browser.md) -- GitLab From 4cd4c68179744eaff6005b8bba3f2da9e0e1b6df Mon Sep 17 00:00:00 2001 From: Brendan Lynch Date: Fri, 3 Oct 2025 09:42:43 +0200 Subject: [PATCH 3/3] Apply 1 suggestion(s) to 1 file(s) Co-authored-by: Chaoyue Zhao --- doc/user/project/repository/files/file_tree_browser.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/doc/user/project/repository/files/file_tree_browser.md b/doc/user/project/repository/files/file_tree_browser.md index 378f160c0cfb94..e0dfa5edbb8d5e 100644 --- a/doc/user/project/repository/files/file_tree_browser.md +++ b/doc/user/project/repository/files/file_tree_browser.md @@ -26,7 +26,7 @@ For more information, see the history. {{< /alert >}} -The file tree browser is a sidebar that displays your repository's files and directories in +The file tree browser is a drawer that displays your repository's files and directories in a collapsible tree structure. Use it to navigate your repository without scrolling through long file listings. -- GitLab