How to use the aws-amplify-react.withAuthenticator function in aws-amplify-react

To help you get started, we’ve selected a few aws-amplify-react examples, based on popular ways it is used in public projects.

github dabit3 / full-stack-serverless-code / basic-authentication / src / Profile.js View on Github external
function signOut() {
    Auth.signOut()
      .catch(err => console.log('error signing out: ', err))
  }
  return (
    <Container>
      <h1>Profile</h1>
      <h2>Username: {user.username}</h2>
      <h3>Email: {user.email}</h3>
      <h4>Phone: {user.phone_number}</h4>
      <Button onClick={signOut}>Sign Out</Button>
    </Container>
  );
}

export default withAuthenticator(Profile)
github dabit3 / amplify-auth-demo / src / AppwithAuth.js View on Github external
import { withAuthenticator } from 'aws-amplify-react'
import App from './App'

export default withAuthenticator(App)
github awslabs / media-analysis-solution / source / web_site / src / components / result.js View on Github external
<Modal isOpen={this.state.downloading}>
                <ModalHeader>Retrieving Media File</ModalHeader>
                <ModalBody>
                  <div>Downloading</div>
                  <Progress animated color="warning" value="100" />
                </ModalBody>
              </Modal>
              <VideoResults phrases={phrases} entities={entities} captions={this.state.captions} transcript={this.state.transcript} individualcelebs={this.state.video_indv_celebs} allfaces={this.state.face_video} attributes={this.state.att_list} celebvideo={this.state.celeb_video} mediafile={this.state.media_file} filename={this.state.filename} filetype={this.state.file_type} persons={this.state.persons} labels={labels} individualknownfaces={this.state.video_indv_known_faces} allknownfaces={this.state.known_face_video}/>
            </div>
          );
        }
    }
  }
}

export default withAuthenticator(Result);
github aws-samples / aws-appsync-visualization-with-athena-app / src / App.js View on Github external
}, [query])

  return (
    <div>
      <div>
        <small>
          {query.countryCode} - ref: <a href={link}>{query.file.key}</a>
        </small>
      </div>
      <canvas width="512" height="1" style={{ display: 'none' }} />
      <svg />
    </div>
  )
}

export default withAuthenticator(App)
github gabehollombe-aws / react-graphql-amplify-blog-post / src / App.js View on Github external
<Route
              path="/albums/:albumId"
              render={ () => <div><NavLink to='/'>Back to Albums list</NavLink></div> }
            />
            <Route
              path="/albums/:albumId"
              render={ props => <AlbumDetailsLoader id={props.match.params.albumId}/> }
            />
          </Grid.Column>
        </Grid>
      </Router>
    );
  }
}

export default withAuthenticator(App, { includeGreetings: true });
github dabit3 / real-time-image-tracking / src / App.js View on Github external
* {
    box-sizing: border-box;
    color: #d73132;
    font-family: 'Mr Robot';
  }
  body {
    background-color: #1c2b34;
    margin: 0;
    padding: 0;
    min-height: 100vh;
    border: 10px solid #d73132;
    padding: 20px;
  }
`

export default withAuthenticator(App);
github dabit3 / react-amplify-appsync-files-s3 / src / Products.js View on Github external
display: 'flex',
    flexDirection: 'column'
  },
  image: {
    width: 400
  },
  button: {
    width: 200,
    backgroundColor: '#ddd',
    cursor: 'pointer',
    height: 30,
    margin: '0px 0px 8px'
  }
}

export default withAuthenticator(App);
github dabit3 / appsync-web-translator / src / App.js View on Github external
width: 475,
    marginLeft: 40,
    marginTop: 20,
    color: 'black',
    fontSize: 18,
    padding: 8
  },
  languageButton: {
    padding: '7px 20px', margin: '0px 3px', cursor: 'pointer'
  },
  heading: {
    fontSize: 60, margin: '20px 0px'
  }
}

export default withAuthenticator(App);
github dabit3 / appsync-image-rekognition / src / App.js View on Github external
margin: '10px 0px'
  },
  header: {
    height: 100,
    backgroundColor: '#463744',
    display: 'flex',
    alignItems: 'center'
  },
  heading: {
    color: 'white',
    fontSize: 40,
    paddingLeft: 100
  }
}

export default withAuthenticator(App, { includeGreetings: true });
github dabit3 / aws-amplify-workshop-web / amplify-demos / src / App.js View on Github external
<header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <h1 className="App-title">Welcome to React</h1>
        </header>
        <p className="App-intro">
          To get started, edit <code>src/App.js</code> and save to reload.
        </p>
        <button
          onClick={this.recordEvent}
        >Record Event</button>
      </div>
    );
  }
}

export default withAuthenticator(App);

aws-amplify-react

AWS Amplify is a JavaScript library for Frontend and mobile developers building cloud-enabled applications.

Apache-2.0
Latest version published 11 months ago

Package Health Score

88 / 100
Full package analysis