Expand selected file when clicking file tree (#24041)
Auto expand the selected file when clicking the file item of the file tree. This is consistent with Github's behavior. https://user-images.githubusercontent.com/33891828/231048124-61f180af-adba-42d7-9ffa-626e1de04aed.mov
This commit is contained in:
parent
97176754be
commit
e03e827dcb
1 changed files with 10 additions and 0 deletions
|
@ -18,6 +18,7 @@ import DiffFileTreeItem from './DiffFileTreeItem.vue';
|
||||||
import {doLoadMoreFiles} from '../features/repo-diff.js';
|
import {doLoadMoreFiles} from '../features/repo-diff.js';
|
||||||
import {toggleElem} from '../utils/dom.js';
|
import {toggleElem} from '../utils/dom.js';
|
||||||
import {DiffTreeStore} from '../modules/stores.js';
|
import {DiffTreeStore} from '../modules/stores.js';
|
||||||
|
import {setFileFolding} from '../features/file-fold.js';
|
||||||
|
|
||||||
const {pageData} = window.config;
|
const {pageData} = window.config;
|
||||||
const LOCAL_STORAGE_KEY = 'diff_file_tree_visible';
|
const LOCAL_STORAGE_KEY = 'diff_file_tree_visible';
|
||||||
|
@ -104,6 +105,7 @@ export default {
|
||||||
|
|
||||||
this.hashChangeListener = () => {
|
this.hashChangeListener = () => {
|
||||||
this.store.selectedItem = window.location.hash;
|
this.store.selectedItem = window.location.hash;
|
||||||
|
this.expandSelectedFile();
|
||||||
};
|
};
|
||||||
this.hashChangeListener();
|
this.hashChangeListener();
|
||||||
window.addEventListener('hashchange', this.hashChangeListener);
|
window.addEventListener('hashchange', this.hashChangeListener);
|
||||||
|
@ -113,6 +115,14 @@ export default {
|
||||||
window.removeEventListener('hashchange', this.hashChangeListener);
|
window.removeEventListener('hashchange', this.hashChangeListener);
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
expandSelectedFile() {
|
||||||
|
// expand file if the selected file is folded
|
||||||
|
if (this.store.selectedItem) {
|
||||||
|
const box = document.querySelector(this.store.selectedItem);
|
||||||
|
const folded = box?.getAttribute('data-folded') === 'true';
|
||||||
|
if (folded) setFileFolding(box, box.querySelector('.fold-file'), false);
|
||||||
|
}
|
||||||
|
},
|
||||||
toggleVisibility() {
|
toggleVisibility() {
|
||||||
this.updateVisibility(!this.fileTreeIsVisible);
|
this.updateVisibility(!this.fileTreeIsVisible);
|
||||||
},
|
},
|
||||||
|
|
Loading…
Reference in a new issue