legacy/pairent_frontend_react/src/pages/LoggedIn/index.jsx

67 lines
1.9 KiB
JavaScript

import React from "react";
import { styled } from "styled-components";
import { HashLoader } from "react-spinners";
import { SigninResponse, SigninState } from 'oidc-client-ts';
import FloatingBox from "../../components/UI/FloatingBox";
const CenterContainer = styled.div`
position: relative;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 400px;
text-align: center;
& h2 {
font-size: 1.8em;
font-weight: 600;
margin: 1.5em 0;
}
`;
const ErrorText = styled.p`
font-family: monospace;
margin: 10px 0;
width: 780px;
`;
export default class LoggedIn extends React.Component {
constructor(props) {
super(props);
this.response = new SigninResponse(new URL(window.location.href).searchParams);
this.signin_state = SigninState.fromStorageString(window.localStorage.getItem('oidc_signin_state'));
}
async componentDidMount() {
console.log(this.response)
console.log(this.signin_state);
}
render() {
return (
<>
<div style={{height: '65vh'}}>
<CenterContainer>
<h2>Подождите пожалуйста</h2>
<div style={{margin: '36px auto', width:'fit-content'}}>
<HashLoader size='80' color='#0077aa' />
</div>
</CenterContainer>
</div>
{
this.response.error ?
<div>
<FloatingBox>
<h2>Ошибка авторизации</h2>
<p>{this.response.error}</p>
<ErrorText>{this.response.error_description}</ErrorText>
</FloatingBox>
</div>
: null
}
</>
)
}
}