mirror of
https://github.com/SrIzan10/next-auth.git
synced 2026-05-01 10:55:20 +00:00
e83c77f6de
* Added Babel Pollyfill to the next-auth client and rollup config. * Client longer relies on ES6 features and so works in Internet Explorer (support for which had been dropped was was conflicting with newerver version of webpack when building isomorphic libraries). * Example client now has slightly better example of how to handle the callback screen for browsers that don’t have JavaScript enabled.
84 lines
2.2 KiB
JavaScript
84 lines
2.2 KiB
JavaScript
import React from 'react'
|
|
import Link from 'next/link'
|
|
import Router from 'next/router'
|
|
import { NextAuth } from 'next-auth/client'
|
|
|
|
export default class extends React.Component {
|
|
|
|
static async getInitialProps({req}) {
|
|
return {
|
|
session: await NextAuth.init({force: true, req: req})
|
|
}
|
|
}
|
|
|
|
async componentDidMount() {
|
|
// Get latest session data after rendering on client then redirect.
|
|
// The ensures client state is always updated after signing in or out.
|
|
const session = await NextAuth.init({force: true})
|
|
Router.push('/')
|
|
}
|
|
|
|
render() {
|
|
// Provide a link for clients without JavaScript as a fallback.
|
|
return (
|
|
<React.Fragment>
|
|
<style jsx global>{`
|
|
body{
|
|
background-color: #fff;
|
|
}
|
|
.circle-loader {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
width: 50%;
|
|
z-index: 100;
|
|
text-align: center;
|
|
transform: translate(-50%, -50%);
|
|
}
|
|
.circle-loader .circle {
|
|
fill: transparent;
|
|
stroke: rgba(0,0,0,0.2);
|
|
stroke-width: 4px;
|
|
animation: dash 2s ease infinite, rotate 2s linear infinite;
|
|
}
|
|
@keyframes dash {
|
|
0% {
|
|
stroke-dasharray: 1,95;
|
|
stroke-dashoffset: 0;
|
|
}
|
|
50% {
|
|
stroke-dasharray: 85,95;
|
|
stroke-dashoffset: -25;
|
|
}
|
|
100% {
|
|
stroke-dasharray: 85,95;
|
|
stroke-dashoffset: -93;
|
|
}
|
|
}
|
|
@keyframes rotate {
|
|
0% {transform: rotate(0deg); }
|
|
100% {transform: rotate(360deg); }
|
|
}
|
|
`}</style>
|
|
<noscript>
|
|
<style>{`
|
|
svg {
|
|
display: none;
|
|
}
|
|
a {
|
|
font-weight: bold;
|
|
}
|
|
`}</style>
|
|
</noscript>
|
|
<a href="/" className="circle-loader">
|
|
<svg className="circle" width="60" height="60" version="1.1" xmlns="http://www.w3.org/2000/svg">
|
|
<circle cx="30" cy="30" r="15"/>
|
|
</svg>
|
|
<noscript>
|
|
Click here to continue
|
|
</noscript>
|
|
</a>
|
|
</React.Fragment>
|
|
)
|
|
}
|
|
} |