Browse Source

Show file tree by default (#25052)

Feel free to close this if there isn't interest.

The tree view looks amazing, and all of our users are really enjoying it
(major kudos to developers!), but only IF I tell them it exists!

Essentially, the file tree view as it is effectively undiscoverable.  

This PR changes the default state for the tree view to open, which
should significantly help with discoverability.

An alternative could be to reserve more horizontal space, as a typical
accordion panel would look (eg. VS Code), eg.

![image](https://github.com/go-gitea/gitea/assets/12700993/505ea40c-42b1-4111-b306-48e51e8e2130)
pull/24257/merge
Kyle D 1 year ago committed by GitHub
parent
commit
72eedfb915
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 3
      templates/repo/diff/box.tmpl
  2. 3
      web_src/js/components/DiffFileTree.vue

3
templates/repo/diff/box.tmpl

@ -21,7 +21,8 @@ @@ -21,7 +21,8 @@
{{svg "octicon-sidebar-expand" 20 "icon gt-hidden"}}
</button>
<script>
const diffTreeVisible = localStorage?.getItem('diff_file_tree_visible') === 'true';
// Default to true if unset
const diffTreeVisible = localStorage?.getItem('diff_file_tree_visible') !== 'false';
const diffTreeBtn = document.querySelector('.diff-toggle-file-tree-button');
const diffTreeIcon = `.octicon-sidebar-${diffTreeVisible ? 'expand' : 'collapse'}`;
diffTreeBtn.querySelector(diffTreeIcon).classList.remove('gt-hidden');

3
web_src/js/components/DiffFileTree.vue

@ -89,7 +89,8 @@ export default { @@ -89,7 +89,8 @@ export default {
}
},
mounted() {
this.store.fileTreeIsVisible = localStorage.getItem(LOCAL_STORAGE_KEY) === 'true';
// Default to true if unset
this.store.fileTreeIsVisible = localStorage.getItem(LOCAL_STORAGE_KEY) !== 'false';
document.querySelector('.diff-toggle-file-tree-button').addEventListener('click', this.toggleVisibility);

this.hashChangeListener = () => {

Loading…
Cancel
Save