@digital-wafa/react-keycloak - npm Package Compare versions

Comparing version 1.0.1 to 1.1.0

dist/index.esm.js

@@ -1,2 +0,2 @@
-import e,{createContext as o,useContext as t,useState as n,useEffect as r}from"react";import i from"@digital-wafa/logger";function l(){return sessionStorage.getItem("token")}function c(){return sessionStorage.getItem("refresh_token")}function s(e,o){e&&sessionStorage.setItem("token",e),o&&sessionStorage.setItem("refresh_token",o)}function a(e,o,t,n){return new(t||(t=Promise))((function(r,i){function l(e){try{s(n.next(e))}catch(e){i(e)}}function c(e){try{s(n.throw(e))}catch(e){i(e)}}function s(e){var o;e.done?r(e.value):(o=e.value,o instanceof t?o:new t((function(e){e(o)}))).then(l,c)}s((n=n.apply(e,o||[])).next())}))}const u=()=>{i.log(i.Level.INFO,"%clogout","color: yellow; font-weight: bold;"),sessionStorage.removeItem("token"),sessionStorage.removeItem("refresh_token")},f=o(void 0);f.displayName="keycloakContext";const h=()=>{const e=t(f);if(!e)throw new Error("you must use the KeycloakProvider");return e},p=({keycloak:o,loginOptions:t,loadingComponent:r,children:l,isAuthenticated:c=!1})=>{const[h,p]=n(c),g={keycloak:o,loginOptions:t,loadingComponent:r,authenticated:h,setAuthenticated:p};return o.onAuthSuccess=((e,o)=>()=>{i.log(i.Level.INFO,"%cauthenticated","color: yellow; font-weight: bold;"),o(!0),s(e.token,e.refreshToken)})(o,p),o.onAuthRefreshSuccess=(e=>()=>{i.log(i.Level.INFO,"%ctoken refreshed","color: yellow; font-weight: bold;"),s(e.token,e.refreshToken)})(o),o.onTokenExpired=(e=>()=>a(void 0,void 0,void 0,(function*(){i.log(i.Level.INFO,"%ctoken expired","color: yellow; font-weight: bold;"),yield e.updateToken(1)})))(o),o.onAuthRefreshError=((e,o)=>()=>{i.log(i.Level.INFO,"%ctoken not refreshed","color: yellow; font-weight: bold;"),e.login(o)})(o,t),o.onAuthLogout=u,e.createElement(f.Provider,{value:g},l)};function g(o){var{RouteComponent:t,path:n,ComponentToRender:i}=o,l=
+import e,{createContext as o,useContext as t,useState as n,useEffect as r}from"react";import i from"@digital-wafa/logger";function l(){return sessionStorage.getItem("token")}function c(){return sessionStorage.getItem("refresh_token")}function s(e,o){e&&sessionStorage.setItem("token",e),o&&sessionStorage.setItem("refresh_token",o)}function a(e,o,t,n){return new(t||(t=Promise))((function(r,i){function l(e){try{s(n.next(e))}catch(e){i(e)}}function c(e){try{s(n.throw(e))}catch(e){i(e)}}function s(e){var o;e.done?r(e.value):(o=e.value,o instanceof t?o:new t((function(e){e(o)}))).then(l,c)}s((n=n.apply(e,o||[])).next())}))}const u=()=>{i.log(i.Level.INFO,"%clogout","color: yellow; font-weight: bold;"),sessionStorage.removeItem("token"),sessionStorage.removeItem("refresh_token")},f=o(void 0);f.displayName="keycloakContext";const p=()=>{const e=t(f);if(!e)throw new Error("you must use the KeycloakProvider");return e},h=({keycloak:o,loginOptions:t,initOptions:r,loadingComponent:l,children:c,isAuthenticated:p=!1})=>{const[h,g]=n(p),d={keycloak:o,loginOptions:t,initOptions:Object.assign({promiseType:"native",checkLoginIframe:!1},r),loadingComponent:l,authenticated:h,setAuthenticated:g};return o.onAuthSuccess=((e,o)=>()=>{i.log(i.Level.INFO,"%cauthenticated","color: yellow; font-weight: bold;"),o(!0),s(e.token,e.refreshToken)})(o,g),o.onAuthRefreshSuccess=(e=>()=>{i.log(i.Level.INFO,"%ctoken refreshed","color: yellow; font-weight: bold;"),s(e.token,e.refreshToken)})(o),o.onTokenExpired=(e=>()=>a(void 0,void 0,void 0,(function*(){i.log(i.Level.INFO,"%ctoken expired","color: yellow; font-weight: bold;"),yield e.updateToken(1)})))(o),o.onAuthRefreshError=((e,o)=>()=>{i.log(i.Level.INFO,"%ctoken not refreshed","color: yellow; font-weight: bold;"),e.login(o)})(o,t),o.onAuthLogout=u,e.createElement(f.Provider,{value:d},c)};function g(o){var{RouteComponent:t,path:n,ComponentToRender:i}=o,l=
 /*! *****************************************************************************
@@ -16,3 +16,3 @@ Copyright (c) Microsoft Corporation.
 ***************************************************************************** */
-function(e,o){var t={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&o.indexOf(n)<0&&(t[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(n=Object.getOwnPropertySymbols(e);r<n.length;r++)o.indexOf(n[r])<0&&Object.prototype.propertyIsEnumerable.call(e,n[r])&&(t[n[r]]=e[n[r]])}return t}(o,["RouteComponent","path","ComponentToRender"]);const{keycloak:c,authenticated:s,loginOptions:a,loadingComponent:u}=h();return r((function(){s||c.init({promiseType:"native"}).then((function(e){e||c.login(a)}))}),[]),s?i?e.createElement(t,{path:n,component:i}):e.createElement(t,Object.assign({path:n},l)):u}export{p as KeycloakProvider,g as ProtectedRoute,c as getRefreshToken,l as getToken,f as keycloakContext,h as useKeycloakContext};
+function(e,o){var t={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&o.indexOf(n)<0&&(t[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(n=Object.getOwnPropertySymbols(e);r<n.length;r++)o.indexOf(n[r])<0&&Object.prototype.propertyIsEnumerable.call(e,n[r])&&(t[n[r]]=e[n[r]])}return t}(o,["RouteComponent","path","ComponentToRender"]);const{keycloak:c,authenticated:s,loginOptions:a,initOptions:u,loadingComponent:f}=p();return r((function(){s||c.init(u).then((function(e){e||c.login(a)}))}),[]),s?i?e.createElement(t,{path:n,component:i}):e.createElement(t,Object.assign({path:n},l)):f}export{h as KeycloakProvider,g as ProtectedRoute,c as getRefreshToken,l as getToken,f as keycloakContext,p as useKeycloakContext};
 //# sourceMappingURL=index.esm.js.map

dist/index.js

@@ -1,2 +0,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("@digital-wafa/logger");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=o(e),r=o(t);function l(e,t){e&&sessionStorage.setItem("token",e),t&&sessionStorage.setItem("refresh_token",t)}function a(e,t,o,n){return new(o||(o=Promise))((function(r,l){function a(e){try{u(n.next(e))}catch(e){l(e)}}function i(e){try{u(n.throw(e))}catch(e){l(e)}}function u(e){var t;e.done?r(e.value):(t=e.value,t instanceof o?t:new o((function(e){e(t)}))).then(a,i)}u((n=n.apply(e,t||[])).next())}))}const i=()=>{r.default.log(r.default.Level.INFO,"%clogout","color: yellow; font-weight: bold;"),sessionStorage.removeItem("token"),sessionStorage.removeItem("refresh_token")},u=e.createContext(void 0);u.displayName="keycloakContext";const c=()=>{const t=e.useContext(u);if(!t)throw new Error("you must use the KeycloakProvider");return t};exports.KeycloakProvider=({keycloak:t,loginOptions:o,loadingComponent:c,children:s,isAuthenticated:f=!1})=>{const[d,p]=e.useState(f),h={keycloak:t,loginOptions:o,loadingComponent:c,authenticated:d,setAuthenticated:p};return t.onAuthSuccess=((e,t)=>()=>{r.default.log(r.default.Level.INFO,"%cauthenticated","color: yellow; font-weight: bold;"),t(!0),l(e.token,e.refreshToken)})(t,p),t.onAuthRefreshSuccess=(e=>()=>{r.default.log(r.default.Level.INFO,"%ctoken refreshed","color: yellow; font-weight: bold;"),l(e.token,e.refreshToken)})(t),t.onTokenExpired=(e=>()=>a(void 0,void 0,void 0,(function*(){r.default.log(r.default.Level.INFO,"%ctoken expired","color: yellow; font-weight: bold;"),yield e.updateToken(1)})))(t),t.onAuthRefreshError=((e,t)=>()=>{r.default.log(r.default.Level.INFO,"%ctoken not refreshed","color: yellow; font-weight: bold;"),e.login(t)})(t,o),t.onAuthLogout=i,n.default.createElement(u.Provider,{value:h},s)},exports.ProtectedRoute=function(t){var{RouteComponent:o,path:r,ComponentToRender:l}=t,a=
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("@digital-wafa/logger");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var n=o(e),r=o(t);function i(e,t){e&&sessionStorage.setItem("token",e),t&&sessionStorage.setItem("refresh_token",t)}function l(e,t,o,n){return new(o||(o=Promise))((function(r,i){function l(e){try{c(n.next(e))}catch(e){i(e)}}function a(e){try{c(n.throw(e))}catch(e){i(e)}}function c(e){var t;e.done?r(e.value):(t=e.value,t instanceof o?t:new o((function(e){e(t)}))).then(l,a)}c((n=n.apply(e,t||[])).next())}))}const a=()=>{r.default.log(r.default.Level.INFO,"%clogout","color: yellow; font-weight: bold;"),sessionStorage.removeItem("token"),sessionStorage.removeItem("refresh_token")},c=e.createContext(void 0);c.displayName="keycloakContext";const s=()=>{const t=e.useContext(c);if(!t)throw new Error("you must use the KeycloakProvider");return t};exports.KeycloakProvider=({keycloak:t,loginOptions:o,initOptions:s,loadingComponent:u,children:f,isAuthenticated:d=!1})=>{const[p,g]=e.useState(d),h={keycloak:t,loginOptions:o,initOptions:Object.assign({promiseType:"native",checkLoginIframe:!1},s),loadingComponent:u,authenticated:p,setAuthenticated:g};return t.onAuthSuccess=((e,t)=>()=>{r.default.log(r.default.Level.INFO,"%cauthenticated","color: yellow; font-weight: bold;"),t(!0),i(e.token,e.refreshToken)})(t,g),t.onAuthRefreshSuccess=(e=>()=>{r.default.log(r.default.Level.INFO,"%ctoken refreshed","color: yellow; font-weight: bold;"),i(e.token,e.refreshToken)})(t),t.onTokenExpired=(e=>()=>l(void 0,void 0,void 0,(function*(){r.default.log(r.default.Level.INFO,"%ctoken expired","color: yellow; font-weight: bold;"),yield e.updateToken(1)})))(t),t.onAuthRefreshError=((e,t)=>()=>{r.default.log(r.default.Level.INFO,"%ctoken not refreshed","color: yellow; font-weight: bold;"),e.login(t)})(t,o),t.onAuthLogout=a,n.default.createElement(c.Provider,{value:h},f)},exports.ProtectedRoute=function(t){var{RouteComponent:o,path:r,ComponentToRender:i}=t,l=
 /*! *****************************************************************************
@@ -16,3 +16,3 @@ Copyright (c) Microsoft Corporation.
 ***************************************************************************** */
-function(e,t){var o={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&t.indexOf(n)<0&&(o[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(n=Object.getOwnPropertySymbols(e);r<n.length;r++)t.indexOf(n[r])<0&&Object.prototype.propertyIsEnumerable.call(e,n[r])&&(o[n[r]]=e[n[r]])}return o}(t,["RouteComponent","path","ComponentToRender"]);const{keycloak:i,authenticated:u,loginOptions:s,loadingComponent:f}=c();return e.useEffect((function(){u||i.init({promiseType:"native"}).then((function(e){e||i.login(s)}))}),[]),u?l?n.default.createElement(o,{path:r,component:l}):n.default.createElement(o,Object.assign({path:r},a)):f},exports.getRefreshToken=function(){return sessionStorage.getItem("refresh_token")},exports.getToken=function(){return sessionStorage.getItem("token")},exports.keycloakContext=u,exports.useKeycloakContext=c;
+function(e,t){var o={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&t.indexOf(n)<0&&(o[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(n=Object.getOwnPropertySymbols(e);r<n.length;r++)t.indexOf(n[r])<0&&Object.prototype.propertyIsEnumerable.call(e,n[r])&&(o[n[r]]=e[n[r]])}return o}(t,["RouteComponent","path","ComponentToRender"]);const{keycloak:a,authenticated:c,loginOptions:u,initOptions:f,loadingComponent:d}=s();return e.useEffect((function(){c||a.init(f).then((function(e){e||a.login(u)}))}),[]),c?i?n.default.createElement(o,{path:r,component:i}):n.default.createElement(o,Object.assign({path:r},l)):d},exports.getRefreshToken=function(){return sessionStorage.getItem("refresh_token")},exports.getToken=function(){return sessionStorage.getItem("token")},exports.keycloakContext=c,exports.useKeycloakContext=s;
 //# sourceMappingURL=index.js.map

dist/keycloakContext.d.ts

 import React, { ReactChild } from "react";
-import { KeycloakInstance, KeycloakLoginOptions } from "keycloak-js";
+import { KeycloakInitOptions, KeycloakInstance, KeycloakLoginOptions } from "keycloak-js";
 interface KeycloakContextType {
     keycloak: KeycloakInstance;
     loginOptions: KeycloakLoginOptions;
+    initOptions: KeycloakInitOptions;
     authenticated: boolean;
@@ -18,3 +19,7 @@ setAuthenticated: Function;
      */
-    loginOptions: KeycloakLoginOptions;
+    loginOptions?: KeycloakLoginOptions;
+    /**
+     * keycloak init options
+     */
+    initOptions?: KeycloakInitOptions;
     children: ReactChild;
@@ -32,3 +37,3 @@ /**
 export declare const useKeycloakContext: () => KeycloakContextType;
-export declare const KeycloakProvider: ({ keycloak, loginOptions, loadingComponent, children, isAuthenticated }: KeycloakProviderProps) => JSX.Element;
+export declare const KeycloakProvider: ({ keycloak, loginOptions, initOptions, loadingComponent, children, isAuthenticated }: KeycloakProviderProps) => JSX.Element;
 export {};

package.json

 {
   "name": "@digital-wafa/react-keycloak",
-  "version": "1.0.1",
+  "version": "1.1.0",
   "description": "a keycloak library for react",
@@ -20,3 +20,5 @@ "main": "dist/index.js",
     "private",
-    "route"
+    "route",
+    "protectedRoute",
+    "guard"
   ],
@@ -23,0 +25,0 @@ "author": "Abdelmounim JAKIM <[e-mail]>",

README.md

@@ -9,2 +9,4 @@ ![react-keycloak logo](images/logo.png)
 ![size](https://img.shields.io/bundlephobia/minzip/@digital-wafa/react-keycloak)
+![downloads](https://img.shields.io/npm/dw/@digital-wafa/react-keycloak)
+![license](https://img.shields.io/github/license/digital-wafa/react-keycloak)
 
@@ -38,7 +40,8 @@ ---
 
-| Props            | Required | Description                                                           |
-| ---------------- | -------  | --------------------------------------------------------------------- |
-| keycloak         | yes     | the keycloak instance you created                                     |
-| loginOptions     | yes     | the keycloak login options                                            |
-| loadingComponent | only if you use the included `ProtectedRoute` component     | the loading component to show when redirecting to keycloak login page|
+| Props            | Required                                                    | Description                                                           |
+| ---------------- | ------------------------------------------------------------| --------------------------------------------------------------------- |
+| keycloak         | yes                                                         | the keycloak instance you created                                     |
+| loginOptions     | no                                                          | keycloak login options                                                |
+| initOptions      | no                                                          | keycloak init options                                                 |
+| loadingComponent | only if you use the included `ProtectedRoute` component     | the loading component to show when redirecting to keycloak login page |
 
@@ -68,2 +71,3 @@ <br>
   loginOptions, // keycloak login options
+  initOptions, // keycloak init options
   authenticated // is the user authenticated or not
@@ -76,6 +80,18 @@ }
 
-const {keycloak, authenticated, loginOptions} = useKeycloakContext();
+const {keycloak, authenticated, loginOptions, initOptions} = useKeycloakContext();
 ```
 
+or import the context if you are using a class component 
 
+```javascript
+import { keycloakContext } from "@digital-wafa/react-keycloak"
+
+...
+
+class YourClassComponent extends React.Component {
+  static contextType = keycloakContext;
+  const {keycloak, authenticated, loginOptions, initOptions} = this.context;
+} 
+```
+
 NB: the token is refreshed automatically when it expire using the `onTokenExpired` event.
@@ -82,0 +98,0 @@

No alert changes

Improved metrics

Total package byte prevSize

65534

increased by5.47%

Number of package files

28

increased by3.7%

Lines of code

614

increased by7.72%

Number of lines in readme file

142

increased by12.7%

No dependency changes