Support IE by redirect link to LinkedInPopUp

Author: nvh95

demo/src/LinkedInPage.js

@@ -33,6 +33,8 @@ class LinkedInPage extends Component {
           state="34232423"
           onFailure={this.handleFailure}
           onSuccess={this.handleSuccess}
+          supportIE
+          redirectPath='/linkedin'
         >
           <img src={require('./assets/linkedin.png')} alt="Log in with Linked In" style={{ maxWidth: '180px' }} />
         </LinkedIn>

src/LinkedIn.js

@@ -20,10 +20,14 @@ export class LinkedIn extends Component {
   }
 
   getUrl = () => {
-    const {redirectUri, clientId, state, scope} = this.props;
+    const {redirectUri, clientId, state, scope, supportIE, redirectPath } = this.props;
     // TODO: Support IE 11
-    const scopeParam = (scope) ? `&scope=${encodeURI(scope)}` : ''
+    const scopeParam = (scope) ? `&scope=${supportIE ? scope : encodeURI(scope)}` : '';
     const linkedInAuthenLink = `https://www.linkedin.com/oauth/v2/authorization?response_type=code&client_id=${clientId}&redirect_uri=${redirectUri}${scopeParam}&state=${state}`;
+    if (supportIE) {
+      const redirectLink = `${window.location.origin}${redirectPath}?linkedin_redirect_url=${encodeURIComponent(linkedInAuthenLink)}`;
+      return redirectLink;
+    }
     return linkedInAuthenLink;
   }
 
@@ -85,5 +89,7 @@ LinkedIn.defaultProps = {
   disabled: false,
   children: (<img src={require('../assets/linkedin.png')} alt="Log in with Linked In" style={{ maxWidth: '180px' }} />),
   state: 'fdsf78fyds7fm',
+  supportIE: false,
+  redirectPath: '/linkedin'
 };
 export default LinkedIn;

src/LinkedInPopUp.js

@@ -15,6 +15,9 @@ class LinkedInPopUp extends Component {
     if (params.code) {
       window.opener && window.opener.postMessage({ code: params.code, state: params.state, from: 'Linked In'}, window.location.origin);
     }
+    if(params.linkedin_redirect_url) {
+      window.location.href = params.linkedin_redirect_url
+    }
   }
   render() {
     return null;