Skip to content

Commit 4b5d1ec

Browse files
author
Olivier YOUF
committed
feat: removing recompose for React Hooks
1 parent 4f39fc9 commit 4b5d1ec

35 files changed

+8994
-12787
lines changed

‎exercice-sample/.eslintrc‎

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
{
2+
"extends": [
3+
"airbnb",
4+
"plugin:prettier/recommended",
5+
"prettier",
6+
"prettier/react",
7+
"react-app"
8+
],
9+
"plugins": ["react", "prettier", "react-hooks"],
10+
"env": {
11+
"browser": true,
12+
"node": true,
13+
"es6": true,
14+
"jest": true
15+
},
16+
"parserOptions": {
17+
"ecmaVersion": 6,
18+
"ecmaFeatures": {
19+
"jsx": true
20+
}
21+
},
22+
"rules": {
23+
"react/jsx-filename-extension": [
24+
2,
25+
{
26+
"extensions": [".js", ".jsx"]
27+
}
28+
],
29+
"linebreak-style": 0,
30+
"import/no-extraneous-dependencies": "warn",
31+
"import/no-unresolved": "off",
32+
"import/named": "warn",
33+
"import/prefer-default-export": "off",
34+
"jsx-a11y/aria-role": 1,
35+
"jsx-a11y/href-no-hash": "off",
36+
"jsx-a11y/label-has-for": 1,
37+
"jsx-a11y/no-autofocus": 1,
38+
"jsx-a11y/no-noninteractive-element-interactions": 1,
39+
"jsx-a11y/anchor-is-valid": 1,
40+
"prettier/prettier": "warn",
41+
"react/forbid-prop-types": 0,
42+
"react/jsx-closing-bracket-location": 0,
43+
"react/no-multi-comp": 0,
44+
"react/no-unused-prop-types": 1,
45+
"react/prop-types": 0,
46+
"react/no-unescaped-entities": 1,
47+
"react/jsx-closing-tag-location": 0,
48+
"react-hooks/rules-of-hooks": "error",
49+
"react-hooks/exhaustive-deps": "error"
50+
},
51+
"settings": {
52+
"import/resolver": {
53+
"node": {
54+
"moduleDirectory": ["node_modules", "./src"]
55+
}
56+
}
57+
}
58+
}

‎exercice-sample/.prettierrc‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"singleQuote": true,
3+
"semi": true,
4+
"trailingComma": "all",
5+
"jsxBracketSameLine": false,
6+
"arrowParens": "avoid",
7+
"printWidth": 150
8+
}

‎exercice-sample/package-lock.json‎

Lines changed: 8591 additions & 12261 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎exercice-sample/package.json‎

Lines changed: 34 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -3,37 +3,53 @@
33
"version": "0.1.0",
44
"private": true,
55
"dependencies": {
6-
"@axa-fr/react-toolkit-alert": "^1.0.5",
7-
"@axa-fr/react-toolkit-all": "^1.0.5",
8-
"@axa-fr/react-toolkit-button": "^1.0.2",
9-
"@axa-fr/react-toolkit-collapse": "^1.0.5",
10-
"@axa-fr/react-toolkit-layout-footer": "^1.0.5",
11-
"@axa-fr/react-toolkit-layout-header": "^1.0.5",
12-
"@axa-fr/react-toolkit-table": "^1.0.2",
13-
"node-sass": "^4.11.0",
6+
"@axa-fr/react-toolkit-alert": "^1.3.11",
7+
"@axa-fr/react-toolkit-all": "^1.3.11",
8+
"@axa-fr/react-toolkit-button": "^1.3.11",
9+
"@axa-fr/react-toolkit-collapse": "^1.3.11",
10+
"@axa-fr/react-toolkit-core": "^1.3.11",
11+
"@axa-fr/react-toolkit-layout-footer": "^1.3.11",
12+
"@axa-fr/react-toolkit-layout-header": "^1.3.11",
13+
"@axa-fr/react-toolkit-table": "^1.3.11",
1414
"npm-run-all": "^4.1.5",
15-
"react": "^16.7.0",
16-
"react-dom": "^16.7.0",
17-
"react-router-dom": "^4.3.1",
18-
"react-scripts": "2.1.3",
19-
"recompose": "^0.30.0"
15+
"prop-types": "^15.7.2",
16+
"react": "^16.13.1",
17+
"react-dom": "^16.13.1",
18+
"react-router-dom": "^5.2.0",
19+
"react-scripts": "3.4.1",
20+
"sass": "^1.26.5"
2021
},
2122
"scripts": {
2223
"start-mocks": "cd ../mocks && npm start",
2324
"start-js": "react-scripts start",
2425
"start": "npm-run-all -p start-mocks start-js",
2526
"build": "react-scripts build",
2627
"test": "react-scripts test",
27-
"eject": "react-scripts eject"
28-
},
29-
"eslintConfig": {
30-
"extends": "react-app"
28+
"eject": "react-scripts eject",
29+
"lint": "eslint --ignore-path .gitignore .",
30+
"prettier": "prettier --ignore-path .gitignore \"**/*.+(js|jsx|json)\"",
31+
"format": "npm run prettier -- --write",
32+
"check-format": "npm run prettier -- --list-different",
33+
"validate": "npm run check-format && npm run lint && npm run build"
3134
},
3235
"proxy": "http://127.0.0.1:4000",
3336
"browserslist": [
3437
">0.2%",
3538
"not dead",
3639
"not ie <= 11",
3740
"not op_mini all"
38-
]
41+
],
42+
"devDependencies": {
43+
"eslint": "^7.1.0",
44+
"eslint-config-airbnb": "^18.1.0",
45+
"eslint-config-prettier": "^6.11.0",
46+
"eslint-config-react-app": "^5.2.1",
47+
"eslint-plugin-flowtype": "^5.1.0",
48+
"eslint-plugin-import": "^2.20.2",
49+
"eslint-plugin-jsx-a11y": "^6.2.3",
50+
"eslint-plugin-prettier": "^3.1.3",
51+
"eslint-plugin-react": "^7.20.0",
52+
"eslint-plugin-react-hooks": "^4.0.2",
53+
"prettier": "^2.0.5"
54+
}
3955
}

