betagouv
/
mon-entreprise
mirror of https://github.com/betagouv/mon-entreprise
1
0
Fork 0
Code Releases Activity

Affichage du code source d'une règle et ses filles

pull/386/head
Mael 2018-10-22 15:33:00 +00:00
parent b4295b10cc
commit 61760839dc
4 changed files with 108 additions and 78 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

135
source/components/rule/Rule.js
View File

@ -27,6 +27,8 @@ import References from './References'
import './Rule.css'
import { AttachDictionary } from '../AttachDictionary'
import knownMecanisms from 'Engine/known-mecanisms.yaml'
import emoji from 'react-easy-emoji'
import Source from './RuleSource'
export default compose(
connect((state, props) => ({
@ -41,6 +43,7 @@ export default compose(
withLanguage
)(
class Rule extends Component {
state = { viewSource: false }
render() {
let {
dottedName,
@ -60,70 +63,82 @@ export default compose(
let showValues = valuesToShow || currentExample
return (
<div id="rule" className="ui__ container">
<Helmet>
<title>{title}</title>
<meta name="description" content={description} />
</Helmet>
<RuleHeader
{...{
ns,
type,
description,
question,
flatRule,
flatRules,
name,
title,
icon
}}
/>
<>
<button
onClick={() =>
this.setState({ viewSource: !this.state.viewSource })
}>
{emoji('🔍')}
</button>
{this.state.viewSource ? (
<Source dottedName={dottedName} />
) : (
<div id="rule" className="ui__ container">
<Helmet>
<title>{title}</title>
<meta name="description" content={description} />
</Helmet>
<RuleHeader
{...{
ns,
type,
description,
question,
flatRule,
flatRules,
name,
title,
icon
}}
/>
<section id="rule-content">
{displayedRule.nodeValue ? (
<div id="ruleValue">
<i className="fa fa-calculator" aria-hidden="true" />{' '}
{displayedRule.format === 'euros' || displayedRule.formule
? Intl.NumberFormat(language, {
style: 'currency',
currency: 'EUR'
}).format(displayedRule.nodeValue)
: typeof displayedRule.nodeValue !== 'object'
? displayedRule.nodeValue
: null}
</div>
) : null}
<section id="rule-content">
{displayedRule.nodeValue ? (
<div id="ruleValue">
<i className="fa fa-calculator" aria-hidden="true" />{' '}
{displayedRule.format === 'euros' || displayedRule.formule
? Intl.NumberFormat(language, {
style: 'currency',
currency: 'EUR'
}).format(displayedRule.nodeValue)
: typeof displayedRule.nodeValue !== 'object'
? displayedRule.nodeValue
: null}
</div>
) : null}
{displayedRule.defaultValue != null &&
typeof displayedRule.defaultValue !== 'object' ? (
<div id="ruleDefault">
Valeur par défaut : {displayedRule.defaultValue}
</div>
) : null}
{displayedRule.defaultValue != null &&
typeof displayedRule.defaultValue !== 'object' ? (
<div id="ruleDefault">
Valeur par défaut : {displayedRule.defaultValue}
</div>
) : null}
{//flatRule.question &&
// Fonctionnalité intéressante, à implémenter correctement
false && <UserInput {...{ flatRules, dottedName }} />}
{flatRule.ns && (
<Algorithm rule={displayedRule} showValues={showValues} />
)}
{flatRule.note && (
<section id="notes">
<h3>Note: </h3>
{createMarkdownDiv(flatRule.note)}
{//flatRule.question &&
// Fonctionnalité intéressante, à implémenter correctement
false && <UserInput {...{ flatRules, dottedName }} />}
{flatRule.ns && (
<Algorithm rule={displayedRule} showValues={showValues} />
)}
{flatRule.note && (
<section id="notes">
<h3>Note: </h3>
{createMarkdownDiv(flatRule.note)}
</section>
)}
<Examples
currentExample={currentExample}
situationExists={valuesToShow}
rule={displayedRule}
/>
{!isEmpty(namespaceRules) && (
<NamespaceRulesList {...{ namespaceRules }} />
)}
{this.renderReferences(flatRule)}
</section>
)}
<Examples
currentExample={currentExample}
situationExists={valuesToShow}
rule={displayedRule}
/>
{!isEmpty(namespaceRules) && (
<NamespaceRulesList {...{ namespaceRules }} />
)}
{this.renderReferences(flatRule)}
</section>
</div>
</div>
)}
</>
)
}

28
source/components/rule/RuleSource.js Normal file
View File

@ -0,0 +1,28 @@
import React, { Component } from 'react'
import yaml from 'js-yaml'
import rules from 'Règles/base.yaml'
import emoji from 'react-easy-emoji'
import MonacoEditor from 'react-monaco-editor'
import { buildDottedName } from 'Engine/rules'
export default class Source extends Component {
render() {
let { dottedName } = this.props,
source = rules.filter(rule => buildDottedName(rule).includes(dottedName))
return (
<div id="Source" className="ui__ container">
<h2>
{emoji('⛰️ ')}
Source de <code>{dottedName}</code>
</h2>
<MonacoEditor
height="800"
width="1000"
language={'yaml'}
value={yaml.safeDump(source)}
/>
</div>
)
}
}

2
source/engine/rules.js
View File

@ -73,7 +73,7 @@ export let enrichRule = (rule, sharedData = {}) => {
}
}
let buildDottedName = rule =>
export let buildDottedName = rule =>
rule['espace'] ? [rule['espace'], rule['nom']].join(' . ') : rule['nom']
// les variables dans les tests peuvent être exprimées relativement à l'espace de nom de la règle,

21
source/sites/embauche.gouv.fr/pages/Source.js
View File

@ -2,29 +2,16 @@ import React, { Component } from 'react'
import { connect } from 'react-redux'
import { flatRulesSelector } from 'Selectors/analyseSelectors'
import { render } from 'react-dom'
import MonacoEditor from 'react-monaco-editor'
import yaml from 'js-yaml'
import rawRules from '!raw-loader!Règles/base.yaml'
import rawRulesText from '!raw-loader!Règles/base.yaml'
import rawRules from 'Règles/base.yaml'
@connect(state => ({
flatRules: flatRulesSelector(state)
}))
export default class Source extends Component {
state = {
code: rawRules
}
render() {
let { flatRules } = this.props
return (
<div id="Source" className="ui__ container">
<h1>La source</h1>
<MonacoEditor
width="800"
height="600"
language="yaml"
theme="vs-dark"
value={this.state.code}
/>
<h1>La sourceee</h1>
<div style={{ whiteSpace: 'pre-line' }}>{yaml.safeDump(rawRules)}</div>
</div>
)
}