diff --git a/.eslintrc.yaml b/.eslintrc.yaml index 465af4092..d8ac464d8 100644 --- a/.eslintrc.yaml +++ b/.eslintrc.yaml @@ -27,6 +27,8 @@ overrides: files: "*.test.js" env: mocha: true +globals: + process: false extends: - eslint:recommended diff --git a/.flowconfig b/.flowconfig index 05447f590..0e0a27770 100644 --- a/.flowconfig +++ b/.flowconfig @@ -21,6 +21,11 @@ suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe suppress_comment=\\(.\\|\n\\)*\\$FlowIssue suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy -module.name_mapper='^Components\(.*\)$' -> '/source/components\1' module.name_mapper='^Engine\(.*\)$' -> '/source/engine\1' -module.name_mapper='^Selectors\(.*\)$' -> '/source/selectors\1' \ No newline at end of file +module.name_mapper='^Règles\(.*\)$' -> '/source/règles\1' +module.name_mapper='^Ui\(.*\)$' -> '/source/components/ui\1' +module.name_mapper='^Components\(.*\)$' -> '/source/components\1' +module.name_mapper='^Selectors\(.*\)$' -> '/source/selectors\1' +module.name_mapper='^Reducers\(.*\)$' -> '/source/reducers\1' +module.name_mapper='^Actions\(.*\)$' -> '/source/actions\1' +module.name_mapper='^Types\(.*\)$' -> '/source/types\1' \ No newline at end of file diff --git a/Procfile b/Procfile index 962339723..88946e916 100644 --- a/Procfile +++ b/Procfile @@ -1 +1 @@ -web: yarn run live-server --entry-file=index.html dist +web: yarn run live-server --entry-file=infrance.html dist diff --git a/source/crédits-icônes.yaml b/crédits-icônes.yaml similarity index 100% rename from source/crédits-icônes.yaml rename to crédits-icônes.yaml diff --git a/index.html b/index.html index 1a46c6015..b4b4c25e9 100644 --- a/index.html +++ b/index.html @@ -26,7 +26,7 @@
- + \ No newline at end of file diff --git a/package.json b/package.json index 8afc9d37a..13dbe0b1c 100644 --- a/package.json +++ b/package.json @@ -8,52 +8,20 @@ "engines": { "node": ">=8.10.0 <10.0.0" }, - "browserslist": ["> 1% in FR", "not ie < 11"], + "browserslist": [ + "> 1% in FR", + "not ie < 11" + ], "dependencies": { - "@babel/core": "=7.0.0-beta.51", - "@babel/plugin-proposal-decorators": "=7.0.0-beta.51", - "@babel/plugin-proposal-object-rest-spread": "=7.0.0-beta.51", - "@babel/plugin-syntax-decorators": "=7.0.0-beta.51", - "@babel/polyfill": "=7.0.0-beta.51", - "@babel/preset-env": "=7.0.0-beta.51", - "@babel/preset-react": "=7.0.0-beta.51", "@researchgate/react-intersection-observer": "^0.7.3", - "akh": "^3.1.2", - "autoprefixer": "^8.6.3", - "babel-eslint": "^8.2.5", - "babel-loader": "8.0.0-beta.2", - "babel-plugin-syntax-dynamic-import": "^6.18.0", - "babel-plugin-transform-class-properties": "^6.24.1", - "babel-plugin-transform-decorators": "^6.24.1", - "babel-plugin-transform-do-expressions": "^6.22.0", - "babel-plugin-webpack-alias": "^2.1.2", "classnames": "^2.2.5", "color-convert": "^1.9.2", - "core-js": "^2.5.7", - "css-loader": "^0.28.11", - "csv-loader": "^2.1.1", - "daggy": "^1.2.0", - "dedent-js": "^1.0.1", - "express": "^4.16.3", - "file-loader": "^1.1.11", "focus-trap-react": "^3.1.2", "fuse.js": "^3.2.1", - "global": "^4.3.2", - "google-translate-api": "^2.3.0", - "html-loader": "^0.5.5", "i18next": "^10.0.7", - "ignore-loader": "^0.1.2", - "js-yaml": "^3.12.0", - "jsdom": "^11.11.0", - "json-loader": "^0.5.7", - "live-server": "^1.2.0", "marked": "^0.3.17", "nearley": "^2.13.0", - "nearley-loader": "^2.0.0", - "npm-check-updates": "^2.14.2", - "postcss-loader": "^2.1.2", "ramda": "^0.25.0", - "ramda-fantasy": "^0.8.0", "rc-progress": "^2.2.5", "react": "^16.3.1", "react-addons-css-transition-group": "^15.6.2", @@ -62,7 +30,7 @@ "react-easy-emoji": "^1.2.0", "react-helmet": "^5.2.0", "react-highlight-words": "^0.11.0", - "react-hot-loader": "^4.0.0", + "react-hot-loader": "^4.3.3", "react-i18next": "^7.5.0", "react-redux": "^5.0.7", "react-router": "^4.2.0", @@ -78,61 +46,86 @@ "redux": "^3.7.2", "redux-form": "^7.4.2", "reselect": "^3.0.1", - "screenfull": "^3.3.2", - "source-map-support": "^0.5.4", - "style-loader": "^0.20.3", - "url-loader": "^1.0.1", - "webpack": "^4.12.1", - "webpack-cli": "^3.0.8", - "webpack-dev-server": "^3.1.1", - "whatwg-fetch": "^2.0.3", - "yaml-loader": "^0.5.0" + "screenfull": "^3.3.2" }, "scripts": { - "pretest": - "LIST=`git diff --name-only HEAD..HEAD^ | grep .*\\.js | grep -v json`; if [ \"$LIST\" ]; then eslint $LIST; fi && flow check", - "start": "node source/server.js", - "externalize": "node source/externalize.js", - "prepare": "flow-typed update-cache", "compile": "webpack --config source/webpack.prod.js", - "test": - "mocha-webpack --webpack-config source/webpack.test.js --require source-map-support/register --include componentTestSetup.js --require test/helpers/browser.js \"./{,!(node_modules)/**/}!(webpack).test.js\"", - "test-watch": - "mocha-webpack --webpack-config source/webpack.test.js --require source-map-support/register --require test/helpers/browser.js \"test/**/*.test.js\" --watch", - "test-meca": - "mocha-webpack --webpack-config source/webpack.test.js --require source-map-support/register --require test/helpers/browser.js test/mecanisms.test.js --watch", - "test-rules": - "mocha-webpack --webpack-config source/webpack.test.js --require source-map-support/register --require test/helpers/browser.js test/real-rules.test.js --watch", - "test-inversions": - "mocha-webpack --webpack-config source/webpack.test.js --require source-map-support/register --require test/helpers/browser.js \"test/inversion.test.js\" --watch", - "test-components": - "mocha-webpack --webpack-config source/webpack.test.js --require source-map-support/register --include componentTestSetup.js --require test/helpers/browser.js \"source/components/**/*.test.js\" --watch", + "eslint-check": "eslint --print-config .eslintrc | eslint-config-prettier-check", + "eslint": "LIST=`git diff --cached --name-only --diff-filter=AMR HEAD | grep .*\\.js | grep -v json`; if [ \"$LIST\" ]; then eslint $LIST; fi", + "externalize": "node source/externalize.js", "heroku-postbuild": "yarn install --production=false && yarn compile", - "eslint": - "LIST=`git diff --cached --name-only HEAD | grep .*\\.js | grep -v json`; if [ \"$LIST\" ]; then eslint $LIST; fi", - "eslint-check": - "eslint --print-config .eslintrc | eslint-config-prettier-check" + "prepare": "flow-typed update-cache", + "pretest": "LIST=`git diff --name-only --diff-filter=AMR HEAD^..HEAD | grep .*\\.js | grep -v json`; if [ \"$LIST\" ]; then eslint $LIST; fi && flow check", + "start": "webpack-serve ./source/webpack.dev.js", + "test-components": "mocha-webpack --webpack-config source/webpack.test.js --require source-map-support/register --include componentTestSetup.js --require test/helpers/browser.js \"source/components/**/*.test.js\" --watch", + "test-inversions": "mocha-webpack --webpack-config source/webpack.test.js --require source-map-support/register --require test/helpers/browser.js \"test/inversion.test.js\" --watch", + "test-meca": "mocha-webpack --webpack-config source/webpack.test.js --require source-map-support/register --require test/helpers/browser.js test/mecanisms.test.js --watch", + "test-rules": "mocha-webpack --webpack-config source/webpack.test.js --require source-map-support/register --require test/helpers/browser.js test/real-rules.test.js --watch", + "test-watch": "mocha-webpack --webpack-config source/webpack.test.js --require source-map-support/register --require test/helpers/browser.js \"test/**/*.test.js\" --watch", + "test": "mocha-webpack --webpack-config source/webpack.test.js --require source-map-support/register --include componentTestSetup.js --require test/helpers/browser.js \"./{,!(node_modules)/**/}!(webpack).test.js\"" }, "devDependencies": { + "@babel/core": "=7.0.0-beta.51", + "@babel/plugin-proposal-decorators": "=7.0.0-beta.51", + "@babel/plugin-proposal-object-rest-spread": "=7.0.0-beta.51", + "@babel/plugin-syntax-decorators": "=7.0.0-beta.51", + "@babel/polyfill": "=7.0.0-beta.51", + "@babel/preset-env": "=7.0.0-beta.51", "@babel/preset-flow": "^7.0.0-beta.51", + "@babel/preset-react": "=7.0.0-beta.51", + "akh": "^3.1.2", + "autoprefixer": "^8.6.3", + "babel-eslint": "^8.2.5", + "babel-loader": "8.0.0-beta.2", + "babel-plugin-syntax-dynamic-import": "^6.18.0", + "babel-plugin-transform-class-properties": "^6.24.1", + "babel-plugin-transform-decorators": "^6.24.1", + "babel-plugin-transform-do-expressions": "^6.22.0", + "babel-plugin-webpack-alias": "^2.1.2", "chai": "^4.1.2", + "co-request": "^1.0.0", + "connect-history-api-fallback": "^1.5.0", "copy-webpack-plugin": "^4.5.2", + "css-loader": "^0.28.11", + "csv-loader": "^2.1.1", + "daggy": "^1.2.0", + "dedent-js": "^1.0.1", "enzyme": "^3.3.0", "enzyme-adapter-react-16": "^1.1.1", "eslint": "^5.0.1", "eslint-config-prettier": "^2.9.0", "eslint-plugin-flowtype": "^2.46.3", "eslint-plugin-react": "^7.10.0", + "file-loader": "^1.1.11", "flow-bin": "^0.72.0", "flow-typed": "^2.4.0", + "google-translate-api": "^2.3.0", + "html-loader": "^0.5.5", "html-webpack-plugin": "^3.2.0", "intl": "^1.2.5", "intl-locales-supported": "^1.0.0", + "js-yaml": "^3.12.0", + "jsdom": "^11.11.0", + "json-loader": "^0.5.7", + "koa-connect": "^2.0.1", + "live-server": "^1.2.0", "mocha": "^5.0.4", "mocha-webpack": "^2.0.0-beta.0", + "nearley-loader": "^2.0.0", + "postcss-loader": "^2.1.2", + "ramda-fantasy": "^0.8.0", "sinon": "^4.5.0", "sinon-chai": "^3.0.0", + "source-map-support": "^0.5.4", + "style-loader": "^0.20.3", + "url-loader": "^1.0.1", + "webpack": "^4.12.1", + "webpack-cli": "^3.0.8", "webpack-pwa-manifest": "^3.6.2", - "workbox-webpack-plugin": "^3.3.1" + "webpack-serve": "^2.0.2", + "webpack-serve-overlay": "^0.2.2", + "webpack-serve-waitpage": "^1.0.0", + "workbox-webpack-plugin": "^3.3.1", + "yaml-loader": "^0.5.0" } } diff --git a/source/entry.js b/source/Provider.js similarity index 57% rename from source/entry.js rename to source/Provider.js index aa2147704..02f82d929 100644 --- a/source/entry.js +++ b/source/Provider.js @@ -1,24 +1,19 @@ -/* global process: false */ - -import ReactPiwik from 'Components/Tracker' +import { defaultTracker, TrackerProvider } from 'Components/utils/withTracker' import createHistory from 'history/createBrowserHistory' import i18next from 'i18next' -import React from 'react' -import { render } from 'react-dom' -import { AppContainer } from 'react-hot-loader' +import React, { PureComponent } from 'react' import { I18nextProvider } from 'react-i18next' import { Provider } from 'react-redux' import { Router } from 'react-router-dom' +import reducers from 'Reducers/rootReducer' import { applyMiddleware, compose, createStore } from 'redux' -import Layout from './components/inFranceApp/routes' -import computeThemeColours from './components/themeColours' -import { defaultTracker, TrackerProvider } from './components/withTracker' +import computeThemeColours from 'Ui/themeColours' import trackDomainActions from './middlewares/trackDomainActions' -import reducers from './reducers/reducers' import { persistSimulation, retrievePersistedSimulation } from './storage/persist' +import ReactPiwik from './Tracker' import { getIframeOption, getUrl } from './utils' let tracker = defaultTracker @@ -29,13 +24,14 @@ if (process.env.NODE_ENV === 'production') { trackErrors: true }) } + if (process.env.NODE_ENV === 'production') { let integratorUrl = getIframeOption('integratorUrl') ReactPiwik.push([ 'setCustomVariable', 1, 'urlPartenaire', - decodeURIComponent(integratorUrl || 'https://embauche.beta.gouv.fr'), + decodeURIComponent(integratorUrl || location.origin), 'visit' ]) } @@ -50,38 +46,8 @@ const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose let enhancer = composeEnhancers(applyMiddleware(trackDomainActions(tracker))) let store = createStore(reducers, initialStore, enhancer) -let anchor = document.querySelector('#js') persistSimulation(store) - -const history = createHistory() - -let App = ({ store }) => ( - - - - - - - - - -) - -render(, anchor) - -if (process.env.NODE_ENV !== 'production' && module.hot) { - module.hot.accept('./components/inFranceApp/routes', () => { - render( - - - , - anchor - ) - }) -} -export { anchor } - -if ('serviceWorker' in navigator) { +if (process.NODE_ENV === 'production' && 'serviceWorker' in navigator) { window.addEventListener('load', () => { navigator.serviceWorker .register('/sw.js') @@ -93,3 +59,24 @@ if ('serviceWorker' in navigator) { }) }) } + +export default class Layout extends PureComponent { + state = { + history: createHistory({ + basename: process.env.NODE_ENV === 'production' ? '' : this.props.basename + }) + } + render() { + return ( + + + + + <>{this.props.children} + + + + + ) + } +} diff --git a/source/components/Tracker.js b/source/Tracker.js similarity index 100% rename from source/components/Tracker.js rename to source/Tracker.js diff --git a/source/actions.js b/source/actions/actions.js similarity index 95% rename from source/actions.js rename to source/actions/actions.js index 3ac09d0ce..f2f28a058 100644 --- a/source/actions.js +++ b/source/actions/actions.js @@ -3,7 +3,7 @@ import type { ResetSimulationAction, LoadPreviousSimulationAction, DeletePreviousSimulationAction -} from './types/Actions' +} from 'Types/ActionsTypes' export function resetSimulation(): ResetSimulationAction { return { diff --git a/source/components/inFranceApp/actions.js b/source/actions/companyStatusActions.js similarity index 95% rename from source/components/inFranceApp/actions.js rename to source/actions/companyStatusActions.js index 2363de567..a47b12e36 100644 --- a/source/components/inFranceApp/actions.js +++ b/source/actions/companyStatusActions.js @@ -5,7 +5,7 @@ import type { CompanyHaveMultipleAssociateAction, DirectorStatus, DefineDirectorStatusAction -} from './types' +} from 'Types/companyStatusTypes' export function chooseCompanyLegalSetup( setup: CompanyLegalSetup diff --git a/source/components/Aide.js b/source/components/Aide.js index 8e9ce7487..daf0e4995 100644 --- a/source/components/Aide.js +++ b/source/components/Aide.js @@ -1,12 +1,12 @@ +import { EXPLAIN_VARIABLE } from 'Actions/actions' +import withColours from 'Components/utils/withColours' import marked from 'Engine/marked' import { findRuleByDottedName } from 'Engine/rules' import React, { Component } from 'react' import { connect } from 'react-redux' import { flatRulesSelector } from 'Selectors/analyseSelectors' -import { EXPLAIN_VARIABLE } from '../actions' import './Aide.css' import References from './rule/References' -import withColours from './withColours' @connect( state => ({ explained: state.explainedVariable, diff --git a/source/components/AttachDictionary.js b/source/components/AttachDictionary.js index e568944c7..6e5d60bcb 100644 --- a/source/components/AttachDictionary.js +++ b/source/components/AttachDictionary.js @@ -1,6 +1,8 @@ import marked from 'Engine/marked' import { path } from 'ramda' -import React, { Component } from 'react' +import React, { + Component +} from 'react' import ReactDOM from 'react-dom' import './Dictionary.css' import Overlay from './Overlay' diff --git a/source/components/Banner.css b/source/components/Banner.css index c8e0e8e5a..c55b1878e 100644 --- a/source/components/Banner.css +++ b/source/components/Banner.css @@ -11,7 +11,6 @@ .banner p { text-align: center; color: #4b4b66; - font-size: 85%; } .banner i { diff --git a/source/components/Banner.js b/source/components/Banner.js index b974289c0..e5d23400b 100644 --- a/source/components/Banner.js +++ b/source/components/Banner.js @@ -1,12 +1,12 @@ /* @flow */ -import React from 'react' -import type { Node } from 'react' -import { connect } from 'react-redux' +import withColours from 'Components/utils/withColours' import { compose } from 'ramda' -import withColours from './withColours' +import React from 'react' +import { connect } from 'react-redux' import './Banner.css' -import type { State } from '../types/State' +import type { Node } from 'react' +import type { State } from 'Types/State' type PropTypes = { hidden: boolean, diff --git a/source/components/inFranceApp/Checklist.css b/source/components/Checklist.css similarity index 100% rename from source/components/inFranceApp/Checklist.css rename to source/components/Checklist.css diff --git a/source/components/inFranceApp/Checklist.js b/source/components/Checklist.js similarity index 90% rename from source/components/inFranceApp/Checklist.js rename to source/components/Checklist.js index fa5ed892c..ce0b8717b 100644 --- a/source/components/inFranceApp/Checklist.js +++ b/source/components/Checklist.js @@ -1,8 +1,8 @@ /* @flow */ +import { toPairs } from 'ramda' import React from 'react' import { connect } from 'react-redux' -import * as Animate from './animate' -import { toPairs } from 'ramda' +import * as Animate from 'Ui/animate' import './Checklist.css' type Props = { @@ -10,7 +10,13 @@ type Props = { onChecklistItemChange: (string, string, boolean) => void } -export default ({ name: checklistName, title, subtitle, items, conclusion }) => +export default ({ + name: checklistName, + title, + subtitle, + items, + conclusion +}: any) => connect( state => ({ data: state.inFranceApp.checklists[checklistName] diff --git a/source/components/ResultView/Distribution.css b/source/components/Distribution.css similarity index 96% rename from source/components/ResultView/Distribution.css rename to source/components/Distribution.css index 8378ffd0b..b542411b9 100644 --- a/source/components/ResultView/Distribution.css +++ b/source/components/Distribution.css @@ -65,7 +65,6 @@ } .distribution-chart__branche-name { - padding-left: 0.4em; font-size: inherit !important; } } @@ -85,16 +84,13 @@ .distribution-chart__branche-name { font-weight: 500; + text-transform: capitalize; } .distribution-chart__icon { font-size: 200%; height: 1.2em; } -.distribution-chart__branche-name::first-letter { - text-transform: capitalize; -} - .distribution-chart__total { border-top: 1px dotted rgba(0, 0, 0, 0.7); color: black; diff --git a/source/components/ResultView/Distribution.js b/source/components/Distribution.js similarity index 94% rename from source/components/ResultView/Distribution.js rename to source/components/Distribution.js index 4914a1d87..e449b658a 100644 --- a/source/components/ResultView/Distribution.js +++ b/source/components/Distribution.js @@ -1,21 +1,20 @@ /* @flow */ import Observer from '@researchgate/react-intersection-observer' +import withColours from 'Components/utils/withColours' import React, { Component } from 'react' import emoji from 'react-easy-emoji' import { Trans } from 'react-i18next' import { connect } from 'react-redux' import { config, Spring } from 'react-spring' import { compose } from 'redux' -import { capitalise0 } from '../../utils' -import withColours from '../withColours' +import répartitionSelector from 'Selectors/repartitionSelector' import './Distribution.css' import Montant from './Montant' import './PaySlip' import RuleLink from './RuleLink' -import répartitionSelector from './RépartitionSelector' -import type { Répartition, Branche } from './types' +import type { Répartition, Branche } from 'Types/ResultViewTypes.js' const brancheToEmoji: { [Branche]: string } = { retraite: '👵', @@ -112,9 +111,7 @@ class Distribution extends Component {

- - {capitalise0(brancheToLabel[branche] || branche)} - + {brancheToLabel[branche] || branche} {'. '} {brancheToCounterparts[branche]} diff --git a/source/components/GoToExplanations.js b/source/components/GoToExplanations.js index 8f361b838..f98f2d950 100644 --- a/source/components/GoToExplanations.js +++ b/source/components/GoToExplanations.js @@ -1,10 +1,10 @@ +import withColours from 'Components/utils/withColours' +import withTracker from 'Components/utils/withTracker' import React, { Component } from 'react' import { Trans, translate } from 'react-i18next' import { Element, scroller } from 'react-scroll' +import { LinkButton } from 'Ui/Button' import './conversation/conversation.css' -import { SimpleButton } from './ui/Button' -import withColours from './withColours' -import withTracker from './withTracker' @translate() @withColours @@ -21,12 +21,12 @@ export default class GoToExplanation extends Component { render() { return ( -