‎exercice-sample/src/Layout/App/App.jsx‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
1-
import React from "react";
2-
import { BrowserRouter as Router } from "react-router-dom";
3-
import Messages, { MessageProvider } from "Shared/Messages";
1+
import React from 'react';
2+
import { BrowserRouter as Router } from 'react-router-dom';
3+
import Messages, { MessageProvider } from 'Shared/Messages';
44

5-
import "./App.scss";
5+
import './App.scss';
66

7-
import Header from "../Header";
8-
import Footer from "../Footer";
9-
import Routes from "../Routes";
10-
import NavBar from "../NavBar";
7+
import Header from '../Header';
8+
import Footer from '../Footer';
9+
import Routes from '../Routes';
10+
import NavBar from '../NavBar';
1111

1212
const App = () => (
1313
<MessageProvider>

‎exercice-sample/src/Layout/App/index.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
export { default } from "./App";
1+
export { default } from './App';

‎exercice-sample/src/Layout/Footer/Footer.component.jsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1-
import React from "react";
2-
import logo from "@axa-fr/react-toolkit-core/dist/assets/logo-axa.svg";
3-
import { Footer } from "@axa-fr/react-toolkit-all";
4-
import "./Footer.scss";
1+
import React from 'react';
2+
import logo from '@axa-fr/react-toolkit-core/dist/assets/logo-axa.svg';
3+
import { Footer } from '@axa-fr/react-toolkit-all';
4+
import './Footer.scss';
55

66
const FooterApp = () => {
77
return <Footer icon={logo} />;

‎exercice-sample/src/Layout/Footer/index.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
export { default } from "./Footer.component";
1+
export { default } from './Footer.component';

‎exercice-sample/src/Layout/Header/Header.component.jsx‎

Lines changed: 16 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,34 @@
1-
import React from "react";
2-
import PropTypes from "prop-types";
1+
import React from 'react';
2+
import PropTypes from 'prop-types';
33

4-
import logo from "@axa-fr/react-toolkit-core/dist/assets/logo-axa.svg";
5-
import { Header, Name, User } from "@axa-fr/react-toolkit-all";
6-
import Button from "@axa-fr/react-toolkit-button";
4+
import logo from '@axa-fr/react-toolkit-core/dist/assets/logo-axa.svg';
5+
import { Header, Name, User } from '@axa-fr/react-toolkit-all';
6+
import Button from '@axa-fr/react-toolkit-button';
7+
8+
import './Header.scss';
79

8-
import "./Header.scss";
910
const propTypes = {
1011
user: PropTypes.shape({
1112
userName: PropTypes.string.isRequired,
12-
profile: PropTypes.string.isRequired
13-
})
13+
profile: PropTypes.string.isRequired,
14+
}),
15+
login: PropTypes.func.isRequired,
16+
logout: PropTypes.func.isRequired,
1417
};
1518

16-
const HeaderApp = ({ user }) => (
19+
const HeaderApp = ({ user, login, logout }) => (
1720
<Header>
18-
<Name
19-
title="OIDC Dojo"
20-
subtitle="Mise en place d'OIDC Client"
21-
img={logo}
22-
alt="Logo React"
23-
onClick={() => {}}
24-
/>
21+
<Name title="OIDC Dojo" subtitle="Mise en place d'OIDC Client" img={logo} alt="Logo React" onClick={() => {}} />
2522
{user ? (
2623
<div className="info-user__container">
27-
<User name={user.userName} profile={user.email} />
28-
<Button
29-
onClick={() => {
30-
console.log("logout");
31-
}}
32-
classModifier="logout hasiconLeft link"
33-
>
24+
<User name={user.userName} profile={user.profile} />
25+
<Button onClick={logout} classModifier="logout hasiconLeft link">
3426
<span className="af-btn__text">Logout</span>
3527
<i className="glyphicon glyphicon-log-out" />
3628
</Button>
3729
</div>
3830
) : (
39-
<Button
40-
onClick={() => {
41-
console.log("login");
42-
}}
43-
classModifier="login hasiconLeft"
44-
>
31+
<Button onClick={login} classModifier="login hasiconLeft">
4532
<span className="af-btn__text">Login</span>
4633
<i className="glyphicon glyphicon-log-in" />
4734
</Button>

‎exercice-sample/src/Layout/Header/Header.container.js‎

Lines changed: 16 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,17 @@
1-
import Component from "./Header.component";
1+
import React, { useState } from 'react';
2+
import Header from './Header.component';
23

3-
export default Component;
4+
const HeaderContainer = () => {
5+
const [user, setUser] = useState(null);
6+
const login = () => {
7+
console.log('Login');
8+
setUser({ userName: 'Jean', profile: 'Inexistant' });
9+
};
10+
const logout = () => {
11+
console.log('Logout');
12+
setUser(null);
13+
};
14+
return <Header login={login} logout={logout} user={user} />;
15+
};
16+
17+
export default HeaderContainer;

0 commit comments

Comments
 (0)