@criipto/verify-react 1.1.2 → 1.1.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/criipto-verify-react.cjs.js +1 -1
- package/dist/criipto-verify-react.cjs.js.map +1 -1
- package/dist/criipto-verify-react.esm.js +1 -1
- package/dist/criipto-verify-react.esm.js.map +1 -1
- package/dist/memory-storage.d.ts +1 -0
- package/jest.setup.ts +1 -20
- package/package.json +1 -1
- package/example/README.md +0 -9
- package/example/package-lock.json +0 -29062
- package/example/package.json +0 -39
- package/example/public/index.html +0 -16
- package/example/src/App.css +0 -90
- package/example/src/App.js +0 -39
- package/example/src/Dashboard.js +0 -33
- package/example/src/Footer.js +0 -8
- package/example/src/Header.js +0 -17
- package/example/src/Loading.js +0 -12
- package/example/src/Login.js +0 -13
- package/example/src/index.css +0 -14
- package/example/src/index.js +0 -19
package/example/package.json
DELETED
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "example",
|
|
3
|
-
"version": "0.1.0",
|
|
4
|
-
"private": true,
|
|
5
|
-
"dependencies": {
|
|
6
|
-
"@criipto/verify-react": "^0.21.3",
|
|
7
|
-
"@testing-library/jest-dom": "^5.16.5",
|
|
8
|
-
"@testing-library/react": "^13.4.0",
|
|
9
|
-
"@testing-library/user-event": "^13.5.0",
|
|
10
|
-
"react": "^18.2.0",
|
|
11
|
-
"react-dom": "^18.2.0",
|
|
12
|
-
"react-scripts": "5.0.1",
|
|
13
|
-
"web-vitals": "^2.1.4"
|
|
14
|
-
},
|
|
15
|
-
"scripts": {
|
|
16
|
-
"start": "react-scripts start",
|
|
17
|
-
"build": "react-scripts build",
|
|
18
|
-
"test": "react-scripts test",
|
|
19
|
-
"eject": "react-scripts eject"
|
|
20
|
-
},
|
|
21
|
-
"eslintConfig": {
|
|
22
|
-
"extends": [
|
|
23
|
-
"react-app",
|
|
24
|
-
"react-app/jest"
|
|
25
|
-
]
|
|
26
|
-
},
|
|
27
|
-
"browserslist": {
|
|
28
|
-
"production": [
|
|
29
|
-
">0.2%",
|
|
30
|
-
"not dead",
|
|
31
|
-
"not op_mini all"
|
|
32
|
-
],
|
|
33
|
-
"development": [
|
|
34
|
-
"last 1 chrome version",
|
|
35
|
-
"last 1 firefox version",
|
|
36
|
-
"last 1 safari version"
|
|
37
|
-
]
|
|
38
|
-
}
|
|
39
|
-
}
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="en">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="utf-8" />
|
|
5
|
-
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
6
|
-
<meta name="theme-color" content="#000000" />
|
|
7
|
-
<meta
|
|
8
|
-
name="description"
|
|
9
|
-
content="Web site created using create-react-app"
|
|
10
|
-
/>
|
|
11
|
-
<title>Example Pension App</title>
|
|
12
|
-
</head>
|
|
13
|
-
<body>
|
|
14
|
-
<div id="root"></div>
|
|
15
|
-
</body>
|
|
16
|
-
</html>
|
package/example/src/App.css
DELETED
|
@@ -1,90 +0,0 @@
|
|
|
1
|
-
body {
|
|
2
|
-
display: flex;
|
|
3
|
-
min-height: 100vh;
|
|
4
|
-
flex-direction: column;
|
|
5
|
-
text-align: center;
|
|
6
|
-
}
|
|
7
|
-
|
|
8
|
-
.App-header,
|
|
9
|
-
.App-footer {
|
|
10
|
-
min-height: 10vh;
|
|
11
|
-
display: flex;
|
|
12
|
-
align-items: center;
|
|
13
|
-
justify-content: center;
|
|
14
|
-
background-color: #6f7d98;
|
|
15
|
-
color: white;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
.App-header p {
|
|
19
|
-
margin: 10px;
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
.logout-btn {
|
|
23
|
-
background-color: #eb827a;
|
|
24
|
-
color: #fff;
|
|
25
|
-
font-weight: bold;
|
|
26
|
-
padding: 8px 10px;
|
|
27
|
-
border-radius: 5px;
|
|
28
|
-
text-align: center;
|
|
29
|
-
cursor: pointer;
|
|
30
|
-
margin-right: 10px;
|
|
31
|
-
margin-left: auto;
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
.main {
|
|
35
|
-
flex: 1;
|
|
36
|
-
min-height: 80vh;
|
|
37
|
-
font-size: calc(10px + 2vmin);
|
|
38
|
-
background-color: #e6f2ff;
|
|
39
|
-
color: rgb(15, 27, 73);
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
.login,
|
|
43
|
-
.loading {
|
|
44
|
-
display: flex;
|
|
45
|
-
flex-direction: column;
|
|
46
|
-
align-items: center;
|
|
47
|
-
justify-content: center;
|
|
48
|
-
flex: 1;
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
.user-dashboard {
|
|
52
|
-
background-color: #e6f2ff;
|
|
53
|
-
display: flex;
|
|
54
|
-
flex-direction: column;
|
|
55
|
-
align-items: center;
|
|
56
|
-
justify-content: center;
|
|
57
|
-
font-size: calc(10px + 2vmin);
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
.dashboard-list {
|
|
61
|
-
list-style: none;
|
|
62
|
-
padding: 0;
|
|
63
|
-
display: flex;
|
|
64
|
-
flex-wrap: wrap;
|
|
65
|
-
justify-content: center;
|
|
66
|
-
}
|
|
67
|
-
.dashboard-list li {
|
|
68
|
-
width: 200px;
|
|
69
|
-
padding: 10px;
|
|
70
|
-
margin: 10px;
|
|
71
|
-
background-color: #f7f7f7;
|
|
72
|
-
border: 1px solid rgb(15, 27, 73);
|
|
73
|
-
border-radius: 10px;
|
|
74
|
-
text-align: center;
|
|
75
|
-
box-shadow: 2px 2px 10px rgba(15, 27, 73, 0.2);
|
|
76
|
-
font-size: 20px;
|
|
77
|
-
font-weight: bold;
|
|
78
|
-
display: flex;
|
|
79
|
-
flex-direction: column;
|
|
80
|
-
align-items: center;
|
|
81
|
-
justify-content: center;
|
|
82
|
-
transition: all 0.2s ease-in-out;
|
|
83
|
-
}
|
|
84
|
-
.dashboard-list li:hover {
|
|
85
|
-
box-shadow: 2px 2px 20px rgba(15, 27, 73, 0.4);
|
|
86
|
-
}
|
|
87
|
-
.dashboard-list li span {
|
|
88
|
-
display: block;
|
|
89
|
-
margin-bottom: 10px;
|
|
90
|
-
}
|
package/example/src/App.js
DELETED
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { useCriiptoVerify, AuthMethodSelector } from '@criipto/verify-react';
|
|
3
|
-
import Header from './Header';
|
|
4
|
-
import Login from './Login';
|
|
5
|
-
import Loading from './Loading';
|
|
6
|
-
import Dashboard from './Dashboard';
|
|
7
|
-
import Footer from './Footer';
|
|
8
|
-
import './App.css';
|
|
9
|
-
import '@criipto/verify-react/dist/criipto-verify-react.css';
|
|
10
|
-
|
|
11
|
-
function App() {
|
|
12
|
-
const { claims, isLoading, logout, error } = useCriiptoVerify();
|
|
13
|
-
|
|
14
|
-
const handleLogout = () => {
|
|
15
|
-
logout('http://localhost:3000');
|
|
16
|
-
};
|
|
17
|
-
|
|
18
|
-
return (
|
|
19
|
-
<React.Fragment>
|
|
20
|
-
<Header handleLogout={handleLogout} user={claims} />
|
|
21
|
-
{isLoading && <Loading />}
|
|
22
|
-
{error ? (
|
|
23
|
-
<p>
|
|
24
|
-
An error occurred: {error.error} ({error.error_description})
|
|
25
|
-
</p>
|
|
26
|
-
) : null}
|
|
27
|
-
{claims ? (
|
|
28
|
-
<Dashboard user={claims} />
|
|
29
|
-
) : (
|
|
30
|
-
<Login>
|
|
31
|
-
<AuthMethodSelector />
|
|
32
|
-
</Login>
|
|
33
|
-
)}
|
|
34
|
-
<Footer />
|
|
35
|
-
</React.Fragment>
|
|
36
|
-
);
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
export default App;
|
package/example/src/Dashboard.js
DELETED
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import './App.css';
|
|
3
|
-
|
|
4
|
-
function Dashboard({
|
|
5
|
-
user: { name, birthdate, country, cprNumberIdentifier, iat },
|
|
6
|
-
}) {
|
|
7
|
-
return (
|
|
8
|
-
<div className="user-dashboard main">
|
|
9
|
-
<h2>Welcome to your savings dashboard, {name}</h2>
|
|
10
|
-
<h4>You have 1.000.000 DKK in pension savings</h4>
|
|
11
|
-
<ul className="dashboard-list">
|
|
12
|
-
<li>
|
|
13
|
-
<span>Name:</span> {name}
|
|
14
|
-
</li>
|
|
15
|
-
<li>
|
|
16
|
-
<span>Birthdate:</span> {birthdate}
|
|
17
|
-
</li>
|
|
18
|
-
<li>
|
|
19
|
-
<span>Country:</span> {country}
|
|
20
|
-
</li>
|
|
21
|
-
<li>
|
|
22
|
-
<span>cprNumberIdentifier: </span>
|
|
23
|
-
{cprNumberIdentifier}
|
|
24
|
-
</li>
|
|
25
|
-
<li>
|
|
26
|
-
<span>iat:</span> {iat}
|
|
27
|
-
</li>
|
|
28
|
-
</ul>
|
|
29
|
-
</div>
|
|
30
|
-
);
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
export default Dashboard;
|
package/example/src/Footer.js
DELETED
package/example/src/Header.js
DELETED
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import './App.css';
|
|
3
|
-
|
|
4
|
-
function Header({ handleLogout, user }) {
|
|
5
|
-
return (
|
|
6
|
-
<header className="App-header">
|
|
7
|
-
<p>Example Pension App</p>
|
|
8
|
-
{user && (
|
|
9
|
-
<button className="logout-btn" onClick={handleLogout}>
|
|
10
|
-
Log Out
|
|
11
|
-
</button>
|
|
12
|
-
)}
|
|
13
|
-
</header>
|
|
14
|
-
);
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
export default Header;
|
package/example/src/Loading.js
DELETED
package/example/src/Login.js
DELETED
package/example/src/index.css
DELETED
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
body {
|
|
2
|
-
margin: 0;
|
|
3
|
-
padding: 0;
|
|
4
|
-
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
|
|
5
|
-
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
|
|
6
|
-
sans-serif;
|
|
7
|
-
-webkit-font-smoothing: antialiased;
|
|
8
|
-
-moz-osx-font-smoothing: grayscale;
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
code {
|
|
12
|
-
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
|
|
13
|
-
monospace;
|
|
14
|
-
}
|
package/example/src/index.js
DELETED
|
@@ -1,19 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import ReactDOM from 'react-dom/client';
|
|
3
|
-
import './index.css';
|
|
4
|
-
import App from './App';
|
|
5
|
-
import { CriiptoVerifyProvider } from '@criipto/verify-react';
|
|
6
|
-
|
|
7
|
-
const root = ReactDOM.createRoot(document.getElementById('root'));
|
|
8
|
-
root.render(
|
|
9
|
-
<React.StrictMode>
|
|
10
|
-
<CriiptoVerifyProvider
|
|
11
|
-
domain="samples.criipto.id"
|
|
12
|
-
clientID="urn:criipto:samples:criipto-verify-react"
|
|
13
|
-
redirectUri="http://localhost:3000"
|
|
14
|
-
sessionStore={window.localStorage}
|
|
15
|
-
>
|
|
16
|
-
<App />
|
|
17
|
-
</CriiptoVerifyProvider>
|
|
18
|
-
</React.StrictMode>
|
|
19
|
-
);
|