feat: Show object keys alphabetically rather than in jsonb style [DHI…

…S2-7523] (#16)

webapp/js/components/utils/JSONEditor.js

@@ -5,6 +5,7 @@ import * as dialogTypes from 'constants/dialogTypes';
 import {jsonEditorChangeMode} from 'actions/jsonEditorActions';
 import {openDialog} from 'actions/dialogActions';
 import '../../../style/vendor/jsoneditor.css';
+import { sortObjectKeys } from '../../utils/utils';
 
 export class JSONEditor extends Component {
 
@@ -37,8 +38,12 @@ export class JSONEditor extends Component {
         }
     }
 
+    updateValue(value) {
+        this.editor.set(sortObjectKeys(value))
+    }
+
     componentWillUpdate(nextProps) {
-        this.editor.set(nextProps.value);
+        this.updateValue(nextProps.value);
         this.handleJsonEditor(nextProps);
     }
 
@@ -119,7 +124,7 @@ export class JSONEditor extends Component {
             };
             this.editor = new JSEditor(this.editorContainer, opts);
             this.removeBuiltInMenu();
-            this.editor.set(this.props.value);
+            this.updateValue(this.props.value);
         }
     }
 

webapp/js/constants/apiUrls.js

@@ -1 +1 @@
-export const API_URL = 'https://play.dhis2.org/test/api';
+export const API_URL = 'https://debug.dhis2.org/dev/api';

webapp/js/utils/utils.js

@@ -12,4 +12,19 @@ export function debounce(func, wait, immediate) {
         timeout = setTimeout(later, wait);
         if (callNow) func.apply(context, args);
     };
-};
+};
+
+export const sortObjectKeys = obj => {
+    if (!obj || typeof obj !== 'object') {
+        return obj
+    }
+    if (Array.isArray(obj)) {
+        return obj.map(sortObjectKeys)
+    }
+    return Object.keys(obj)
+        .sort()
+        .reduce((res, key) => {
+            res[key] = sortObjectKeys(obj[key])
+            return res
+        }, {})
+}