@ssplib/react-components 0.0.11 → 0.0.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +8 -8
- package/components/providers/OAuthProvider.d.ts +24 -0
- package/components/providers/OAuthProvider.js +136 -0
- package/context/auth.d.ts +3 -0
- package/context/auth.js +5 -0
- package/index.d.ts +3 -1
- package/index.js +6 -1
- package/package.json +53 -53
package/README.md
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
# Components front-end da SSP-DF
|
|
2
|
-
|
|
3
|
-
- Este projeto ainda está em desenvolvimento
|
|
4
|
-
- Focado especificamente para projetos internos
|
|
5
|
-
- Use por conta própria e risco.
|
|
6
|
-
|
|
7
|
-
## Rode o comando abaixo para documentação
|
|
8
|
-
`npm run storybook`
|
|
1
|
+
# Components front-end da SSP-DF
|
|
2
|
+
|
|
3
|
+
- Este projeto ainda está em desenvolvimento
|
|
4
|
+
- Focado especificamente para projetos internos
|
|
5
|
+
- Use por conta própria e risco.
|
|
6
|
+
|
|
7
|
+
## Rode o comando abaixo para documentação
|
|
8
|
+
`npm run storybook`
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
interface OiDcConfig {
|
|
3
|
+
response_type: string;
|
|
4
|
+
client_id: string;
|
|
5
|
+
scope: string;
|
|
6
|
+
redirect_uri: string;
|
|
7
|
+
nonce: number;
|
|
8
|
+
state: number;
|
|
9
|
+
code_challenge: string;
|
|
10
|
+
code_challenge_method: string;
|
|
11
|
+
authority: string;
|
|
12
|
+
post_logout_redirect_uri: string;
|
|
13
|
+
CODE_VERIFIER: string;
|
|
14
|
+
}
|
|
15
|
+
export declare const cookieName = "nextauth.token";
|
|
16
|
+
export declare function OAuthProvider({ children, AUTH_URL, oidcConfig, redirectURL, validateTokenRoute, testToken, }: {
|
|
17
|
+
children: JSX.Element | JSX.Element[];
|
|
18
|
+
AUTH_URL: string;
|
|
19
|
+
oidcConfig: OiDcConfig;
|
|
20
|
+
redirectURL: string;
|
|
21
|
+
validateTokenRoute: string;
|
|
22
|
+
testToken: string;
|
|
23
|
+
}): JSX.Element;
|
|
24
|
+
export {};
|
|
@@ -0,0 +1,136 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
|
|
26
|
+
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
|
|
27
|
+
return new (P || (P = Promise))(function (resolve, reject) {
|
|
28
|
+
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
|
|
29
|
+
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
|
|
30
|
+
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
|
|
31
|
+
step((generator = generator.apply(thisArg, _arguments || [])).next());
|
|
32
|
+
});
|
|
33
|
+
};
|
|
34
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
35
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
36
|
+
};
|
|
37
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
38
|
+
exports.OAuthProvider = exports.cookieName = void 0;
|
|
39
|
+
const cookies_next_1 = require("cookies-next");
|
|
40
|
+
const jwt_decode_1 = __importDefault(require("jwt-decode"));
|
|
41
|
+
const router_1 = require("next/router");
|
|
42
|
+
const react_1 = __importStar(require("react"));
|
|
43
|
+
const auth_1 = require("../../context/auth");
|
|
44
|
+
exports.cookieName = 'nextauth.token';
|
|
45
|
+
const userImgName = 'user-data.img';
|
|
46
|
+
function OAuthProvider({ children, AUTH_URL, oidcConfig, redirectURL, validateTokenRoute, testToken, }) {
|
|
47
|
+
const govBrURL = oidcConfig.authority + '/authorize?response_type=code&client_id=' + oidcConfig.client_id + '&scope=' + oidcConfig.scope + '&redirect_uri=' + oidcConfig.redirect_uri;
|
|
48
|
+
const [user, setUser] = (0, react_1.useState)();
|
|
49
|
+
const [userLoaded, setUserLoaded] = (0, react_1.useState)(false);
|
|
50
|
+
const router = (0, router_1.useRouter)();
|
|
51
|
+
const isAuth = !!user;
|
|
52
|
+
(0, react_1.useEffect)(() => {
|
|
53
|
+
const token = (0, cookies_next_1.getCookie)(exports.cookieName);
|
|
54
|
+
if (!token) {
|
|
55
|
+
setUserLoaded(true);
|
|
56
|
+
return;
|
|
57
|
+
}
|
|
58
|
+
fetch(`${AUTH_URL}${validateTokenRoute}`, {
|
|
59
|
+
method: 'POST',
|
|
60
|
+
headers: {
|
|
61
|
+
Authorization: `Bearer ${token}`,
|
|
62
|
+
},
|
|
63
|
+
}).then((res) => {
|
|
64
|
+
if (!res.ok) {
|
|
65
|
+
logout();
|
|
66
|
+
return;
|
|
67
|
+
}
|
|
68
|
+
else {
|
|
69
|
+
const user = (0, jwt_decode_1.default)(token);
|
|
70
|
+
const img = localStorage.getItem(userImgName);
|
|
71
|
+
setUser({ name: user.name, image: img !== null && img !== void 0 ? img : '', roles: user.roles.map((x) => x.code), token });
|
|
72
|
+
setUserLoaded(true);
|
|
73
|
+
}
|
|
74
|
+
});
|
|
75
|
+
}, []);
|
|
76
|
+
function login() {
|
|
77
|
+
// Teste em localhost
|
|
78
|
+
if (location && location.hostname === 'localhost') {
|
|
79
|
+
const token = testToken;
|
|
80
|
+
(0, cookies_next_1.setCookie)(exports.cookieName, token, { maxAge: 60 * 60 * 24 * 500 });
|
|
81
|
+
setUser({
|
|
82
|
+
name: 'Teste',
|
|
83
|
+
image: '',
|
|
84
|
+
roles: [1],
|
|
85
|
+
token: token,
|
|
86
|
+
});
|
|
87
|
+
router.replace(redirectURL).finally(() => setUserLoaded(true));
|
|
88
|
+
}
|
|
89
|
+
//
|
|
90
|
+
else {
|
|
91
|
+
setUserLoaded(false);
|
|
92
|
+
router.replace(govBrURL);
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
// chamado no callback de login
|
|
96
|
+
function saveUserData(authData) {
|
|
97
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
98
|
+
const token = authData.ssp_token;
|
|
99
|
+
(0, cookies_next_1.setCookie)(exports.cookieName, token, { expires: new Date(authData.claims.exp * 1000) });
|
|
100
|
+
const userData = (0, jwt_decode_1.default)(token);
|
|
101
|
+
const idToken = (0, jwt_decode_1.default)(authData.id_token);
|
|
102
|
+
// pegando foto de usuario
|
|
103
|
+
yield fetch(idToken.picture, {
|
|
104
|
+
headers: {
|
|
105
|
+
Authorization: `Bearer ${authData.access_token}`,
|
|
106
|
+
},
|
|
107
|
+
}).then((res) => {
|
|
108
|
+
if (res.status === 200) {
|
|
109
|
+
res.blob().then((b) => {
|
|
110
|
+
const reader = new FileReader();
|
|
111
|
+
reader.readAsDataURL(b);
|
|
112
|
+
reader.onload = () => {
|
|
113
|
+
const base64 = reader.result;
|
|
114
|
+
localStorage.setItem(userImgName, base64);
|
|
115
|
+
setUser({ name: userData.name, image: base64, roles: userData.roles.map((x) => x.code), token });
|
|
116
|
+
router.replace(redirectURL).finally(() => setUserLoaded(true));
|
|
117
|
+
};
|
|
118
|
+
});
|
|
119
|
+
}
|
|
120
|
+
setUser({ name: userData.name, image: '', roles: userData.roles.map((x) => x.code), token });
|
|
121
|
+
router.replace(redirectURL).finally(() => setUserLoaded(true));
|
|
122
|
+
return;
|
|
123
|
+
});
|
|
124
|
+
router.replace(redirectURL).finally(() => setUserLoaded(true));
|
|
125
|
+
});
|
|
126
|
+
}
|
|
127
|
+
function logout() {
|
|
128
|
+
setUserLoaded(false);
|
|
129
|
+
setUser(null);
|
|
130
|
+
(0, cookies_next_1.deleteCookie)(exports.cookieName);
|
|
131
|
+
localStorage.removeItem(userImgName);
|
|
132
|
+
router.replace(redirectURL).finally(() => setUserLoaded(true));
|
|
133
|
+
}
|
|
134
|
+
return react_1.default.createElement(auth_1.AuthContext.Provider, { value: { user, isAuth, userLoaded, login, logout, saveUserData } }, children);
|
|
135
|
+
}
|
|
136
|
+
exports.OAuthProvider = OAuthProvider;
|
package/context/auth.js
ADDED
package/index.d.ts
CHANGED
|
@@ -14,4 +14,6 @@ import StepperBlock from './components/form/stepper/StepperBlock';
|
|
|
14
14
|
import Switch from './components/form/switch/Switch';
|
|
15
15
|
import Table from './components/form/table/Table';
|
|
16
16
|
import NavBar from './components/navbar/NavBar';
|
|
17
|
-
|
|
17
|
+
import FormProvider from './components/providers/FormProvider';
|
|
18
|
+
import { OAuthProvider, cookieName as AUTH_COOKIE_NAME } from './components/providers/OAuthProvider';
|
|
19
|
+
export { CheckBox, CheckBoxWarning, DatePicker, TimePicker, FileUpload, ActiveInput, AutoComplete, Input, MaskInput, MultInput, OtherCheckBox, Stepper, StepperBlock, Switch, Table, NavBar, FormProvider, OAuthProvider, AUTH_COOKIE_NAME };
|
package/index.js
CHANGED
|
@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.NavBar = exports.Table = exports.Switch = exports.StepperBlock = exports.Stepper = exports.OtherCheckBox = exports.MultInput = exports.MaskInput = exports.Input = exports.AutoComplete = exports.ActiveInput = exports.FileUpload = exports.TimePicker = exports.DatePicker = exports.CheckBoxWarning = exports.CheckBox = void 0;
|
|
6
|
+
exports.AUTH_COOKIE_NAME = exports.OAuthProvider = exports.FormProvider = exports.NavBar = exports.Table = exports.Switch = exports.StepperBlock = exports.Stepper = exports.OtherCheckBox = exports.MultInput = exports.MaskInput = exports.Input = exports.AutoComplete = exports.ActiveInput = exports.FileUpload = exports.TimePicker = exports.DatePicker = exports.CheckBoxWarning = exports.CheckBox = void 0;
|
|
7
7
|
const CheckBox_1 = __importDefault(require("./components/form/checkbox/CheckBox"));
|
|
8
8
|
exports.CheckBox = CheckBox_1.default;
|
|
9
9
|
const CheckBoxWarning_1 = __importDefault(require("./components/form/checkbox/CheckBoxWarning"));
|
|
@@ -36,3 +36,8 @@ const Table_1 = __importDefault(require("./components/form/table/Table"));
|
|
|
36
36
|
exports.Table = Table_1.default;
|
|
37
37
|
const NavBar_1 = __importDefault(require("./components/navbar/NavBar"));
|
|
38
38
|
exports.NavBar = NavBar_1.default;
|
|
39
|
+
const FormProvider_1 = __importDefault(require("./components/providers/FormProvider"));
|
|
40
|
+
exports.FormProvider = FormProvider_1.default;
|
|
41
|
+
const OAuthProvider_1 = require("./components/providers/OAuthProvider");
|
|
42
|
+
Object.defineProperty(exports, "OAuthProvider", { enumerable: true, get: function () { return OAuthProvider_1.OAuthProvider; } });
|
|
43
|
+
Object.defineProperty(exports, "AUTH_COOKIE_NAME", { enumerable: true, get: function () { return OAuthProvider_1.cookieName; } });
|
package/package.json
CHANGED
|
@@ -1,53 +1,53 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "@ssplib/react-components",
|
|
3
|
-
"version": "0.0.
|
|
4
|
-
"description": "SSP React Components",
|
|
5
|
-
"main": "index.js",
|
|
6
|
-
"author": "Pedro Henrique <sr.hudrick@gmail.com>",
|
|
7
|
-
"license": "MIT",
|
|
8
|
-
"dependencies": {
|
|
9
|
-
"@emotion/react": "^11.10.6",
|
|
10
|
-
"@emotion/styled": "^11.10.6",
|
|
11
|
-
"@mui/icons-material": "^5.11.16",
|
|
12
|
-
"@mui/lab": "^5.0.0-alpha.127",
|
|
13
|
-
"@mui/material": "^5.12.1",
|
|
14
|
-
"@mui/x-date-pickers": "^6.2.0",
|
|
15
|
-
"cookies-next": "^2.1.1",
|
|
16
|
-
"dayjs": "^1.11.7",
|
|
17
|
-
"jwt-decode": "^3.1.2",
|
|
18
|
-
"lodash.get": "^4.4.2",
|
|
19
|
-
"next": "^13.3.0",
|
|
20
|
-
"react": "^18.2.0",
|
|
21
|
-
"react-hook-form": "^7.43.9",
|
|
22
|
-
"react-imask": "^6.6.0",
|
|
23
|
-
"react-query": "^3.39.3",
|
|
24
|
-
"typescript": "^5.0.4"
|
|
25
|
-
},
|
|
26
|
-
"devDependencies": {
|
|
27
|
-
"@babel/preset-env": "^7.21.4",
|
|
28
|
-
"@babel/preset-react": "^7.18.6",
|
|
29
|
-
"@babel/preset-typescript": "^7.21.4",
|
|
30
|
-
"@storybook/addon-essentials": "7.0.5",
|
|
31
|
-
"@storybook/addon-interactions": "7.0.5",
|
|
32
|
-
"@storybook/addon-links": "7.0.5",
|
|
33
|
-
"@storybook/blocks": "7.0.5",
|
|
34
|
-
"@storybook/react": "7.0.5",
|
|
35
|
-
"@storybook/react-webpack5": "7.0.5",
|
|
36
|
-
"@storybook/testing-library": "0.0.14-next.2",
|
|
37
|
-
"@tsconfig/recommended": "^1.0.2",
|
|
38
|
-
"@types/lodash.get": "^4.4.7",
|
|
39
|
-
"@types/react": "^18.0.37",
|
|
40
|
-
"prop-types": "15.8.1",
|
|
41
|
-
"react-dom": "18.2.0",
|
|
42
|
-
"storybook": "7.0.5"
|
|
43
|
-
},
|
|
44
|
-
"repository": {
|
|
45
|
-
"type": "git",
|
|
46
|
-
"url": "git+https://github.com/SSPDF/ssp-components.git"
|
|
47
|
-
},
|
|
48
|
-
"keywords": ["front", "react", "components", "ssp", "df"],
|
|
49
|
-
"bugs": {
|
|
50
|
-
"url": "https://github.com/SSPDF/ssp-components/issues"
|
|
51
|
-
},
|
|
52
|
-
"homepage": "https://github.com/SSPDF/ssp-components#readme"
|
|
53
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "@ssplib/react-components",
|
|
3
|
+
"version": "0.0.13",
|
|
4
|
+
"description": "SSP React Components",
|
|
5
|
+
"main": "index.js",
|
|
6
|
+
"author": "Pedro Henrique <sr.hudrick@gmail.com>",
|
|
7
|
+
"license": "MIT",
|
|
8
|
+
"dependencies": {
|
|
9
|
+
"@emotion/react": "^11.10.6",
|
|
10
|
+
"@emotion/styled": "^11.10.6",
|
|
11
|
+
"@mui/icons-material": "^5.11.16",
|
|
12
|
+
"@mui/lab": "^5.0.0-alpha.127",
|
|
13
|
+
"@mui/material": "^5.12.1",
|
|
14
|
+
"@mui/x-date-pickers": "^6.2.0",
|
|
15
|
+
"cookies-next": "^2.1.1",
|
|
16
|
+
"dayjs": "^1.11.7",
|
|
17
|
+
"jwt-decode": "^3.1.2",
|
|
18
|
+
"lodash.get": "^4.4.2",
|
|
19
|
+
"next": "^13.3.0",
|
|
20
|
+
"react": "^18.2.0",
|
|
21
|
+
"react-hook-form": "^7.43.9",
|
|
22
|
+
"react-imask": "^6.6.0",
|
|
23
|
+
"react-query": "^3.39.3",
|
|
24
|
+
"typescript": "^5.0.4"
|
|
25
|
+
},
|
|
26
|
+
"devDependencies": {
|
|
27
|
+
"@babel/preset-env": "^7.21.4",
|
|
28
|
+
"@babel/preset-react": "^7.18.6",
|
|
29
|
+
"@babel/preset-typescript": "^7.21.4",
|
|
30
|
+
"@storybook/addon-essentials": "7.0.5",
|
|
31
|
+
"@storybook/addon-interactions": "7.0.5",
|
|
32
|
+
"@storybook/addon-links": "7.0.5",
|
|
33
|
+
"@storybook/blocks": "7.0.5",
|
|
34
|
+
"@storybook/react": "7.0.5",
|
|
35
|
+
"@storybook/react-webpack5": "7.0.5",
|
|
36
|
+
"@storybook/testing-library": "0.0.14-next.2",
|
|
37
|
+
"@tsconfig/recommended": "^1.0.2",
|
|
38
|
+
"@types/lodash.get": "^4.4.7",
|
|
39
|
+
"@types/react": "^18.0.37",
|
|
40
|
+
"prop-types": "15.8.1",
|
|
41
|
+
"react-dom": "18.2.0",
|
|
42
|
+
"storybook": "7.0.5"
|
|
43
|
+
},
|
|
44
|
+
"repository": {
|
|
45
|
+
"type": "git",
|
|
46
|
+
"url": "git+https://github.com/SSPDF/ssp-components.git"
|
|
47
|
+
},
|
|
48
|
+
"keywords": ["front", "react", "components", "ssp", "df"],
|
|
49
|
+
"bugs": {
|
|
50
|
+
"url": "https://github.com/SSPDF/ssp-components/issues"
|
|
51
|
+
},
|
|
52
|
+
"homepage": "https://github.com/SSPDF/ssp-components#readme"
|
|
53
|
+
}
|