|
1 | 1 | <script lang="ts" setup>
|
2 |
| -import DiffFileTreeItem, {type Item} from './DiffFileTreeItem.vue'; |
3 |
| -import {loadMoreFiles} from '../features/repo-diff.ts'; |
| 2 | +import DiffFileTreeItem from './DiffFileTreeItem.vue'; |
4 | 3 | import {toggleElem} from '../utils/dom.ts';
|
5 | 4 | import {diffTreeStore} from '../modules/stores.ts';
|
6 | 5 | import {setFileFolding} from '../features/file-fold.ts';
|
7 | 6 | import {computed, onMounted, onUnmounted} from 'vue';
|
| 7 | +import {pathListToTree, mergeChildIfOnlyOneDir} from './file_tree.ts'; |
8 | 8 |
|
9 | 9 | const LOCAL_STORAGE_KEY = 'diff_file_tree_visible';
|
10 | 10 |
|
11 | 11 | const store = diffTreeStore();
|
12 | 12 |
|
13 | 13 | const fileTree = computed(() => {
|
14 |
| - const result: Array<Item> = []; |
15 |
| - for (const file of store.files) { |
16 |
| - // Split file into directories |
17 |
| - const splits = file.Name.split('/'); |
18 |
| - let index = 0; |
19 |
| - let parent = null; |
20 |
| - let isFile = false; |
21 |
| - for (const split of splits) { |
22 |
| - index += 1; |
23 |
| - // reached the end |
24 |
| - if (index === splits.length) { |
25 |
| - isFile = true; |
26 |
| - } |
27 |
| - let newParent: Item = { |
28 |
| - name: split, |
29 |
| - children: [], |
30 |
| - isFile, |
31 |
| - }; |
32 |
| -
|
33 |
| - if (isFile === true) { |
34 |
| - newParent.file = file; |
35 |
| - } |
36 |
| -
|
37 |
| - if (parent) { |
38 |
| - // check if the folder already exists |
39 |
| - const existingFolder = parent.children.find( |
40 |
| - (x) => x.name === split, |
41 |
| - ); |
42 |
| - if (existingFolder) { |
43 |
| - newParent = existingFolder; |
44 |
| - } else { |
45 |
| - parent.children.push(newParent); |
46 |
| - } |
47 |
| - } else { |
48 |
| - const existingFolder = result.find((x) => x.name === split); |
49 |
| - if (existingFolder) { |
50 |
| - newParent = existingFolder; |
51 |
| - } else { |
52 |
| - result.push(newParent); |
53 |
| - } |
54 |
| - } |
55 |
| - parent = newParent; |
56 |
| - } |
57 |
| - } |
58 |
| - const mergeChildIfOnlyOneDir = (entries: Array<Record<string, any>>) => { |
59 |
| - for (const entry of entries) { |
60 |
| - if (entry.children) { |
61 |
| - mergeChildIfOnlyOneDir(entry.children); |
62 |
| - } |
63 |
| - if (entry.children.length === 1 && entry.children[0].isFile === false) { |
64 |
| - // Merge it to the parent |
65 |
| - entry.name = `${entry.name}/${entry.children[0].name}`; |
66 |
| - entry.children = entry.children[0].children; |
67 |
| - } |
68 |
| - } |
69 |
| - }; |
70 |
| - // Merge folders with just a folder as children in order to |
71 |
| - // reduce the depth of our tree. |
72 |
| - mergeChildIfOnlyOneDir(result); |
| 14 | + const result = pathListToTree(store.files); |
| 15 | + mergeChildIfOnlyOneDir(result); // mutation |
73 | 16 | return result;
|
74 | 17 | });
|
75 | 18 |
|
@@ -121,19 +64,12 @@ function updateState(visible: boolean) {
|
121 | 64 | toggleElem(toShow, !visible);
|
122 | 65 | toggleElem(toHide, visible);
|
123 | 66 | }
|
124 |
| -
|
125 |
| -function loadMoreData() { |
126 |
| - loadMoreFiles(store.linkLoadMore); |
127 |
| -} |
128 | 67 | </script>
|
129 | 68 |
|
130 | 69 | <template>
|
131 | 70 | <div v-if="store.fileTreeIsVisible" class="diff-file-tree-items">
|
132 | 71 | <!-- only render the tree if we're visible. in many cases this is something that doesn't change very often -->
|
133 | 72 | <DiffFileTreeItem v-for="item in fileTree" :key="item.name" :item="item"/>
|
134 |
| - <div v-if="store.isIncomplete" class="tw-pt-1"> |
135 |
| - <a :class="['ui', 'basic', 'tiny', 'button', store.isLoadingNewData ? 'disabled' : '']" @click.stop="loadMoreData">{{ store.showMoreMessage }}</a> |
136 |
| - </div> |
137 | 73 | </div>
|
138 | 74 | </template>
|
139 | 75 |
|
|
0 commit comments