1 files changed, 7 insertions, 10 deletions
diff --git a/web_src/js/features/pull-view-file.ts b/web_src/js/features/pull-view-file.ts
index 36fe4bc4df..1124886238 100644
--- a/web_src/js/features/pull-view-file.ts
+++ b/web_src/js/features/pull-view-file.ts
@@ -1,4 +1,4 @@
-import {diffTreeStore} from '../modules/stores.ts';
+import {diffTreeStore, diffTreeStoreSetViewed} from '../modules/diff-file.ts';
 import {setFileFolding} from './file-fold.ts';
 import {POST} from '../modules/fetch.ts';
 
@@ -38,7 +38,7 @@ export function initViewedCheckboxListenerFor() {
 
     // The checkbox consists of a div containing the real checkbox with its label and the CSRF token,
     // hence the actual checkbox first has to be found
-    const checkbox = form.querySelector('input[type=checkbox]');
+    const checkbox = form.querySelector<HTMLInputElement>('input[type=checkbox]');
     checkbox.addEventListener('input', function() {
       // Mark the file as viewed visually - will especially change the background
       if (this.checked) {
@@ -58,14 +58,11 @@ export function initViewedCheckboxListenerFor() {
 
       const fileName = checkbox.getAttribute('name');
 
-      // check if the file is in our difftreestore and if we find it -> change the IsViewed status
-      const fileInPageData = diffTreeStore().files.find((x) => x.Name === fileName);
-      if (fileInPageData) {
-        fileInPageData.IsViewed = this.checked;
-      }
+      // check if the file is in our diffTreeStore and if we find it -> change the IsViewed status
+      diffTreeStoreSetViewed(diffTreeStore(), fileName, this.checked);
 
       // Unfortunately, actual forms cause too many problems, hence another approach is needed
-      const files = {};
+      const files: Record<string, boolean> = {};
       files[fileName] = this.checked;
       const data: Record<string, any> = {files};
       const headCommitSHA = form.getAttribute('data-headcommit');
@@ -82,13 +79,13 @@ export function initViewedCheckboxListenerFor() {
 export function initExpandAndCollapseFilesButton() {
   // expand btn
   document.querySelector(expandFilesBtnSelector)?.addEventListener('click', () => {
-    for (const box of document.querySelectorAll('.file-content[data-folded="true"]')) {
+    for (const box of document.querySelectorAll<HTMLElement>('.file-content[data-folded="true"]')) {
       setFileFolding(box, box.querySelector('.fold-file'), false);
     }
   });
   // collapse btn, need to exclude the div of “show more”
   document.querySelector(collapseFilesBtnSelector)?.addEventListener('click', () => {
-    for (const box of document.querySelectorAll('.file-content:not([data-folded="true"])')) {
+    for (const box of document.querySelectorAll<HTMLElement>('.file-content:not([data-folded="true"])')) {
       if (box.getAttribute('id') === 'diff-incomplete') continue;
       setFileFolding(box, box.querySelector('.fold-file'), true);
     }