-
Notifications
You must be signed in to change notification settings - Fork 2
/
MyCardScreen.jsx
50 lines (47 loc) · 1.87 KB
/
MyCardScreen.jsx
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
import { useContext, useState, useEffect } from 'react';
import { GlobalContext } from '../../context';
import Loading from '../common/Loading';
import Card from './CommonCard';
import { useNavigate } from "react-router-dom";
const MyCard = () => {
const { userId } = useContext(GlobalContext);
const [cardData, setCardData] = useState({});
const [userData, setUserData] = useState('');
const navigate = useNavigate();
useEffect(() => {
fetch(`http://35.184.195.100:3000/api/user/${userId}`)
.then(response => response.json())
.then(data => {
if (data.length > 0) {
setUserData(data[0]);
}
})
.catch(err => console.log(err.message));
fetch(`http://35.184.195.100:3000/api/result?userId=${userId}`)
.then(response => response.json())
.then(data => {
if (data.length > 0) {
const type = data[0].result_code;
fetch(`http://35.184.195.100:3000/api/card/${type}`)
.then(response => response.json())
.then(data => setCardData(data))
.catch(err => console.log(err.message));
} else {
// User hasn't tested, navigate to the test page.
// TODO(Zane): show popup window.
navigate("/test");
}
})
.catch(err => console.log(err.message));
}, [userId]);
if (userData.name && cardData.description) {
return (
<div className='d-flex flex-column vh-100' style={{ backgroundColor: '#3069B3' }}>
<Card userData={userData} cardData={cardData} showDescription={true} showShare={true}/>
</div>
);
} else {
return <Loading/>
}
}
export default MyCard;