From 90fdd6240630dc8739ebfa28f58fd544cc935c3a Mon Sep 17 00:00:00 2001
From: MattIPv4 <me@mattcowley.co.uk>
Date: Tue, 27 Jul 2021 10:23:38 +0100
Subject: [PATCH] Pass full rendered file path into diff

---
 src/nginxconfig/templates/app.vue | 33 ++++++++++++++++++++-----------
 1 file changed, 22 insertions(+), 11 deletions(-)

diff --git a/src/nginxconfig/templates/app.vue b/src/nginxconfig/templates/app.vue
index 561dcb2..0321455 100644
--- a/src/nginxconfig/templates/app.vue
+++ b/src/nginxconfig/templates/app.vue
@@ -193,6 +193,9 @@ THE SOFTWARE.
             confFiles() {
                 return generators(this.$data.domains.filter(d => d !== null), this.$data.global);
             },
+            fullConfFiles() {
+                return this.addConfigDirectory(this.confFiles);
+            },
             lang: {
                 get() {
                     return this.$data.global.app.lang.value;
@@ -212,7 +215,7 @@ THE SOFTWARE.
             },
         },
         watch: {
-            confFiles(newConf, oldConf) {
+            fullConfFiles(newConf, oldConf) {
                 if (this.$data.confWatcherWaiting) return;
 
                 // Set that we're waiting for changes to stop
@@ -318,22 +321,28 @@ THE SOFTWARE.
             },
             checkChange(oldConf) {
                 // If nothing has changed for a tick, we can use the config files
-                if (oldConf === this.confFiles) {
+                if (oldConf === this.fullConfFiles) {
                     // If this is the initial data load on app start, run the diff logic
                     // but with previous as this so that we don't highlight any changes
                     if (!this.$data.ready) {
-                        this.$data.confFilesPrevious = this.confFiles;
+                        this.$data.confFilesPrevious = this.fullConfFiles;
                         this.$nextTick(() => { this.$data.ready = true; });
                     }
 
                     // Do the diff!
-                    this.updateDiff(this.confFiles, this.$data.confFilesPrevious);
+                    this.updateDiff(this.fullConfFiles, this.$data.confFilesPrevious);
                     return;
                 }
 
                 // Check next tick to see if anything has changed again
                 this.$nextTick(() => this.checkChange(this.confFiles));
             },
+            addConfigDirectory(conf) {
+                return Object.entries(conf).reduce((obj, [ file, content ]) => ({
+                    ...obj,
+                    [`${this.$data.global.nginx.nginxConfigDirectory.computed}/${file}`]: content,
+                }), {});
+            },
             updateDiff(newConf, oldConf) {
                 try {
                     // Calculate the diff & highlight after render
@@ -341,14 +350,14 @@ THE SOFTWARE.
                         highlightFunction: value => `<mark>${value}</mark>`,
                     });
                     this.$data.confFilesOutput = Object.entries(diffConf).map(([ file, { name, content } ]) => {
+                        console.log(file, name);
                         const diffName = name.filter(x => !x.removed).map(x => x.value).join('');
-                        const confName = `${escape(this.$data.global.nginx.nginxConfigDirectory.computed)}/${diffName}`;
                         const diffContent = content.filter(x => !x.removed).map(x => x.value).join('');
 
                         return [
-                            confName,
+                            diffName,
                             diffContent,
-                            `${sha2_256(confName)}-${sha2_256(diffContent)}`,
+                            `${sha2_256(diffName)}-${sha2_256(diffContent)}`,
                             file,
                         ];
                     });
@@ -356,11 +365,13 @@ THE SOFTWARE.
                     // If diff generation goes wrong, don't show any diff
                     console.error(e);
                     this.$data.confFilesOutput = Object.entries(newConf).map(([ name, content ]) => {
-                        const confName = `${escape(this.$data.global.nginx.nginxConfigDirectory.computed)}/${name}`;
+                        const safeName = escape(name);
+                        const safeContent = escape(content);
+
                         return [
-                            confName,
-                            content,
-                            `${sha2_256(confName)}-${sha2_256(content)}`,
+                            safeName,
+                            safeContent,
+                            `${sha2_256(safeName)}-${sha2_256(safeContent)}`,
                             name,
                         ];
                     });