From f692fa5aaa1f8b1613ce535cf3239542abec63ba Mon Sep 17 00:00:00 2001
From: Boaz Poolman <boaz_skater@hotmail.com>
Date: Sat, 27 Mar 2021 00:54:41 +0100
Subject: [PATCH] Show correct diff in frontend

---
 admin/src/components/ActionButtons/index.js |  4 ++--
 admin/src/components/ConfigList/index.js    |  2 +-
 controllers/config.js                       |  3 ++-
 utils/getObjectDiff.js                      | 12 +++++++++++-
 4 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/admin/src/components/ActionButtons/index.js b/admin/src/components/ActionButtons/index.js
index f570552..9f6dac3 100644
--- a/admin/src/components/ActionButtons/index.js
+++ b/admin/src/components/ActionButtons/index.js
@@ -23,8 +23,8 @@ const ActionButtons = ({ diff }) => {
 
   return (
     <ActionButtonsStyling>
-      <Button disabled={isEmpty(diff.fileConfig)} color="primary" label="Import" onClick={() => openModal('import')} />
-      <Button disabled={isEmpty(diff.fileConfig)} color="primary" label="Export" onClick={() => openModal('export')} />
+      <Button disabled={isEmpty(diff.diff)} color="primary" label="Import" onClick={() => openModal('import')} />
+      <Button disabled={isEmpty(diff.diff)} color="primary" label="Export" onClick={() => openModal('export')} />
       {!isEmpty(diff.diff) && (
         <h4 style={{ display: 'inline' }}>{Object.keys(diff.diff).length} {Object.keys(diff.diff).length === 1 ? "config change" : "config changes"}</h4>
       )}
diff --git a/admin/src/components/ConfigList/index.js b/admin/src/components/ConfigList/index.js
index f2ed7c2..12bb344 100644
--- a/admin/src/components/ConfigList/index.js
+++ b/admin/src/components/ConfigList/index.js
@@ -33,7 +33,7 @@ const ConfigList = ({ diff, isLoading }) => {
     }
 
     let formattedRows = [];
-    Object.keys(diff.fileConfig).map((configName) => {
+    Object.keys(diff.diff).map((configName) => {
       const type = configName.split('.')[0]; // Grab the first part of the filename.
       const name = configName.split(/\.(.+)/)[1]; // Grab the rest of the filename minus the file extension.
 
diff --git a/controllers/config.js b/controllers/config.js
index e5d212a..863b1d8 100644
--- a/controllers/config.js
+++ b/controllers/config.js
@@ -70,7 +70,8 @@ module.exports = {
     const fileConfig = await strapi.plugins['config-sync'].services.main.getAllConfigFromFiles();
     const databaseConfig = await strapi.plugins['config-sync'].services.main.getAllConfigFromDatabase();
 
-    const diff = difference(fileConfig, databaseConfig);
+    const diff = difference(databaseConfig, fileConfig);
+
     formattedDiff.diff = diff;
 
     Object.keys(diff).map((changedConfigName) => {
diff --git a/utils/getObjectDiff.js b/utils/getObjectDiff.js
index ca101e9..7176ac2 100644
--- a/utils/getObjectDiff.js
+++ b/utils/getObjectDiff.js
@@ -10,13 +10,23 @@ const { transform, isEqual, isArray, isObject } = require('lodash');
 const difference = (origObj, newObj) => {
   function changes(newObj, origObj) {
     let arrayIndexCounter = 0
-    return transform(newObj, function (result, value, key) {
+
+    const newObjChange = transform(newObj, function (result, value, key) {
       if (!isEqual(value, origObj[key])) {
         let resultKey = isArray(origObj) ? arrayIndexCounter++ : key
         result[resultKey] = (isObject(value) && isObject(origObj[key])) ? changes(value, origObj[key]) : value
       }
+    });
+    const origObjChange = transform(origObj, function (result, value, key) {
+      if (!isEqual(value, newObj[key])) {
+        let resultKey = isArray(newObj) ? arrayIndexCounter++ : key
+        result[resultKey] = (isObject(value) && isObject(newObj[key])) ? changes(value, newObj[key]) : value
+      }
     })
+
+    return Object.assign(newObjChange, origObjChange);
   }
+  
   return changes(newObj, origObj)
 }