From 3ecc5ab9d5c92a465fe335b2a5f23bc478e7cbd9 Mon Sep 17 00:00:00 2001
From: Ermal Kaleci <ermalkaleci@gmail.com>
Date: Tue, 10 Jan 2023 19:49:46 +0100
Subject: [PATCH 1/4] skip text diff

---
 src/utils/decoder.ts |  5 ++++-
 template/diff.html   | 26 ++++++++------------------
 2 files changed, 12 insertions(+), 19 deletions(-)

diff --git a/src/utils/decoder.ts b/src/utils/decoder.ts
index 9c37763d..5454aa7c 100644
--- a/src/utils/decoder.ts
+++ b/src/utils/decoder.ts
@@ -7,7 +7,10 @@ import { create } from 'jsondiffpatch'
 import { hexToU8a, u8aToHex } from '@polkadot/util'
 import _ from 'lodash'
 
-const diffPatcher = create({ array: { detectMove: false } })
+const diffPatcher = create({
+  array: { detectMove: false },
+  textDiff: { minLength: Number.MAX_VALUE }, // skip text diff
+})
 
 const cache: Record<HexString, StorageEntry> = {}
 
diff --git a/template/diff.html b/template/diff.html
index b175a518..e0a70f26 100644
--- a/template/diff.html
+++ b/template/diff.html
@@ -30,29 +30,29 @@
 			}
 
 			li:has(> span > span.diffWrap > span.diffRemove) > label {
-				color: #db2703 !important;
+				color: red !important;
 				text-decoration: line-through;
 				text-decoration-thickness: 1px;
 			}
 
 			.diffAdd {
-				color: #64c83c;
+				color: darkseagreen;
 			}
 
 			.diffRemove {
 				text-decoration: line-through;
 				text-decoration-thickness: 1px;
-				color: #db2703;
+				color: red;
 			}
 
 			.diffUpdateFrom {
 				text-decoration: line-through;
 				text-decoration-thickness: 1px;
-				color: #db2703;
+				color: red;
 			}
 
 			.diffUpdateTo {
-				color: #64c83c;
+				color: darkseagreen;
 			}
 
 			.diffUpdateArrow {
@@ -112,8 +112,8 @@
 						const oldValue = parseInt(value[0].replace(/,/g, ''))
 						const newValue = parseInt(value[1].replace(/,/g, ''))
 						if (oldValue > 0 && newValue > 0) {
-							const delta = newValue - oldValue
-							return (<span className="delta" >{delta > 0 ? '+' : ''}{delta}</span>)
+							const delta = Number(newValue - oldValue)
+							return (<span className="delta" >{delta > 0 ? '+' : ''}{delta.toLocaleString()}</span>)
 						}
 					}
 				}
@@ -167,9 +167,7 @@
 			};
 
 			function prepareDelta(value) {
-				if (!value) return value;
-
-				if (value._t === 'a') {
+				if (value && value._t === 'a') {
 					const res = {};
 					for (const key in value) {
 						if (key !== '_t') {
@@ -183,14 +181,6 @@
 						}
 					}
 					return res;
-				} else {
-					if (Array.isArray(value) && value.length === 3 && typeof value[0] === 'string' && value[0].startsWith('@@')) {
-						const [left, right] = value[0].split("@@").filter(x => x.length > 0)
-						const items = right.split("\n").slice(1).filter(x => x.length > 0)
-						const oldValue = items.filter(x => x[0] !== '+').map(x => x.slice(1)).join('')
-						const newValue = items.filter(x => x[0] !== '-').map(x => x.slice(1)).join('')
-						return [oldValue, newValue]
-					}
 				}
 				return value;
 			}

From 91a478546816bf7796d290f92038d7e4692cfcdc Mon Sep 17 00:00:00 2001
From: Ermal Kaleci <ermalkaleci@gmail.com>
Date: Tue, 10 Jan 2023 20:42:03 +0100
Subject: [PATCH 2/4] update template

---
 template/diff.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/template/diff.html b/template/diff.html
index e0a70f26..7dcfb2d4 100644
--- a/template/diff.html
+++ b/template/diff.html
@@ -161,7 +161,7 @@
 
 				return (
 					<span {...styling('diffWrap')}>
-						{renderSpan('unchanged', stringifyAndShrink(raw))}
+						{renderSpan('unchanged', stringifyAndShrink(value))}
 					</span>
 				);
 			};

From 7ec052e37db58bb8202ecf53cdb2f5e7712a7df5 Mon Sep 17 00:00:00 2001
From: Ermal Kaleci <ermalkaleci@gmail.com>
Date: Tue, 10 Jan 2023 22:15:05 +0100
Subject: [PATCH 3/4] sort object by keys

---
 template/diff.html | 1 +
 1 file changed, 1 insertion(+)

diff --git a/template/diff.html b/template/diff.html
index 7dcfb2d4..41e91325 100644
--- a/template/diff.html
+++ b/template/diff.html
@@ -230,6 +230,7 @@
 								postprocessValue={prepareDelta}
 								isCustomNode={Array.isArray}
 								shouldExpandNodeInitially={expandFirstLevel}
+								sortObjectKeys
 								hideRoot
 							/>
 						</div>

From 0d7bb4b1079400bb8cce5b6f42265699afcdd383 Mon Sep 17 00:00:00 2001
From: Ermal Kaleci <ermalkaleci@gmail.com>
Date: Tue, 10 Jan 2023 22:23:16 +0100
Subject: [PATCH 4/4] Revert "sort object by keys"

This reverts commit 7ec052e37db58bb8202ecf53cdb2f5e7712a7df5.
---
 template/diff.html | 1 -
 1 file changed, 1 deletion(-)

diff --git a/template/diff.html b/template/diff.html
index 41e91325..7dcfb2d4 100644
--- a/template/diff.html
+++ b/template/diff.html
@@ -230,7 +230,6 @@
 								postprocessValue={prepareDelta}
 								isCustomNode={Array.isArray}
 								shouldExpandNodeInitially={expandFirstLevel}
-								sortObjectKeys
 								hideRoot
 							/>
 						</div>