Skip to content

XD2Sketch/react-oauth-popup

Repository files navigation

react-oauth-popup

Node.js CI

OAuth-Popups are some pretty nasty jams that don't fit well in React. This component allows you declare an oauth-popup inline with your components and handles the nasty window navigation for you.

Please note: This component currently only supports OAuth Authorization Code grant type (see: OAuth2 Grant Types OAuth2 Simplified)

Install

NPM:

npm install react-oauth-popup --save

Yarn:

yarn add react-oauth-popup

Props

  • url - the url of the oauth navigation screen (instagram/facebook/etc.)
  • onCode - called when the user has successfully authenticated with the oauth code
  • onClose - called when the popup will be closed
  • width - width of the popup window (optional)
  • height - height of the popup window (optional)
  • title - title of the popup window (optional)

Example

const onCode = (code, params) => {
  console.log("wooooo a code", code);
  console.log("alright! the URLSearchParams interface from the popup url", params);
}
const onClose = () => console.log("closed!");

function Comp() {
  return (
    <OauthPopup
      url="http://FriendlyMultiNationalTechConglomerate.com"
      onCode={onCode}
      onClose={onClose}
    >
      <div>Click me to open a Popup</div>
    </OauthPopup>
	);
}

License

MIT