🎴 Déplace les icônes des références vers mon-entreprise

mon-entreprise/source/sites/mon-entreprise.fr/pages/Documentation.tsx

@@ -48,11 +48,13 @@ export default function RulePage() {
 				language={i18n.language as 'fr' | 'en'}
 				engine={engine}
 				documentationPath={documentationPath}
+				referenceImages={referencesImages}
 			/>
 			{/* <button>Voir l</button> */}
 		</Animate.fromBottom>
 	)
 }
+
 function BackToSimulation() {
 	const dispatch = useDispatch()
 	const handleClick = useCallback(() => {
@@ -79,3 +81,17 @@ function DocumentationLanding() {
 		</>
 	)
 }
+
+const referencesImages = {
+	'service-public.fr': 'images/références/marianne.png',
+	'urssaf.fr': 'images/références/URSSAF.png',
+	'secu-independants.fr': 'images/références/URSSAF.png',
+	'gouv.fr': 'images/références/marianne.png',
+	'agirc-arrco.fr': 'images/références/agirc-arrco.png',
+	'pole-emploi.fr': 'images/références/pole-emploi.png',
+	'ladocumentationfrançaise.fr':
+		'images/références/ladocumentationfrançaise.png',
+	'senat.fr': 'images/références/senat.png',
+	'ameli.fr': 'images/références/ameli.png',
+	'bpifrance-creation': 'images/références/bpi-création.png',
+}

package.json

@@ -115,7 +115,7 @@
 		"prepare": "if [ -z \"$NETLIFY\" ]; then yarn workspaces run prepare; fi",
 		"lint": "yarn lint:eslintrc && yarn lint:eslint && yarn lint:prettier",
 		"test": "yarn workspaces run test",
-		"test:type": "yarn workspace publicodes run tsc && yarn workspace mon-entreprise run tsc",
+		"test:type": "yarn workspace publicodes run tsc && yarn workspace publicodes-react run tsc && yarn workspace mon-entreprise run tsc",
 		"test:regressions": "jest",
 		"clean": "yarn workspaces run clean",
 		"start": "yarn workspace publicodes build --watch & yarn workspace publicodes-react build --watch & yarn workspace mon-entreprise start",

publicodes-react/source/contexts.tsx

@@ -3,3 +3,4 @@ import Engine from 'publicodes'
 
 export const BasepathContext = createContext<string>('/documentation')
 export const EngineContext = createContext<Engine<string> | null>(null)
+export const ReferencesImagesContext = createContext<Record<string, string>>({})

publicodes-react/source/index.tsx

@@ -2,7 +2,11 @@ import React, { useEffect } from 'react'
 import { Route } from 'react-router-dom'
 import Engine, { utils } from 'publicodes'
 import i18n from 'i18next'
-import { BasepathContext, EngineContext } from './contexts'
+import {
+	BasepathContext,
+	EngineContext,
+	ReferencesImagesContext,
+} from './contexts'
 import RulePage from './rule/RulePage'
 const { decodeRuleName, encodeRuleName } = utils
 
@@ -15,12 +19,14 @@ type DocumentationProps = {
 	documentationPath: string
 	engine: Engine
 	language: 'fr' | 'en'
+	referenceImages?: Record<string, string>
 }
 
 export function Documentation({
 	documentationPath,
 	engine,
 	language = 'fr',
+	referenceImages = {},
 }: DocumentationProps) {
 	useEffect(() => {
 		if (language !== i18n.language) {
@@ -31,18 +37,20 @@ export function Documentation({
 	return (
 		<EngineContext.Provider value={engine}>
 			<BasepathContext.Provider value={documentationPath}>
-				<Route
-					path={documentationPath + '/:name+'}
-					render={({ match }) => {
-						return (
-							<RulePage
-								dottedName={decodeRuleName(match.params.name)}
-								engine={engine}
-								language={'fr'}
-							/>
-						)
-					}}
-				/>
+				<ReferencesImagesContext.Provider value={referenceImages}>
+					<Route
+						path={documentationPath + '/:name+'}
+						render={({ match }) => {
+							return (
+								<RulePage
+									dottedName={decodeRuleName(match.params.name)}
+									engine={engine}
+									language={'fr'}
+								/>
+							)
+						}}
+					/>
+				</ReferencesImagesContext.Provider>
 			</BasepathContext.Provider>
 		</EngineContext.Provider>
 	)

publicodes-react/source/rule/References.tsx

@@ -1,24 +1,8 @@
 import { toPairs } from 'ramda'
 import { capitalise0 } from 'publicodes'
 import styled from 'styled-components'
-
-const references = {
-	// 'service-public.fr': require('url-loader!./références/marianne.png').default,
-	// 'urssaf.fr': require('url-loader!./références/URSSAF.png').default,
-	// 'secu-independants.fr': require('url-loader!./références/URSSAF.png').default,
-	// 'gouv.fr': require('url-loader!./références/marianne.png').default,
-	// 'agirc-arrco.fr': require('url-loader!./références/agirc-arrco.png').default,
-	// 'pole-emploi.fr': require('url-loader!./références/pole-emploi.png').default,
-	// 'ladocumentationfrançaise.fr': require('url-loader!./références/ladocumentationfrançaise.png')
-	// 	.default,
-	// 'senat.fr': require('url-loader!./références/senat.png').default,
-	// 'ameli.fr': require('url-loader!./références/ameli.png').default,
-	// 'bpifrance-creation': require('url-loader!./références/bpi-création.png')
-	// 	.default,
-}
-
-const findRefKey = (link: string) =>
-	Object.keys(references).find((r) => link.includes(r))
+import { useContext } from 'react'
+import { ReferencesImagesContext } from '../contexts'
 
 const cleanDomain = (link: string) =>
 	(link.includes('://') ? link.split('/')[2] : link.split('/')[0]).replace(
@@ -31,8 +15,15 @@ type RefProps = {
 	link: string
 }
 
+// TODO: currently we only allow customizing the list of "references icons", but
+// this migth be limited for more advanced usages. For instance futur.eco uses a
+// different renderer for references:
+// https://futur.eco/documentation/transport/avion/impact We will probably want
+// to allow the user to provide its own components that can be inserted at
+// certains positions in the generated documentation ("hooks").
 function Ref({ name, link }: RefProps) {
-	const refKey = findRefKey(link)
+	const references = useContext(ReferencesImagesContext)
+	const refKey = Object.keys(references).find((r) => link.includes(r))
 	const domain = cleanDomain(link)
 	return (
 		<li

yarn.lock

@@ -2289,6 +2289,11 @@
   resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.5.tgz#dcce4430e64b443ba8945f0290fb564ad5bac6dd"
   integrity sha512-7+2BITlgjgDhH0vvwZU/HZJVyk+2XUlvxXe8dFMedNX/aMkaOq++rMAFXc0tM7ij15QaWlbdQASBR9dihi+bDQ==
 
+"@types/json-schema@^7.0.6":
+  version "7.0.6"
+  resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.6.tgz#f4c7ec43e81b319a9815115031709f26987891f0"
+  integrity sha512-3c+yGKvVP5Y9TYBEibGNR+kLtijnj7mYrXRg+WpFb2X9xm04g/DXYkfg4hmzJQosc9snFNUPkbYIhu+KAm6jJw==
+
 "@types/mini-css-extract-plugin@^0.9.1":
   version "0.9.1"
   resolved "https://registry.yarnpkg.com/@types/mini-css-extract-plugin/-/mini-css-extract-plugin-0.9.1.tgz#d4bdde5197326fca039d418f4bdda03dc74dc451"
@@ -2933,7 +2938,7 @@ ajv-errors@^1.0.0:
   resolved "https://registry.yarnpkg.com/ajv-errors/-/ajv-errors-1.0.1.tgz#f35986aceb91afadec4102fbd85014950cefa64d"
   integrity sha512-DCRfO/4nQ+89p/RK43i8Ezd41EqdGIU4ld7nGF8OQ14oc/we5rEntLCUa7+jrn3nn83BosfwZA0wb4pon2o8iQ==
 
-ajv-keywords@^3.1.0, ajv-keywords@^3.4.1:
+ajv-keywords@^3.1.0, ajv-keywords@^3.4.1, ajv-keywords@^3.5.2:
   version "3.5.2"
   resolved "https://registry.yarnpkg.com/ajv-keywords/-/ajv-keywords-3.5.2.tgz#31f29da5ab6e00d1c2d329acf7b5929614d5014d"
   integrity sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==
@@ -2958,6 +2963,16 @@ ajv@^6.1.0, ajv@^6.10.0, ajv@^6.10.2, ajv@^6.12.2, ajv@^6.12.3:
     json-schema-traverse "^0.4.1"
     uri-js "^4.2.2"
 
+ajv@^6.12.5:
+  version "6.12.6"
+  resolved "https://registry.yarnpkg.com/ajv/-/ajv-6.12.6.tgz#baf5a62e802b07d977034586f8c3baf5adf26df4"
+  integrity sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==
+  dependencies:
+    fast-deep-equal "^3.1.1"
+    fast-json-stable-stringify "^2.0.0"
+    json-schema-traverse "^0.4.1"
+    uri-js "^4.2.2"
+
 ally.js@^1.4.1:
   version "1.4.1"
   resolved "https://registry.yarnpkg.com/ally.js/-/ally.js-1.4.1.tgz#9fb7e6ba58efac4ee9131cb29aa9ee3b540bcf1e"
@@ -9107,7 +9122,7 @@ mime-types@2.1.18:
   dependencies:
     mime-db "~1.33.0"
 
-mime-types@^2.1.12, mime-types@^2.1.26, mime-types@~2.1.19, mime-types@~2.1.24:
+mime-types@^2.1.12, mime-types@^2.1.27, mime-types@~2.1.19, mime-types@~2.1.24:
   version "2.1.27"
   resolved "https://registry.yarnpkg.com/mime-types/-/mime-types-2.1.27.tgz#47949f98e279ea53119f5722e0f34e529bec009f"
   integrity sha512-JIhqnCasI9yD+SsmkquHBxTSEuZdQX5BuQnS2Vc7puQQQ+8yiP5AY5uWhpdv4YL4VM5c6iliiYWPgJ/nJQLp7w==
@@ -11959,6 +11974,15 @@ schema-utils@^2.6.5, schema-utils@^2.6.6:
     ajv "^6.12.2"
     ajv-keywords "^3.4.1"
 
+schema-utils@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/schema-utils/-/schema-utils-3.0.0.tgz#67502f6aa2b66a2d4032b4279a2944978a0913ef"
+  integrity sha512-6D82/xSzO094ajanoOSbe4YvXWMfn2A//8Y1+MUqFAJul5Bs+yn36xbK9OtNDcRVSBJ9jjeoXftM6CfztsjOAA==
+  dependencies:
+    "@types/json-schema" "^7.0.6"
+    ajv "^6.12.5"
+    ajv-keywords "^3.5.2"
+
 select@^1.1.2:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/select/-/select-1.1.2.tgz#0e7350acdec80b1108528786ec1d4418d11b396d"
@@ -13385,13 +13409,13 @@ url-join@^2.0.5:
   integrity sha1-WvIvGMBSoACkjXuCxenC4v7tpyg=
 
 url-loader@^4.1.0:
-  version "4.1.0"
-  resolved "https://registry.yarnpkg.com/url-loader/-/url-loader-4.1.0.tgz#c7d6b0d6b0fccd51ab3ffc58a78d32b8d89a7be2"
-  integrity sha512-IzgAAIC8wRrg6NYkFIJY09vtktQcsvU8V6HhtQj9PTefbYImzLB1hufqo4m+RyM5N3mLx5BqJKccgxJS+W3kqw==
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/url-loader/-/url-loader-4.1.1.tgz#28505e905cae158cf07c92ca622d7f237e70a4e2"
+  integrity sha512-3BTV812+AVHHOJQO8O5MkWgZ5aosP7GnROJwvzLS9hWDj00lZ6Z0wNak423Lp9PBZN05N+Jk/N5Si8jRAlGyWA==
   dependencies:
     loader-utils "^2.0.0"
-    mime-types "^2.1.26"
-    schema-utils "^2.6.5"
+    mime-types "^2.1.27"
+    schema-utils "^3.0.0"
 
 url@0.11.0, url@^0.11.0:
   version "0.11.0"