From 6fa3f030c3eeb2b74d4276b4a13ef5b8658c5336 Mon Sep 17 00:00:00 2001
From: Amir Abbas <am_882011@live.com>
Date: Thu, 22 Aug 2024 11:09:07 +0330
Subject: [PATCH] Show line by line diff of embedded template

---
 command/job_plan.go                             |  7 ++++++-
 ui/app/components/job-diff-template.js          | 17 +++++++++++++++++
 ui/app/styles/components/job-diff.scss          |  4 ++++
 .../components/job-diff-fields-and-objects.hbs  |  6 +++++-
 .../templates/components/job-diff-template.hbs  |  6 ++++++
 ui/package.json                                 |  1 +
 ui/yarn.lock                                    | 12 ++++++++++++
 7 files changed, 51 insertions(+), 2 deletions(-)
 create mode 100644 ui/app/components/job-diff-template.js
 create mode 100644 ui/app/templates/components/job-diff-template.hbs

diff --git a/command/job_plan.go b/command/job_plan.go
index 3fbf346c74f..5a0a31c3ffd 100644
--- a/command/job_plan.go
+++ b/command/job_plan.go
@@ -10,6 +10,7 @@ import (
 	"strings"
 	"time"
 
+	"github.com/google/go-cmp/cmp"
 	"github.com/hashicorp/nomad/api"
 	"github.com/hashicorp/nomad/helper/pointer"
 	"github.com/hashicorp/nomad/scheduler"
@@ -649,7 +650,11 @@ func formatFieldDiff(diff *api.FieldDiff, startPrefix, keyPrefix, valuePrefix in
 	case "Deleted":
 		out += fmt.Sprintf("%q", diff.Old)
 	case "Edited":
-		out += fmt.Sprintf("%q => %q", diff.Old, diff.New)
+		if diff.Name == "EmbeddedTmpl" {
+			out += cmp.Diff(diff.Old, diff.New)
+		} else {
+			out += fmt.Sprintf("%q => %q", diff.Old, diff.New)
+		}
 	default:
 		out += fmt.Sprintf("%q", diff.New)
 	}
diff --git a/ui/app/components/job-diff-template.js b/ui/app/components/job-diff-template.js
new file mode 100644
index 00000000000..37b2374b19b
--- /dev/null
+++ b/ui/app/components/job-diff-template.js
@@ -0,0 +1,17 @@
+/**
+ * Copyright (c) HashiCorp, Inc.
+ * SPDX-License-Identifier: BUSL-1.1
+ */
+
+import Component from '@ember/component';
+import { tagName } from '@ember-decorators/component';
+import classic from 'ember-classic-decorator';
+import LineDiff from 'line-diff';
+
+@classic
+@tagName('')
+export default class JobDiffTemplate extends Component {
+  get diff() {
+    return new LineDiff(this.field.Old, this.field.New).toString();
+  }
+}
diff --git a/ui/app/styles/components/job-diff.scss b/ui/app/styles/components/job-diff.scss
index f6bf6604f7d..5f0624f177a 100644
--- a/ui/app/styles/components/job-diff.scss
+++ b/ui/app/styles/components/job-diff.scss
@@ -76,4 +76,8 @@
       text-indent: 1ch;
     }
   }
+
+  .diff-section-table-pre-wrap {
+    white-space: pre-wrap;
+  }
 }
diff --git a/ui/app/templates/components/job-diff-fields-and-objects.hbs b/ui/app/templates/components/job-diff-fields-and-objects.hbs
index fc86bc5ec13..bfa521fb8bb 100644
--- a/ui/app/templates/components/job-diff-fields-and-objects.hbs
+++ b/ui/app/templates/components/job-diff-fields-and-objects.hbs
@@ -29,7 +29,11 @@
       {{else if (eq (lowercase field.Type) "deleted")}}
         <span class="diff-section-table-cell diff-section-change">"{{field.Old}}"</span>
       {{else if (eq (lowercase field.Type) "edited")}}
-        <span class="diff-section-table-cell diff-section-change">"{{field.Old}}" => "{{field.New}}"</span>
+        {{#if (eq (lowercase field.Name) "embeddedtmpl")}}
+        <JobDiffTemplate @field={{field}} />
+        {{else}}
+          <span class="diff-section-table-cell diff-section-change">"{{field.Old}}" => "{{field.New}}"</span>
+        {{/if}}
       {{else}}
         <span class="diff-section-table-cell">"{{field.New}}"</span>
       {{/if}}
diff --git a/ui/app/templates/components/job-diff-template.hbs b/ui/app/templates/components/job-diff-template.hbs
new file mode 100644
index 00000000000..482dcfde4ce
--- /dev/null
+++ b/ui/app/templates/components/job-diff-template.hbs
@@ -0,0 +1,6 @@
+{{!
+  Copyright (c) HashiCorp, Inc.
+  SPDX-License-Identifier: BUSL-1.1
+~}}
+
+<div class="diff-section-table-cell diff-section-change diff-section-table-pre-wrap">{{this.diff}}</div>
diff --git a/ui/package.json b/ui/package.json
index 7bb6f6cafae..19186bad997 100644
--- a/ui/package.json
+++ b/ui/package.json
@@ -174,6 +174,7 @@
     "curved-arrows": "^0.1.0",
     "d3": "^7.3.0",
     "dompurify": "^3.1.3",
+    "line-diff": "^2.1.1",
     "lru_map": "^0.4.1",
     "marked": "^12.0.2",
     "no-case": "^3.0.4",
diff --git a/ui/yarn.lock b/ui/yarn.lock
index e0ce1a57336..79808aa5508 100644
--- a/ui/yarn.lock
+++ b/ui/yarn.lock
@@ -9501,6 +9501,11 @@ leek@0.0.24:
     lodash.assign "^3.2.0"
     rsvp "^3.0.21"
 
+levdist@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/levdist/-/levdist-1.0.0.tgz#91d7a3044964f2ccc421a0477cac827fe75c5718"
+  integrity sha512-YguwC2spb0pqpJM3a5OsBhih/GG2ZHoaSHnmBqhEI7997a36buhqcRTegEjozHxyxByIwLpZHZTVYMThq+Zd3g==
+
 levn@^0.4.1:
   version "0.4.1"
   resolved "https://registry.yarnpkg.com/levn/-/levn-0.4.1.tgz#ae4562c007473b932a6200d403268dd2fffc6ade"
@@ -9517,6 +9522,13 @@ line-column@^1.0.2:
     isarray "^1.0.0"
     isobject "^2.0.0"
 
+line-diff@^2.1.1:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/line-diff/-/line-diff-2.1.1.tgz#a389799b931375a3b1e764964ad0b0b3ce60d6f6"
+  integrity sha512-vswdynAI5AMPJacOo2o+JJ4caDJbnY2NEqms4MhMW0NJbjh3skP/brpVTAgBxrg55NRZ2Vtw88ef18hnagIpYQ==
+  dependencies:
+    levdist "^1.0.0"
+
 lines-and-columns@^1.1.6:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/lines-and-columns/-/lines-and-columns-1.2.4.tgz#eca284f75d2965079309dc0ad9255abb2ebc1632"