forked from digitalcredentials/admin-dashboard-claim-page
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.astro
100 lines (85 loc) · 3.55 KB
/
index.astro
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
---
import { Image } from 'astro:assets';
import Layout from '../layouts/Layout.astro';
import MainSection from '../layouts/MainSection.astro';
import Modal from '../components/Modal.astro';
import Placeholder from '../assets/images/placeholder.png';
import Button from '../components/Button.astro';
---
<Layout title="Getting Credential...">
<MainSection />
</Layout>
<script>
import QRCode from 'qrcode';
import { format } from 'date-fns';
const payloadUrl = import.meta.env.PUBLIC_DASHBOARD_URL || 'http://localhost:3000/api' as string;
const basePath = '/claim'
const urlSearchParams = new URLSearchParams(window.location.search);
const params = Object.fromEntries(urlSearchParams.entries());
const { token } = params;
if (!token) window.location.href = `${basePath}/error`;
const title = document.getElementById('title') as HTMLHeadingElement;
const info1 = document.getElementById('info-1') as HTMLParagraphElement;
const info2 = document.getElementById('info-2') as HTMLParagraphElement;
const qrcode = document.getElementById('qr-code') as HTMLImageElement;
const directAnchorLink = document.getElementById('link-direct') as HTMLAnchorElement;
title.innerText = 'Getting Credential...';
try {
const res = await fetch(`${payloadUrl}/get-credential-links`, {
headers: { Authorization: `Bearer ${token}` },
});
setTimeout(() => {
// redirect nine minutes (540000 ms) after the page loads,
// since the exchange endpoint expires after ten minutes.
window.location.replace(`${basePath}/expired`);
}, 540000);
if (res.status !== 200) window.location.href = `${basePath}/error`;
else {
const {
links,
metadata: {
credentialName,
earnerName,
awardedDate: _awardedDate,
issuedDate: _issuedDate,
},
} = (await res.json()) as {
links: {
retrievalId: string;
directDeepLink: string;
vprDeepLink: string;
chapiVPR: {
challenge: string;
domain: string;
interact: {
service: [{ serviceEndpoint: string; type: string }, { type: string }];
};
query: { type: string };
};
}[];
metadata: {
credentialName: string;
earnerName: string;
awardedDate: string;
issuedDate: string;
};
};
const awardedDate = format(new Date(_awardedDate), 'MMMM do, y');
const issuedDate = format(new Date(_issuedDate), 'MMMM do, y');
// Show display info
document.title = credentialName;
title.innerHTML = credentialName;
info1.innerHTML = `Awarded to ${earnerName} on ${awardedDate}`;
info2.innerHTML = `Issued on ${issuedDate}`;
const url = links[0]?.directDeepLink;
if (url) {
const dataUrl = await QRCode.toDataURL(url);
qrcode.src = dataUrl;
directAnchorLink.href = url
} else window.location.href = `${basePath}/error`;
}
} catch (error) {
console.error(error);
window.location.href = `${basePath}/error`;
}
</script>