1import Amplify, { Auth, Hub } from 'aws-amplify';
2import awsconfig from './aws-exports';
3Amplify.configure(awsconfig);
4
5class App extends Component {
6 state = { user: null, customState: null };
7
8 componentDidMount() {
9 Hub.listen("auth", ({ payload: { event, data } }) => {
10 switch (event) {
11 case "signIn":
12 this.setState({ user: data });
13 break;
14 case "signOut":
15 this.setState({ user: null });
16 break;
17 case "customOAuthState":
18 this.setState({ customState: data });
19 }
20 });
21
22 Auth.currentAuthenticatedUser()
23 .then(user => this.setState({ user }))
24 .catch(() => console.log("Not signed in"));
25 }
26
27 render() {
28 const { user } = this.state;
29
30 return (
31 <div className="App">
32 <button onClick={() => Auth.federatedSignIn({provider: 'Facebook'})}>Open Facebook</button>
33 <button onClick={() => Auth.federatedSignIn({provider: 'Google'})}>Open Google</button>
34 <button onClick={() => Auth.federatedSignIn()}>Open Hosted UI</button>
35 <button onClick={() => Auth.signOut()}>Sign Out {user.getUsername()}</button>
36 </div>
37 );
38 }
39}