@ssplib/react-components 0.0.147 → 0.0.150

package/components/form/table/Table.js

@@ -413,18 +413,15 @@ function Table({ columns, fetchFunc, emptyMsg = {
             } //
             else if (type === 'items') {
                 rawList = rawList
-                    .filter((x) => x[keyName].toLowerCase() === customValue)
+                    .filter((x) => x[keyName].toLowerCase().includes(customValue))
                     .sort((a, b) => {
                     const aValue = a[keyName];
                     const bValue = b[keyName];
                     const valueA = typeof aValue === 'number' ? aValue : aValue.toLowerCase();
                     const valueB = typeof bValue === 'number' ? bValue : bValue.toLowerCase();
-                    // const aRKey = a[referencekey ?? '']
-                    // const bRKey = b[referencekey ?? '']
-                    // if (valueA === customValue) console.log(valueA, valueB, aRKey, bRKey)
-                    if (valueA === customValue)
+                    if (valueA.includes(customValue))
                         return -1;
-                    if (valueB === customValue)
+                    if (valueB.includes(customValue))
                         return 1;
                     if (valueA < valueB) {
                         return -1;

package/components/providers/KeycloakAuthProvider.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+export declare const cookieName = "nextauth.token";
+export declare function KeycloakAuthProvider({ url, realm, clientId, children }: {
+    url: string;
+    realm: string;
+    clientId: string;
+    children: JSX.Element | JSX.Element[];
+}): JSX.Element;

package/components/providers/KeycloakAuthProvider.js

@@ -0,0 +1,94 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.KeycloakAuthProvider = exports.cookieName = void 0;
+const router_1 = require("next/router");
+const react_1 = __importStar(require("react"));
+const auth_1 = require("../../context/auth");
+const keycloak_js_1 = __importDefault(require("keycloak-js"));
+exports.cookieName = 'nextauth.token';
+const userImgName = 'user-data.img';
+function KeycloakAuthProvider({ url, realm, clientId, children }) {
+    const [user, setUser] = (0, react_1.useState)();
+    const [userLoaded, setUserLoaded] = (0, react_1.useState)(false);
+    const [kc, setKc] = (0, react_1.useState)(null);
+    const [token, setToken] = (0, react_1.useState)(undefined);
+    const router = (0, router_1.useRouter)();
+    const isAuth = !!user;
+    (0, react_1.useEffect)(() => {
+        const keycloak = new keycloak_js_1.default({
+            url: url,
+            realm: realm,
+            clientId: clientId,
+        });
+        setKc(keycloak);
+        keycloak
+            .init({
+            onLoad: 'check-sso',
+            pkceMethod: 'S256',
+        })
+            .then((auth) => {
+            var _a, _b;
+            setUserLoaded(true);
+            if (!auth) {
+                console.log('NAO AUTENTICADO');
+                //window.location.reload();
+            }
+            else {
+                const tokenParsed = keycloak.tokenParsed;
+                const userData = Object.assign(Object.assign({}, tokenParsed), { token: keycloak.token, roles: ((_b = ((_a = tokenParsed === null || tokenParsed === void 0 ? void 0 : tokenParsed.resource_access) !== null && _a !== void 0 ? _a : {})['eventos-front']) !== null && _b !== void 0 ? _b : []).roles });
+                setUser(userData);
+                console.info('Authenticated!!!');
+                keycloak.onTokenExpired = () => {
+                    console.log('token expired');
+                };
+            }
+        }, () => {
+            console.error('Authenticated Failed');
+        });
+        const s = router.query['status'];
+        if (!s)
+            return;
+        if (s === 'success') {
+            window.history.replaceState(null, '', '/');
+        }
+    }, []);
+    function login() {
+        kc === null || kc === void 0 ? void 0 : kc.login();
+    }
+    function logout() {
+        setUserLoaded(false);
+        console.log('TENTANDO DESLOGAR');
+        console.log(kc);
+        kc === null || kc === void 0 ? void 0 : kc.logout();
+        setUser(null);
+        localStorage.removeItem(userImgName);
+    }
+    return react_1.default.createElement(auth_1.AuthContext.Provider, { value: { user, isAuth, userLoaded, login, logout, saveUserData: () => { }, type: 'ad' } }, children);
+}
+exports.KeycloakAuthProvider = KeycloakAuthProvider;

package/components/providers/OAuthProvider.js

@@ -133,6 +133,6 @@ function OAuthProvider({ children, AUTH_URL, oidcConfig, redirectURL, validateTo
             setUserLoaded(true);
         });
     }
-    return react_1.default.createElement(auth_1.AuthContext.Provider, { value: { user, isAuth, userLoaded, login, adLogin: () => { }, logout, saveUserData, type: 'govbr' } }, children);
+    return react_1.default.createElement(auth_1.AuthContext.Provider, { value: { user, isAuth, userLoaded, login, logout, saveUserData, type: 'govbr' } }, children);
 }
 exports.OAuthProvider = OAuthProvider;

package/index.d.ts

@@ -18,14 +18,13 @@ import Table from './components/form/table/Table';
 import NavBar from './components/navbar/NavBar';
 import FormProvider from './components/providers/FormProvider';
 import { OAuthProvider, cookieName as AUTH_COOKIE_NAME } from './components/providers/OAuthProvider';
-import { LoginProvider } from './components/providers/LoginProvider';
 import { AuthContext } from './context/auth';
 import { FormContext } from './context/form';
-import { Login } from './components/page/Login';
 import { Category } from './components/detalhes/Category';
 import { Field } from './components/detalhes/Field';
 import { FieldLabel } from './components/detalhes/FieldLabel';
 import { File } from './components/detalhes/File';
 import CheckBoxAdditional from './components/form/checkbox/CheckBoxAdditional';
 import RequiredCheckBoxGroup from './components/form/checkbox/RequiredCheckBoxValidator';
-export { CheckBox, CheckBoxWarning, DatePicker, TimePicker, FileUpload, ActiveInput, AutoComplete, FetchAutoComplete, Input, MaskInput, MultInput, OtherCheckBox, Stepper, StepperBlock, Switch, SwitchWatch, ToggleVisibility, Table, NavBar, FormProvider, OAuthProvider, AUTH_COOKIE_NAME, AuthContext, FormContext, LoginProvider, CheckBoxAdditional, RequiredCheckBoxGroup, Category, Field, FieldLabel, File, Login as LoginPage };
+import { KeycloakAuthProvider } from './components/providers/KeycloakAuthProvider';
+export { CheckBox, CheckBoxWarning, DatePicker, TimePicker, FileUpload, ActiveInput, AutoComplete, FetchAutoComplete, Input, MaskInput, MultInput, OtherCheckBox, Stepper, StepperBlock, Switch, SwitchWatch, ToggleVisibility, Table, NavBar, FormProvider, OAuthProvider, AUTH_COOKIE_NAME, AuthContext, FormContext, KeycloakAuthProvider, CheckBoxAdditional, RequiredCheckBoxGroup, Category, Field, FieldLabel, File, };

package/index.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.LoginPage = exports.File = exports.FieldLabel = exports.Field = exports.Category = exports.RequiredCheckBoxGroup = exports.CheckBoxAdditional = exports.LoginProvider = exports.FormContext = exports.AuthContext = exports.AUTH_COOKIE_NAME = exports.OAuthProvider = exports.FormProvider = exports.NavBar = exports.Table = exports.ToggleVisibility = exports.SwitchWatch = exports.Switch = exports.StepperBlock = exports.Stepper = exports.OtherCheckBox = exports.MultInput = exports.MaskInput = exports.Input = exports.FetchAutoComplete = exports.AutoComplete = exports.ActiveInput = exports.FileUpload = exports.TimePicker = exports.DatePicker = exports.CheckBoxWarning = exports.CheckBox = void 0;
+exports.File = exports.FieldLabel = exports.Field = exports.Category = exports.RequiredCheckBoxGroup = exports.CheckBoxAdditional = exports.KeycloakAuthProvider = exports.FormContext = exports.AuthContext = exports.AUTH_COOKIE_NAME = exports.OAuthProvider = exports.FormProvider = exports.NavBar = exports.Table = exports.ToggleVisibility = exports.SwitchWatch = exports.Switch = exports.StepperBlock = exports.Stepper = exports.OtherCheckBox = exports.MultInput = exports.MaskInput = exports.Input = exports.FetchAutoComplete = exports.AutoComplete = exports.ActiveInput = exports.FileUpload = exports.TimePicker = exports.DatePicker = exports.CheckBoxWarning = exports.CheckBox = void 0;
 const CheckBox_1 = __importDefault(require("./components/form/checkbox/CheckBox"));
 exports.CheckBox = CheckBox_1.default;
 const CheckBoxWarning_1 = __importDefault(require("./components/form/checkbox/CheckBoxWarning"));
@@ -46,14 +46,10 @@ exports.FormProvider = FormProvider_1.default;
 const OAuthProvider_1 = require("./components/providers/OAuthProvider");
 Object.defineProperty(exports, "OAuthProvider", { enumerable: true, get: function () { return OAuthProvider_1.OAuthProvider; } });
 Object.defineProperty(exports, "AUTH_COOKIE_NAME", { enumerable: true, get: function () { return OAuthProvider_1.cookieName; } });
-const LoginProvider_1 = require("./components/providers/LoginProvider");
-Object.defineProperty(exports, "LoginProvider", { enumerable: true, get: function () { return LoginProvider_1.LoginProvider; } });
 const auth_1 = require("./context/auth");
 Object.defineProperty(exports, "AuthContext", { enumerable: true, get: function () { return auth_1.AuthContext; } });
 const form_1 = require("./context/form");
 Object.defineProperty(exports, "FormContext", { enumerable: true, get: function () { return form_1.FormContext; } });
-const Login_1 = require("./components/page/Login");
-Object.defineProperty(exports, "LoginPage", { enumerable: true, get: function () { return Login_1.Login; } });
 const Category_1 = require("./components/detalhes/Category");
 Object.defineProperty(exports, "Category", { enumerable: true, get: function () { return Category_1.Category; } });
 const Field_1 = require("./components/detalhes/Field");
@@ -66,3 +62,5 @@ const CheckBoxAdditional_1 = __importDefault(require("./components/form/checkbox
 exports.CheckBoxAdditional = CheckBoxAdditional_1.default;
 const RequiredCheckBoxValidator_1 = __importDefault(require("./components/form/checkbox/RequiredCheckBoxValidator"));
 exports.RequiredCheckBoxGroup = RequiredCheckBoxValidator_1.default;
+const KeycloakAuthProvider_1 = require("./components/providers/KeycloakAuthProvider");
+Object.defineProperty(exports, "KeycloakAuthProvider", { enumerable: true, get: function () { return KeycloakAuthProvider_1.KeycloakAuthProvider; } });

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@ssplib/react-components",
-    "version": "0.0.147",
+    "version": "0.0.150",
     "description": "SSP React Components",
     "main": "index.js",
     "author": "Pedro Henrique <sr.hudrick@gmail.com>",
@@ -15,7 +15,8 @@
         "dayjs": "^1.11.7",
         "lodash.hasin": "^4.5.2",
         "react-google-recaptcha": "^2.1.0",
-        "jszip": "^3.10.1"
+        "jszip": "^3.10.1",
+        "keycloak-js": "^22.0.4"
     },
     "devDependencies": {
         "@types/lodash.get": "^4.4.7",

package/types/auth.d.ts

@@ -1,8 +1,8 @@
-/// <reference types="react" />
-export interface User {
-    name: string;
-    token: string;
-    roles?: number[];
+import { KeycloakTokenParsed } from "keycloak-js";
+export interface User extends KeycloakTokenParsed {
+    name?: string;
+    token: string | undefined;
+    roles?: number[] | string[];
     image?: string;
 }
 export interface AuthData {
@@ -67,7 +67,6 @@ export interface AuthReturnData {
     user: User | null | undefined;
     userLoaded: boolean;
     login: () => void;
-    adLogin: (loginURL: string, data: any, setLoading: React.Dispatch<React.SetStateAction<boolean>>, setError: React.Dispatch<React.SetStateAction<boolean>>, captchaToken: string) => void;
     saveUserData: (token: AuthReturn) => void;
     logout: () => void;
 }

package/components/page/Login.d.ts

@@ -1,8 +0,0 @@
-/// <reference types="react" />
-export declare function Login({ imgURL, name, children, loginURL, captchaSiteKey, }: {
-    imgURL?: string;
-    loginURL: string;
-    children: JSX.Element | JSX.Element[];
-    name?: string;
-    captchaSiteKey?: string;
-}): JSX.Element;

package/components/page/Login.js

@@ -1,69 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Login = void 0;
-const lab_1 = require("@mui/lab");
-const material_1 = require("@mui/material");
-const Box_1 = __importDefault(require("@mui/material/Box"));
-const Container_1 = __importDefault(require("@mui/material/Container"));
-const Typography_1 = __importDefault(require("@mui/material/Typography"));
-const React = __importStar(require("react"));
-const react_1 = require("react");
-const auth_1 = require("../../context/auth");
-const FormProvider_1 = __importDefault(require("../providers/FormProvider"));
-const react_google_recaptcha_1 = __importDefault(require("react-google-recaptcha"));
-function Login({ imgURL = '', name = 'Login', children, loginURL, captchaSiteKey, }) {
-    const [loading, setLoading] = (0, react_1.useState)(false);
-    const [error, setError] = (0, react_1.useState)(false);
-    const [captchaSolved, setCaptchaSolved] = (0, react_1.useState)(false);
-    const [captchaToken, setCaptchaToken] = (0, react_1.useState)('');
-    const captcha = (0, react_1.useRef)(null);
-    const { adLogin } = (0, react_1.useContext)(auth_1.AuthContext);
-    function onLogin(data) {
-        adLogin(loginURL, data, setLoading, setError, captchaToken);
-    }
-    return (React.createElement(FormProvider_1.default, { onSubmit: onLogin },
-        React.createElement(Container_1.default, { component: 'main', maxWidth: 'xs' },
-            React.createElement(Box_1.default, { sx: {
-                    marginTop: 8,
-                    display: 'flex',
-                    flexDirection: 'column',
-                    alignItems: 'center',
-                } },
-                imgURL && React.createElement("img", { src: imgURL, alt: '', height: 100, width: 100 }),
-                React.createElement(Typography_1.default, { component: 'h1', variant: 'h5', paddingY: 3 }, name),
-                React.createElement(material_1.Stack, { spacing: 3, width: 300 },
-                    React.createElement(material_1.Stack, { spacing: 1 }, children),
-                    captchaSiteKey && (React.createElement(react_google_recaptcha_1.default, { ref: captcha, hl: 'pt', sitekey: captchaSiteKey, onExpired: () => setCaptchaSolved(false), onChange: (e) => {
-                            setCaptchaToken(e), e && setCaptchaSolved(true);
-                        } })),
-                    React.createElement(lab_1.LoadingButton, { type: 'submit', fullWidth: true, variant: 'contained', loading: loading, disabled: !!captchaSiteKey ? !captchaSolved : false }, "Login"),
-                    error && (React.createElement(Box_1.default, { bgcolor: '#ce4257', padding: 2, borderRadius: 2, color: 'white' },
-                        React.createElement(Typography_1.default, null, "Dados incorretos. Tente novamente!"))))))));
-}
-exports.Login = Login;

package/components/providers/LoginProvider.d.ts

@@ -1,9 +0,0 @@
-/// <reference types="react" />
-export declare const cookieName = "nextauth.token";
-export declare function LoginProvider({ children, AUTH_URL, redirectURL, validateTokenRoute, }: {
-    children: JSX.Element | JSX.Element[];
-    AUTH_URL: string;
-    validateTokenRoute: string;
-    testToken: string;
-    redirectURL?: string;
-}): JSX.Element;

package/components/providers/LoginProvider.js

@@ -1,123 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.LoginProvider = exports.cookieName = void 0;
-const cookies_next_1 = require("cookies-next");
-const jwt_decode_1 = __importDefault(require("jwt-decode"));
-const router_1 = require("next/router");
-const react_1 = __importStar(require("react"));
-const auth_1 = require("../../context/auth");
-exports.cookieName = 'nextauth.token';
-const userImgName = 'user-data.img';
-function LoginProvider({ children, AUTH_URL, redirectURL = '/', validateTokenRoute, }) {
-    const [user, setUser] = (0, react_1.useState)();
-    const [userLoaded, setUserLoaded] = (0, react_1.useState)(false);
-    const router = (0, router_1.useRouter)();
-    const isAuth = !!user;
-    (0, react_1.useEffect)(() => {
-        const token = (0, cookies_next_1.getCookie)(exports.cookieName);
-        if (!token) {
-            setUserLoaded(true);
-            return;
-        }
-        fetch(`${AUTH_URL}${validateTokenRoute}`, {
-            method: 'POST',
-            headers: {
-                Authorization: `Bearer ${token}`,
-            },
-        }).then((res) => {
-            if (!res.ok) {
-                logout();
-                return;
-            }
-            else {
-                const user = (0, jwt_decode_1.default)(token);
-                const img = localStorage.getItem(userImgName);
-                setUser({ name: user.name, image: img !== null && img !== void 0 ? img : '', roles: user.roles.map((x) => x.code), token });
-                setUserLoaded(true);
-            }
-        });
-    }, []);
-    function adLogin(loginURL, data, setLoading, setError, captchaToken) {
-        setLoading(true);
-        fetch(loginURL, {
-            method: 'POST',
-            body: JSON.stringify(Object.assign(Object.assign({}, data), { cpf: data.cpf.replaceAll(/[.-]/g, ''), captchaToken: captchaToken ? captchaToken : 'hmg' })),
-            headers: {
-                'Content-Type': 'application/json',
-            },
-        }).then((res) => {
-            if (res.ok) {
-                res.json().then((j) => {
-                    setError(false);
-                    const token = j.accessToken;
-                    const user = (0, jwt_decode_1.default)(token);
-                    setUser({
-                        name: user.name,
-                        image: '',
-                        roles: user.roles.map((x) => x.code),
-                        token: token,
-                    });
-                    (0, cookies_next_1.setCookie)(exports.cookieName, token);
-                    router.replace(redirectURL).finally(() => setUserLoaded(true));
-                });
-            }
-            else {
-                setLoading(false);
-                setUserLoaded(true);
-                setError(true);
-            }
-        });
-    }
-    // chamado no callback de login
-    function saveUserData(authData) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const token = authData.ssp_token;
-            (0, cookies_next_1.setCookie)(exports.cookieName, token);
-            router.replace(redirectURL).finally(() => setUserLoaded(true));
-        });
-    }
-    function logout() {
-        setUserLoaded(false);
-        setUser(null);
-        (0, cookies_next_1.deleteCookie)(exports.cookieName);
-        localStorage.removeItem(userImgName);
-        router.replace(redirectURL).finally(() => setUserLoaded(true));
-    }
-    return react_1.default.createElement(auth_1.AuthContext.Provider, { value: { user, isAuth, userLoaded, login: () => { }, adLogin, logout, saveUserData, type: 'ad' } }, children);
-}
-exports.LoginProvider = LoginProvider;