diff options
Diffstat (limited to 'frontend/src/auth.js')
-rw-r--r-- | frontend/src/auth.js | 17 |
1 files changed, 12 insertions, 5 deletions
diff --git a/frontend/src/auth.js b/frontend/src/auth.js index 0ed1e1a..2f32c33 100644 --- a/frontend/src/auth.js +++ b/frontend/src/auth.js @@ -1,5 +1,6 @@ import React from 'react'; import { Redirect, generatePath } from 'react-router-dom'; +import { Spinner } from 'react-bootstrap'; import { isExpired } from 'react-jwt'; const UserContext = React.createContext(); @@ -18,7 +19,9 @@ class Login extends React.Component { if (this.state.url) { return <div>Redirecting to <a href={this.state.url}>{this.state.url}</a></div>; } - return <div>Logging in…</div>; + return <Spinner animation="border"> + <span className="sr-only">Logging in…</span> + </Spinner>; } async get_oauth_url() { let redirect_uri = window.location.origin + generatePath('/oauth-callback'); @@ -50,7 +53,9 @@ class Logout extends React.Component { if (this.state.done) { return <Redirect to='/' />; } - return <div>Logging out…</div>; + return <Spinner animation="border"> + <span className="sr-only">Logging out…</span> + </Spinner>; } } @@ -88,7 +93,7 @@ class OauthCallback extends React.Component { const user = await this.context.get_user(); if (user) { this.setState({error: null, done: true}); - window.flash({header: 'Logged in', text: 'You are now logged in as ' + user.username + '.'}); + window.flash({header: 'Logged in', text: `You are now logged in as ${user.username}.`}); } else { window.flash({header: 'Login failed', text: 'Something failed during authentication.'}); } @@ -100,7 +105,9 @@ class OauthCallback extends React.Component { if (this.state.done) { return <Redirect to='/' />; } - return 'Logging in…'; + return <Spinner animation="border"> + <span className="sr-only">Logging in…</span> + </Spinner>; } } @@ -146,7 +153,7 @@ class AuthenticationProvider extends React.Component { } let response = await fetch('/api/user',{ headers: { - Authorization: 'Bearer ' + token, + Authorization: `Bearer ${token}`, } }); if (response.ok) { |