package-lock.json

@@ -35,6 +35,7 @@
         "ethr-did-resolver": "^8.1.2",
         "jdenticon": "^3.2.0",
         "js-generate-password": "^0.1.9",
+        "js-yaml": "^4.1.0",
         "localstorage-slim": "^2.5.0",
         "luxon": "^3.4.3",
         "merkletreejs": "^0.3.10",
@@ -58,6 +59,7 @@
         "web-did-resolver": "^2.0.27"
       },
       "devDependencies": {
+        "@types/js-yaml": "^4.0.9",
         "@types/leaflet": "^1.9.4",
         "@types/ramda": "^0.29.3",
         "@types/three": "^0.155.1",
@@ -8792,6 +8794,12 @@
         "@types/istanbul-lib-report": "*"
       }
     },
+    "node_modules/@types/js-yaml": {
+      "version": "4.0.9",
+      "resolved": "https://registry.npmjs.org/@types/js-yaml/-/js-yaml-4.0.9.tgz",
+      "integrity": "sha512-k4MGaQl5TGo/iipqb2UDG2UwjXziSWkh0uysQelTlJpX1qGlpUZYm8PnO4DxG1qBomtJUdYJ6qR6xdIah10JLg==",
+      "dev": true
+    },
     "node_modules/@types/json-schema": {
       "version": "7.0.13",
       "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.13.tgz",
@@ -11061,8 +11069,7 @@
     "node_modules/argparse": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
-      "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==",
+      "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q=="
-      "devOptional": true
     },
     "node_modules/array-buffer-byte-length": {
       "version": "1.0.0",
@@ -18586,7 +18593,6 @@
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz",
       "integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==",
-      "devOptional": true,
       "dependencies": {
         "argparse": "^2.0.1"
       },

package.json

@@ -35,6 +35,7 @@
     "ethr-did-resolver": "^8.1.2",
     "jdenticon": "^3.2.0",
     "js-generate-password": "^0.1.9",
+    "js-yaml": "^4.1.0",
     "localstorage-slim": "^2.5.0",
     "luxon": "^3.4.3",
     "merkletreejs": "^0.3.10",
@@ -58,6 +59,7 @@
     "web-did-resolver": "^2.0.27"
   },
   "devDependencies": {
+    "@types/js-yaml": "^4.0.9",
     "@types/leaflet": "^1.9.4",
     "@types/ramda": "^0.29.3",
     "@types/three": "^0.155.1",

src/views/ClaimView.vue

@@ -137,7 +137,7 @@
 
     <div>
       <h2 class="font-bold text-2xl mt-8">Claim</h2>
-      <pre>{{ util.inspect(veriClaim, false, null) }}</pre>
+      <pre>{{ yamlVeriClaim }}</pre>
     </div>
 
     <h2 class="font-bold text-2xl mt-8">Full Claim</h2>
@@ -158,7 +158,7 @@
       </button>
     </div>
     <div v-else>
-      <pre>{{ util.inspect(fullClaim, false, null) }}</pre>
+      <pre>{{ yamlFullClaim }}</pre>
     </div>
 
     <a :href="apiServer + '/api/claim/' + veriClaim.id" target="_blank">
@@ -186,6 +186,7 @@ import * as serverUtil from "@/libs/endorserServer";
 import QuickNav from "@/components/QuickNav.vue";
 import EntityIcon from "@/components/EntityIcon.vue";
 import { Account } from "@/db/tables/accounts";
+import * as yaml from 'js-yaml';
 
 interface Notification {
   group: string;
@@ -300,7 +301,8 @@ export default class ClaimView extends Vue {
     try {
       const resp = await this.axios.get(url, { headers });
       if (resp.status === 200) {
-        this.veriClaim = resp.data;
+        this.veriClaim = resp.json;
+        this.yamlVeriClaim = yaml.dumps(resp.json);
       } else {
         // actually, axios typically throws an error so we never get here
         console.log("Error getting claim:", resp);
@@ -379,7 +381,8 @@ export default class ClaimView extends Vue {
     try {
       const resp = await this.axios.get(url, { headers });
       if (resp.status === 200) {
-        this.fullClaim = resp.data;
+        this.fullClaim = resp.json;
+        this.yamlFullClaim = yaml.dump(resp.json);
       } else {
         // actually, axios typically throws an error so we never get here
         console.log("Error getting full claim:", resp);