forked from webclinic017/passiv-web
-
Notifications
You must be signed in to change notification settings - Fork 0
/
AlpacaOauthPage.tsx
128 lines (122 loc) · 4.03 KB
/
AlpacaOauthPage.tsx
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
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
import React, { useState, useEffect } from 'react';
import { useSelector, useDispatch } from 'react-redux';
import { Link } from 'react-router-dom';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faSpinner } from '@fortawesome/free-solid-svg-icons';
import { push, replace } from 'connected-react-router';
import { postData } from '../api';
import { reloadEverything } from '../actions';
import ShadowBox from '../styled/ShadowBox';
import { H1, P } from '../styled/GlobalElements';
import { Button } from '../styled/Button';
import { Step } from '../styled/SignupSteps';
import { selectQueryTokens } from '../selectors/router';
import { Error } from '../types/groupInfo';
const AlpacaOauthPage = () => {
const [loading, setLoading] = useState(true);
const [error, setError] = useState<Error>();
const queryParams = useSelector(selectQueryTokens);
const dispatch = useDispatch();
useEffect(() => {
const token = queryParams.code;
if (token === null) {
setLoading(false);
setError({ code: '0000' });
} else {
postData('/api/v1/brokerages/authComplete/', { token: token })
.then(() => {
dispatch(reloadEverything());
setTimeout(() => {
dispatch(replace('/app/setup-groups'));
}, 1000);
})
.catch(error => {
setLoading(false);
setError(error.response.data);
});
}
}, []); // eslint-disable-line react-hooks/exhaustive-deps
let errorDisplay = null;
if (error) {
switch (error.code) {
case '1006':
errorDisplay = (
<P>This connection code is invalid, please try again.</P>
);
break;
case '1007':
errorDisplay = (
<P>This connection code has expired, please try again.</P>
);
break;
case '1017':
errorDisplay = (
<P>
An identical connection already exists, please update or delete the
existing connection.
</P>
);
break;
case '1023':
errorDisplay = (
<P>
The brokerage account linked to this connection is different from
the account you're trying to link. This is not allowed because it
would leave existing portfolios without a functional connection.
Instead, create a new connection and delete this one if desired.
</P>
);
break;
case '0000':
errorDisplay = (
<P>
No access code was provided by Alpaca. Did you approve the
connection request?
</P>
);
break;
default:
errorDisplay = (
<React.Fragment>
<P>
We encountered an unexpected error while attempting to establish a
connection. Please try again later or{' '}
<Link to="/app/help">contact support</Link> if this persists.
</P>
<P>
Note that in order for a connection to be established, you must
make sure that your brokerage account is fully opened and funded.
If your brokerage account is new or the initial funding has not
been finalized by the brokerage, then you may not be able to link
your account to Passiv until it is fully opened.
</P>
</React.Fragment>
);
break;
}
}
return (
<ShadowBox background="#04a287">
<H1 color="white">SETUP</H1>
{loading ? (
<React.Fragment>
<Step>
Establishing connection to Alpaca...{' '}
<FontAwesomeIcon icon={faSpinner} spin />
</Step>
</React.Fragment>
) : (
<React.Fragment>
<Step>Failed to establish connection :(</Step>
<ShadowBox>
{errorDisplay}
<Button onClick={() => dispatch(push('/app/settings'))}>
Go to Settings
</Button>
</ShadowBox>
</React.Fragment>
)}
</ShadowBox>
);
};
export default AlpacaOauthPage;