@opencampus/ocid-connect-js 1.2.0 → 1.2.2

package/README.md

@@ -110,7 +110,7 @@ Use useOCAuth hook to read credentials info
 import { useOCAuth } from '@opencampus/ocid-connect-js';
 
 const UserTokenPage = (props) => {
-    const { authState, ocAuth } = useOCAuth();
+    const { authState, ocAuth, OCId, ethAddress } = useOCAuth();
 
     if (authState.error !== undefined) {
         return <div>Error: {authState.error.message}</div>;
@@ -119,8 +119,10 @@ const UserTokenPage = (props) => {
             <div>
                 <h4>User Info</h4>
                 <pre>
-                { JSON.stringify(ocAuth.getAuthInfo(), null, 2) }
+                { JSON.stringify(ocAuth.getAuthState(), null, 2) }
                 </pre>
+                <pre>{OCId}</pre>
+                <pre>{ethAddress}</pre>
             </div>
         );
     }
@@ -298,7 +300,7 @@ export default function Home() {
     <div>
       <h1>Welcome to My App</h1>
       {authState.isAuthenticated ? (
-        <p>You are logged in! {JSON.stringify(ocAuth.getAuthInfo())}</p>
+        <p>You are logged in! {JSON.stringify(ocAuth.getAuthState())}</p>
         
       ) : (
         <LoginButton />
@@ -328,8 +330,8 @@ Main Methods of Auth SDK
 | --- | --- |
 | signInWithRedirect | Initialize login process. Accept "state" as an input |
 | handleLoginRedirect | Return the auth state of the login process |
-| getAuthInfo | Return auth object { edu_username, eth_address } |
-| getAuthState | Return auth state data { accessToken, idToken, isAuthenticated } |
+| getAuthState | Return auth state data { accessToken, idToken, OCId, ethAddress, isAuthenticated } |
+| getStateParameter() | Return the state that was initialized in signin process |
 
 Sample usage
 
@@ -369,5 +371,12 @@ try {
 }
 ```
 
+Access OCId info of Auth SDK
+
+| property | Description |
+| --- | --- |
+| OCId | return OC ID |
+| ethAddress | Return eth Wallet Address that connect to the ID |
+
 ### License
 ocid-connect-js is released under the MIT license.

package/dist/ocid-connect-js.js

@@ -360,51 +360,36 @@ var LoginCallBack = function LoginCallBack(_ref) {
   var _useOCAuth = Object(_OCContext__WEBPACK_IMPORTED_MODULE_1__["useOCAuth"])(),
     ocAuth = _useOCAuth.ocAuth,
     authState = _useOCAuth.authState,
-    updateAuthState = _useOCAuth.updateAuthState;
+    setAuthError = _useOCAuth.setAuthError;
   Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
     var handleLogin = /*#__PURE__*/function () {
       var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
-        var _authState;
         return _regeneratorRuntime().wrap(function _callee$(_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
               if (!ocAuth) {
-                _context.next = 12;
+                _context.next = 11;
                 break;
               }
               _context.prev = 1;
               _context.next = 4;
               return ocAuth.handleLoginRedirect();
             case 4:
-              _authState = _context.sent;
-              if (_authState.idToken) {
-                updateAuthState(_authState);
-                handledRedirect = true;
-                successCallback();
-              } else {
-                updateAuthState({
-                  error: 'missing idToken from redirect callback'
-                });
-                if (errorCallback) {
-                  errorCallback();
-                }
-              }
-              _context.next = 12;
+              successCallback();
+              _context.next = 11;
               break;
-            case 8:
-              _context.prev = 8;
+            case 7:
+              _context.prev = 7;
               _context.t0 = _context["catch"](1);
-              updateAuthState({
-                error: _context.t0
-              });
+              setAuthError(_context.t0);
               if (errorCallback) {
                 errorCallback();
               }
-            case 12:
+            case 11:
             case "end":
               return _context.stop();
           }
-        }, _callee, null, [[1, 8]]);
+        }, _callee, null, [[1, 7]]);
       }));
       return function handleLogin() {
         return _ref2.apply(this, arguments);
@@ -458,34 +443,53 @@ var OCConnect = function OCConnect(_ref) {
     _useState2 = _slicedToArray(_useState, 2),
     ocAuth = _useState2[0],
     setOcAuth = _useState2[1];
-  var _useState3 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])({
+  var _useState3 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(),
+    _useState4 = _slicedToArray(_useState3, 2),
+    OCId = _useState4[0],
+    setOCId = _useState4[1];
+  var _useState5 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(),
+    _useState6 = _slicedToArray(_useState5, 2),
+    ethAddress = _useState6[0],
+    setEthAddress = _useState6[1];
+  var _useState7 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])({
       isAuthenticated: false
     }),
-    _useState4 = _slicedToArray(_useState3, 2),
-    authState = _useState4[0],
-    setAuthState = _useState4[1];
+    _useState8 = _slicedToArray(_useState7, 2),
+    authState = _useState8[0],
+    setAuthState = _useState8[1];
+  var _useState9 = Object(react__WEBPACK_IMPORTED_MODULE_0__["useState"])(null),
+    _useState10 = _slicedToArray(_useState9, 2),
+    authError = _useState10[0],
+    setAuthError = _useState10[1];
+  var updateAuthState = function updateAuthState(authState) {
+    setAuthState(authState);
+    setOCId(authState.OCId);
+    setEthAddress(authState.ethAddress);
+  };
+
+  // init sdk
   Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
     var authSdk = sandboxMode ? new _sdk_auth__WEBPACK_IMPORTED_MODULE_2__["OCAuthSandbox"](opts) : new _sdk_auth__WEBPACK_IMPORTED_MODULE_2__["OCAuthLive"](opts);
-    setOcAuth(authSdk);
     updateAuthState(authSdk.getAuthState());
+    setOcAuth(authSdk);
   }, []);
-  var updateAuthState = function updateAuthState(authState) {
-    var accessToken = authState.accessToken,
-      idToken = authState.idToken,
-      isAuthenticated = authState.isAuthenticated,
-      error = authState.error;
-    setAuthState({
-      accessToken: accessToken,
-      idToken: idToken,
-      isAuthenticated: isAuthenticated,
-      error: error
-    });
-  };
+  Object(react__WEBPACK_IMPORTED_MODULE_0__["useEffect"])(function () {
+    if (ocAuth.authInfoManager) {
+      // reactively recieve update on the authstate change
+      ocAuth.authInfoManager.subscribe(updateAuthState);
+      return function () {
+        ocAuth.authInfoManager.unsubscribe(updateAuthState);
+      };
+    }
+  }, [ocAuth]);
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_OCContext__WEBPACK_IMPORTED_MODULE_1__["OCContext"].Provider, {
     value: {
+      OCId: OCId,
+      ethAddress: ethAddress,
       ocAuth: ocAuth,
       authState: authState,
-      updateAuthState: updateAuthState
+      authError: authError,
+      setAuthError: setAuthError
     }
   }, children);
 };
@@ -639,7 +643,7 @@ var OCAuthCore = /*#__PURE__*/function () {
                 break;
               }
               _context3.next = 7;
-              return this.tokenManager.exchangeTokenFromCode(urlParams.code, codeVerifier);
+              return this.tokenManager.exchangeTokenFromCode(urlParams.code, codeVerifier, urlParams.state);
             case 7:
               // clear transaction meta, coz it's completed
               this.transactionManager.clear();
@@ -672,30 +676,21 @@ var OCAuthCore = /*#__PURE__*/function () {
       if (this.tokenManager.hasExpired()) {
         this.authInfoManager.clear();
       } else {
-        var idToken = this.tokenManager.getIdToken();
-        var _parseJwt = Object(_utils__WEBPACK_IMPORTED_MODULE_4__["parseJwt"])(idToken),
-          edu_username = _parseJwt.edu_username,
-          eth_address = _parseJwt.eth_address;
-        this.authInfoManager.setIdInfo({
-          edu_username: edu_username,
-          eth_address: eth_address
-        });
+        var _this$getParsedIdToke = this.getParsedIdToken(),
+          edu_username = _this$getParsedIdToke.edu_username,
+          eth_address = _this$getParsedIdToke.eth_address;
+        this.authInfoManager.setAuthState(this.getAccessToken(), this.getIdToken(), edu_username, eth_address, this.isAuthenticated());
       }
     }
   }, {
     key: "getAuthState",
     value: function getAuthState() {
-      var authState = {
-        accessToken: this.getAccessToken(),
-        idToken: this.getIdToken(),
-        isAuthenticated: this.isAuthenticated()
-      };
-      return authState;
+      return this.authInfoManager.getAuthState();
     }
   }, {
-    key: "getAuthInfo",
-    value: function getAuthInfo() {
-      return this.authInfoManager.getAuthInfo();
+    key: "getStateParameter",
+    value: function getStateParameter() {
+      return this.tokenManager.getStateParameter();
     }
   }, {
     key: "getIdToken",
@@ -707,6 +702,40 @@ var OCAuthCore = /*#__PURE__*/function () {
     value: function getAccessToken() {
       return this.tokenManager.getAccessToken();
     }
+  }, {
+    key: "getParsedIdToken",
+    value: function getParsedIdToken() {
+      // return all info in id token
+      var idToken = this.tokenManager.getIdToken();
+      if (idToken) {
+        return Object(_utils__WEBPACK_IMPORTED_MODULE_4__["parseJwt"])(idToken);
+      }
+      return {};
+    }
+  }, {
+    key: "getParsedAccessToken",
+    value: function getParsedAccessToken() {
+      // return all info in access token
+      var accessToken = this.tokenManager.getAccessToken();
+      if (accessToken) {
+        return Object(_utils__WEBPACK_IMPORTED_MODULE_4__["parseJwt"])(accessToken);
+      }
+      return {};
+    }
+  }, {
+    key: "OCId",
+    get: function get() {
+      var _info$OCId;
+      var info = this.authInfoManager.getAuthState();
+      return (_info$OCId = info.OCId) !== null && _info$OCId !== void 0 ? _info$OCId : null;
+    }
+  }, {
+    key: "ethAddress",
+    get: function get() {
+      var _info$ethAddress;
+      var info = this.authInfoManager.getAuthState();
+      return (_info$ethAddress = info.ethAddress) !== null && _info$ethAddress !== void 0 ? _info$ethAddress : null;
+    }
   }]);
 }();
 var LIVE_PUBLIC_KEY = 'MFkwEwYHKoZIzj0CAQYIKoZIzj0DAQcDQgAEBIDHtLbgVM76SXZ4iuIjuO+ERQPnVpJzagOsZdYxFG3ZJmvfdpr/Z29SLUbdZWafrOlAVlKe1Ovf/tcH671tTw==';
@@ -762,6 +791,7 @@ var OCAuthSandbox = /*#__PURE__*/function (_OCAuthCore3) {
 
 "use strict";
 __webpack_require__.r(__webpack_exports__);
+!(function webpackMissingModule() { var e = new Error("Cannot find module 'tiny-emitter'"); e.code = 'MODULE_NOT_FOUND'; throw e; }());
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
 function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
@@ -778,35 +808,48 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
 * 
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
  */
+
+
+var EVENT_AUTH_STATE_CHANGE = 'authStateChange';
 var AuthInfoManager = /*#__PURE__*/function () {
   function AuthInfoManager() {
     _classCallCheck(this, AuthInfoManager);
-    _defineProperty(this, "_idInfo", void 0);
+    _defineProperty(this, "_emmitter", void 0);
+    _defineProperty(this, "_authState", void 0);
     this._authState = null;
-    this._idInfo = null;
+    this._emitter = new !(function webpackMissingModule() { var e = new Error("Cannot find module 'tiny-emitter'"); e.code = 'MODULE_NOT_FOUND'; throw e; }())();
   }
   return _createClass(AuthInfoManager, [{
-    key: "setIdInfo",
-    value: function setIdInfo(IdInfo) {
-      this._idInfo = Object.assign({}, IdInfo);
-    }
-  }, {
-    key: "getIdInfoAttribute",
-    value: function getIdInfoAttribute(attribute) {
-      if (this._idInfo === null) {
-        return undefined;
-      }
-      return this._idInfo[attribute];
+    key: "setAuthState",
+    value: function setAuthState(accessToken, idToken, OCId, ethAddress, isAuthenticated) {
+      this._authState = {
+        accessToken: accessToken,
+        idToken: idToken,
+        OCId: OCId,
+        ethAddress: ethAddress,
+        isAuthenticated: isAuthenticated
+      };
+      this._emitter.emit(EVENT_AUTH_STATE_CHANGE, this._authState);
     }
   }, {
-    key: "getAuthInfo",
-    value: function getAuthInfo() {
-      return Object.assign({}, this._idInfo);
+    key: "getAuthState",
+    value: function getAuthState() {
+      return Object.assign({}, this._authState);
     }
   }, {
     key: "clear",
     value: function clear() {
-      this._idInfo = null;
+      this._authState = null;
+    }
+  }, {
+    key: "subscribe",
+    value: function subscribe(handler) {
+      this._emitter.on(EVENT_AUTH_STATE_CHANGE, handler);
+    }
+  }, {
+    key: "unsubscribe",
+    value: function unsubscribe(handler) {
+      this._emitter.off(EVENT_AUTH_STATE_CHANGE, handler);
     }
   }]);
 }();
@@ -865,16 +908,27 @@ var TokenManager = /*#__PURE__*/function () {
     key: "exchangeTokenFromCode",
     value: function () {
       var _exchangeTokenFromCode = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(accessCode, codeVerifier) {
-        var body, response, _yield$response$json, access_token, id_token, pubKey, tokenVerified, parsedAccessToken;
+        var state,
+          body,
+          response,
+          _yield$response$json,
+          access_token,
+          id_token,
+          pubKey,
+          tokenVerified,
+          parsedAccessToken,
+          storageData,
+          _args = arguments;
         return _regeneratorRuntime().wrap(function _callee$(_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
+              state = _args.length > 2 && _args[2] !== undefined ? _args[2] : null;
               body = {
                 accessCode: accessCode,
                 codeVerifier: codeVerifier
               };
-              _context.prev = 1;
-              _context.next = 4;
+              _context.prev = 2;
+              _context.next = 5;
               return fetch(this.tokenEndPoint, {
                 method: 'POST',
                 headers: {
@@ -882,58 +936,66 @@ var TokenManager = /*#__PURE__*/function () {
                 },
                 body: JSON.stringify(body)
               });
-            case 4:
+            case 5:
               response = _context.sent;
-              _context.next = 7;
+              _context.next = 8;
               return response.json();
-            case 7:
+            case 8:
               _yield$response$json = _context.sent;
               access_token = _yield$response$json.access_token;
               id_token = _yield$response$json.id_token;
               if (!(!access_token || !id_token)) {
-                _context.next = 12;
+                _context.next = 13;
                 break;
               }
               throw new _utils_errors__WEBPACK_IMPORTED_MODULE_2__["AuthError"]('Fail to exchange token');
-            case 12:
-              _context.next = 14;
+            case 13:
+              _context.next = 15;
               return this.getPublicKey();
-            case 14:
+            case 15:
               pubKey = _context.sent;
-              _context.next = 17;
+              _context.next = 18;
               return Object(_crypto__WEBPACK_IMPORTED_MODULE_1__["verifyToken"])(id_token, pubKey);
-            case 17:
+            case 18:
               tokenVerified = _context.sent;
               if (tokenVerified) {
-                _context.next = 20;
+                _context.next = 21;
                 break;
               }
               throw new _utils_errors__WEBPACK_IMPORTED_MODULE_2__["AuthError"]('Unable to verify token');
-            case 20:
+            case 21:
               parsedAccessToken = Object(_utils__WEBPACK_IMPORTED_MODULE_0__["parseJwt"])(access_token);
-              this.storageManager.getStorageObject().setStorage({
+              storageData = Object.assign({
                 access_token: access_token,
                 id_token: id_token,
                 expired: parsedAccessToken.exp
+              }, state && {
+                state: state
               });
-              _context.next = 28;
+              this.storageManager.getStorageObject().setStorage(storageData);
+              _context.next = 30;
               break;
-            case 24:
-              _context.prev = 24;
-              _context.t0 = _context["catch"](1);
+            case 26:
+              _context.prev = 26;
+              _context.t0 = _context["catch"](2);
               console.log(_context.t0);
               throw new _utils_errors__WEBPACK_IMPORTED_MODULE_2__["AuthError"]('Token acquisition failed');
-            case 28:
+            case 30:
             case "end":
               return _context.stop();
           }
-        }, _callee, this, [[1, 24]]);
+        }, _callee, this, [[2, 26]]);
       }));
       function exchangeTokenFromCode(_x, _x2) {
         return _exchangeTokenFromCode.apply(this, arguments);
       }
       return exchangeTokenFromCode;
     }()
+  }, {
+    key: "getStateParameter",
+    value: function getStateParameter() {
+      return this.storageManager.getStorageObject().getItem('state');
+    }
   }, {
     key: "getIdToken",
     value: function getIdToken() {