whoop-integrator-react

Made with create-react-library

Install

npm install --save whoop-integrator-react

Usage

Authenticator

import React, { Component } from 'react'

import { WhoopAuthenticator, UserCycles } from 'whoop-integrator-react'
import 'whoop-integrator-react/dist/index.css'

class Example extends Component {
  render() {
    return (
      <WhoopAuthenticator
        credentials={{
          client_id: 'carespace',
          client_secret: 'z7wMP7Kr6RYVHPhV',
          scope: 'offline read:recovery read:cycles read:sleep read:workout',
          redirect_uris: ['https://localhost/callback']
        }}
      >
        <UserCycles
          onSuccess={(result) => {
            console.log(result)
          }}
          onFail={(error) => {
            console.error(error)
          }}
          limit={25}
          startTime={new Date('2020-01-01').getTime()}
          endTime={new Date().getTime()}
        >
          <div>Use Cycles result here</div>
        </UserCycles>
      </WhoopAuthenticator>
    )
  }
}

User Cycles

import React, { Component } from 'react'

import { UserCycles } from 'whoop-integrator-react'
import 'whoop-integrator-react/dist/index.css'

class Example extends Component {
  render() {
    return (
      <UserCycles
        onSuccess={(result) => {
          console.log(result)
        }}
        onFail={(error) => {
          console.error(error)
        }}
        limit={25}
        startTime={new Date('2020-01-01').getTime()}
        endTime={new Date().getTime()}
      >
        <div>User Cycles result here</div>
      </UserCycles>
    )
  }
}

User Journals

import React, { Component } from 'react'

import { UserJournals } from 'whoop-integrator-react'
import 'whoop-integrator-react/dist/index.css'

class Example extends Component {
  render() {
    return (
      <UserJournal
        onSuccess={(result) => {
          console.log(result)
        }}
        onFail={(error) => {
          console.error(error)
        }}
        cycleId={1}
      >
        <div>User Journals result here</div>
      </UserJournal>
    )
  }
}

User Profile

import React, { Component } from 'react'

import { UserProfile } from 'whoop-integrator-react'
import 'whoop-integrator-react/dist/index.css'

class Example extends Component {
  render() {
    return (
      <UserProfile
        onSuccess={(result) => {
          console.log(result)
        }}
        onFail={(error) => {
          console.error(error)
        }}
        userId={2}
      >
        <div>User Profile result here</div>
      </UserProfile>
    )
  }
}

User Sleep

import React, { Component } from 'react'

import { UserSleep } from 'whoop-integrator-react'
import 'whoop-integrator-react/dist/index.css'

class Example extends Component {
  render() {
    return (
      <UserSleep
        onSuccess={(result) => {
          console.log(result)
        }}
        onFail={(error) => {
          console.error(error)
        }}
        limit={25}
        offset={5}
        startTimeEpochMillisInclusive={pnew Date('2020-10-01').getTime()}
        endTimeEpochMillisExclusive={new Date().getTime()}
      >
        <div>User Sleep result here</div>
      </UserSleep>
    )
  }
}

User Workout

import React, { Component } from 'react'

import { UserWorkout } from 'whoop-integrator-react'
import 'whoop-integrator-react/dist/index.css'

class Example extends Component {
  render() {
    return (
      <UserWorkout
        onSuccess={(result) => {
          console.log(result)
        }}
        onFail={(error) => {
          console.error(error)
        }}
        limit={25}
      >
        <div>User Workout result here</div>
      </UserWorkout>
    )
  }
}

License

MIT © Cristofer Domingues