Browse Source

render full claim details in a more resonable format of YAML not JSON

kb/add-usage-guide
Trent Larson 11 months ago
parent
commit
c1361e088f
  1. 11
      package-lock.json
  2. 2
      package.json
  3. 15
      src/views/ClaimView.vue

11
package-lock.json

@ -14,6 +14,7 @@
"@fortawesome/vue-fontawesome": "^3.0.3", "@fortawesome/vue-fontawesome": "^3.0.3",
"@pvermeer/dexie-encrypted-addon": "^3.0.0", "@pvermeer/dexie-encrypted-addon": "^3.0.0",
"@tweenjs/tween.js": "^21.0.0", "@tweenjs/tween.js": "^21.0.0",
"@types/js-yaml": "^4.0.9",
"@veramo/core": "^5.4.1", "@veramo/core": "^5.4.1",
"@veramo/credential-w3c": "^5.4.1", "@veramo/credential-w3c": "^5.4.1",
"@veramo/data-store": "^5.4.1", "@veramo/data-store": "^5.4.1",
@ -36,6 +37,7 @@
"git-describe": "^4.1.1", "git-describe": "^4.1.1",
"jdenticon": "^3.2.0", "jdenticon": "^3.2.0",
"js-generate-password": "^0.1.9", "js-generate-password": "^0.1.9",
"js-yaml": "^4.1.0",
"localstorage-slim": "^2.5.0", "localstorage-slim": "^2.5.0",
"luxon": "^3.4.3", "luxon": "^3.4.3",
"merkletreejs": "^0.3.10", "merkletreejs": "^0.3.10",
@ -8795,6 +8797,11 @@
"@types/istanbul-lib-report": "*" "@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=="
},
"node_modules/@types/json-schema": { "node_modules/@types/json-schema": {
"version": "7.0.13", "version": "7.0.13",
"resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.13.tgz", "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.13.tgz",
@ -11069,8 +11076,7 @@
"node_modules/argparse": { "node_modules/argparse": {
"version": "2.0.1", "version": "2.0.1",
"resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz", "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": { "node_modules/array-buffer-byte-length": {
"version": "1.0.0", "version": "1.0.0",
@ -18618,7 +18624,6 @@
"version": "4.1.0", "version": "4.1.0",
"resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz", "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz",
"integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==", "integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==",
"devOptional": true,
"dependencies": { "dependencies": {
"argparse": "^2.0.1" "argparse": "^2.0.1"
}, },

2
package.json

@ -14,6 +14,7 @@
"@fortawesome/vue-fontawesome": "^3.0.3", "@fortawesome/vue-fontawesome": "^3.0.3",
"@pvermeer/dexie-encrypted-addon": "^3.0.0", "@pvermeer/dexie-encrypted-addon": "^3.0.0",
"@tweenjs/tween.js": "^21.0.0", "@tweenjs/tween.js": "^21.0.0",
"@types/js-yaml": "^4.0.9",
"@veramo/core": "^5.4.1", "@veramo/core": "^5.4.1",
"@veramo/credential-w3c": "^5.4.1", "@veramo/credential-w3c": "^5.4.1",
"@veramo/data-store": "^5.4.1", "@veramo/data-store": "^5.4.1",
@ -36,6 +37,7 @@
"git-describe": "^4.1.1", "git-describe": "^4.1.1",
"jdenticon": "^3.2.0", "jdenticon": "^3.2.0",
"js-generate-password": "^0.1.9", "js-generate-password": "^0.1.9",
"js-yaml": "^4.1.0",
"localstorage-slim": "^2.5.0", "localstorage-slim": "^2.5.0",
"luxon": "^3.4.3", "luxon": "^3.4.3",
"merkletreejs": "^0.3.10", "merkletreejs": "^0.3.10",

15
src/views/ClaimView.vue

@ -137,9 +137,10 @@
<div> <div>
<h2 class="font-bold uppercase text-xl mt-8 mb-2">Claim</h2> <h2 class="font-bold uppercase text-xl mt-8 mb-2">Claim</h2>
<pre class="text-sm overflow-x-scroll px-4 py-3 bg-slate-100 rounded-md"> <pre
{{ util.inspect(veriClaim, false, null) }} class="text-sm overflow-x-scroll px-4 py-3 bg-slate-100 rounded-md"
</pre> >{{ veriClaimDump }}</pre
>
</div> </div>
<h2 class="font-bold uppercase text-xl mt-8 mb-2">Full Claim</h2> <h2 class="font-bold uppercase text-xl mt-8 mb-2">Full Claim</h2>
@ -160,7 +161,7 @@
</button> </button>
</div> </div>
<div v-else> <div v-else>
<pre>{{ util.inspect(fullClaim, false, null) }}</pre> <pre>{{ fullClaimDump }}</pre>
</div> </div>
<a <a
@ -175,6 +176,7 @@
<script lang="ts"> <script lang="ts">
import { AxiosError, RawAxiosRequestHeaders } from "axios"; import { AxiosError, RawAxiosRequestHeaders } from "axios";
import * as yaml from "js-yaml";
import * as R from "ramda"; import * as R from "ramda";
import { IIdentifier } from "@veramo/core"; import { IIdentifier } from "@veramo/core";
import * as util from "util"; import * as util from "util";
@ -212,11 +214,14 @@ export default class ClaimView extends Vue {
confsVisibleErrorMessage = ""; confsVisibleErrorMessage = "";
confsVisibleToIdList = []; // list of DIDs that can see any confirmer confsVisibleToIdList = []; // list of DIDs that can see any confirmer
fullClaim = null; fullClaim = null;
fullClaimDump = "";
fullClaimMessage = ""; fullClaimMessage = "";
numConfsNotVisible = 0; // number of hidden DIDs in the confirmerIdList, minus the issuer if they aren't visible numConfsNotVisible = 0; // number of hidden DIDs in the confirmerIdList, minus the issuer if they aren't visible
veriClaim = serverUtil.BLANK_GENERIC_SERVER_RECORD; veriClaim = serverUtil.BLANK_GENERIC_SERVER_RECORD;
veriClaimDump = "";
util = util; util = util;
yaml = yaml;
containsHiddenDid = serverUtil.containsHiddenDid; containsHiddenDid = serverUtil.containsHiddenDid;
async created() { async created() {
@ -305,6 +310,7 @@ export default class ClaimView extends Vue {
const resp = await this.axios.get(url, { headers }); const resp = await this.axios.get(url, { headers });
if (resp.status === 200) { if (resp.status === 200) {
this.veriClaim = resp.data; this.veriClaim = resp.data;
this.veriClaimDump = yaml.dump(this.veriClaim);
} else { } else {
// actually, axios typically throws an error so we never get here // actually, axios typically throws an error so we never get here
console.log("Error getting claim:", resp); console.log("Error getting claim:", resp);
@ -384,6 +390,7 @@ export default class ClaimView extends Vue {
const resp = await this.axios.get(url, { headers }); const resp = await this.axios.get(url, { headers });
if (resp.status === 200) { if (resp.status === 200) {
this.fullClaim = resp.data; this.fullClaim = resp.data;
this.fullClaimDump = yaml.dump(this.fullClaim);
} else { } else {
// actually, axios typically throws an error so we never get here // actually, axios typically throws an error so we never get here
console.log("Error getting full claim:", resp); console.log("Error getting full claim:", resp);

Loading…
Cancel
Save