opened file change detection now useable on all note types

src/public/app/widgets/note_update_status.js

@@ -0,0 +1,64 @@
+import TabAwareWidget from "./tab_aware_widget.js";
+import server from "../services/server.js";
+import fileWatcher from "../services/file_watcher.js";
+
+const TPL = `
+<div class="dropdown note-update-status-widget alert alert-warning">
+    <style>
+        .note-update-status-widget {
+            margin: 10px;
+        }
+    </style>
+    
+    <p>File <code class="file-path"></code> has been last modified on <span class="file-last-modified"></span>.</p> 
+        
+    <div style="display: flex; flex-direction: row; justify-content: space-evenly;">
+        <button class="btn btn-sm file-upload-button">Upload modified file</button>
+        
+        <button class="btn btn-sm ignore-this-change-button">Ignore this change</button>
+    </div>
+</div>`;
+
+export default class NoteUpdateStatusWidget extends TabAwareWidget {
+    isEnabled() {
+        return super.isEnabled()
+            && !!fileWatcher.getFileModificationStatus(this.noteId);
+    }
+
+    doRender() {
+        this.$widget = $(TPL);
+        this.overflowing();
+
+        this.$filePath = this.$widget.find(".file-path");
+        this.$fileLastModified = this.$widget.find(".file-last-modified");
+        this.$fileUploadButton = this.$widget.find(".file-upload-button");
+
+        this.$fileUploadButton.on("click", async () => {
+            await server.post(`notes/${this.noteId}/upload-modified-file`, {
+                filePath: this.$filePath.text()
+            });
+
+            fileWatcher.fileModificationUploaded(this.noteId);
+            this.refresh();
+        });
+
+        this.$ignoreThisChangeButton = this.$widget.find(".ignore-this-change-button");
+        this.$ignoreThisChangeButton.on('click', () => {
+            fileWatcher.ignoreModification(this.noteId);
+            this.refresh();
+        });
+    }
+
+    refreshWithNote(note) {
+        const status = fileWatcher.getFileModificationStatus(note.noteId);
+
+        this.$filePath.text(status.filePath);
+        this.$fileLastModified.text(dayjs.unix(status.lastModifiedMs / 1000).format("HH:mm:ss"));
+    }
+
+    openedFileUpdatedEvent(data) {
+        if (data.noteId === this.noteId) {
+            this.refresh();
+        }
+    }
+}