loading up the forgejo repo on tangled to test page performance
Highlight viewed files differently in the PR filetree (#24956)
fixes #24566
---------
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
authored by
sebastian-sauer
wxiaoguang
and committed by
GitHub
77e449f0
083818cb
+16
-3
+1
-1
templates/repo/diff/box.tmpl
+1
-1
templates/repo/diff/box.tmpl
···
49
49
</div>
50
50
</div>
51
51
<script id="diff-data-script" type="module">
52
-
const diffDataFiles = [{{range $i, $file := .Diff.Files}}{Name:"{{$file.Name}}",NameHash:"{{$file.NameHash}}",Type:{{$file.Type}},IsBin:{{$file.IsBin}},Addition:{{$file.Addition}},Deletion:{{$file.Deletion}}},{{end}}];
52
+
const diffDataFiles = [{{range $i, $file := .Diff.Files}}{Name:"{{$file.Name}}",NameHash:"{{$file.NameHash}}",Type:{{$file.Type}},IsBin:{{$file.IsBin}},Addition:{{$file.Addition}},Deletion:{{$file.Deletion}},IsViewed:{{$file.IsViewed}}},{{end}}];
53
53
const diffData = {
54
54
isIncomplete: {{.Diff.IsIncomplete}},
55
55
tooManyFilesMessage: "{{$.locale.Tr "repo.diff.too_many_files"}}",
+5
-1
web_src/js/components/DiffFileTreeItem.vue
+5
-1
web_src/js/components/DiffFileTreeItem.vue
···
10
10
/>
11
11
<a
12
12
v-if="item.isFile"
13
-
class="file gt-ellipsis"
13
+
:class="['file gt-ellipsis', {'viewed': item.file.IsViewed}]"
14
14
:href="item.isFile ? '#diff-' + item.file.NameHash : ''"
15
15
>{{ item.name }}</a>
16
16
<SvgIcon
···
147
147
a:hover {
148
148
text-decoration: none;
149
149
color: var(--color-text);
150
+
}
151
+
152
+
a.file.viewed {
153
+
color: var(--color-text-light-3);
150
154
}
151
155
</style>
+10
-1
web_src/js/features/pull-view-file.js
+10
-1
web_src/js/features/pull-view-file.js
···
1
+
import {diffTreeStore} from '../modules/stores.js';
1
2
import {setFileFolding} from './file-fold.js';
2
3
3
4
const {csrfToken, pageData} = window.config;
···
53
54
const hasChangedLabel = form.parentNode.querySelector('.changed-since-last-review');
54
55
hasChangedLabel?.remove();
55
56
57
+
const fileName = checkbox.getAttribute('name');
58
+
59
+
// check if the file is in our difftreestore and if we find it -> change the IsViewed status
60
+
const fileInPageData = diffTreeStore().files.find((x) => x.Name === fileName);
61
+
if (fileInPageData) {
62
+
fileInPageData.IsViewed = this.checked;
63
+
}
64
+
56
65
// Unfortunately, actual forms cause too many problems, hence another approach is needed
57
66
const files = {};
58
-
files[checkbox.getAttribute('name')] = this.checked;
67
+
files[fileName] = this.checked;
59
68
const data = {files};
60
69
const headCommitSHA = form.getAttribute('data-headcommit');
61
70
if (headCommitSHA) data.headCommitSHA = headCommitSHA;