Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Suppression de redux-form #671

Merged
merged 7 commits into from Sep 23, 2019
Merged

Suppression de redux-form #671

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
7a5beb9
Gestion de l'état "situation" avec nos propres actions
mquandalle Sep 12, 2019
3fbd94b
🔥 Suppression de redux-form
mquandalle Sep 13, 2019
dbbb67e
Ajout du lint pour les hooks React
mquandalle Sep 15, 2019
8c9a401
Input permanent pour les objectifs du simulateur
mquandalle Sep 17, 2019
0ddc2d0
Ajout des règles dans le state Redux
mquandalle Sep 17, 2019
7a965e6
🐛 Correction formatage de l'AnimatedValue
mquandalle Sep 18, 2019
ffd65ae
Ajout d'un paramètre explicite "rules" au reducer
mquandalle Sep 23, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
6 changes: 5 additions & 1 deletion source/components/CurrencyInput/CurrencyInput.js
View file
Open in desktop
Expand Up @@ -24,6 +24,7 @@ let currencyFormat = language => ({
export default function CurrencyInput({
value: valueProp = '',
debounce: debounceTimeout,
currencySymbol = '€',
onChange,
language,
className,
Expand Down Expand Up @@ -76,14 +77,17 @@ export default function CurrencyInput({
<div
className={classnames(className, 'currencyInput__container')}
{...(valueLength > 5 ? { style: { width } } : {})}>
{isCurrencyPrefixed && '€'}
{!currentValue && isCurrencyPrefixed && currencySymbol}
<NumberFormat
{...forwardedProps}
thousandSeparator={thousandSeparator}
decimalSeparator={decimalSeparator}
allowNegative={!valueHasChanged}
className="currencyInput__input"
inputMode="numeric"
prefix={
isCurrencyPrefixed && currencySymbol ? `${currencySymbol} ` : ''
}
onValueChange={({ value }) => {
setCurrentValue(value)
nextValue.current = value.toString().replace(/^-/, '')
Expand Down
22 changes: 15 additions & 7 deletions source/components/CurrencyInput/CurrencyInput.test.js
View file
Open in desktop
Expand Up @@ -24,10 +24,18 @@ describe('CurrencyInput', () => {
})

it('should separate thousand groups', () => {
const input1 = getInput(<CurrencyInput value={1000} language="fr" />)
const input2 = getInput(<CurrencyInput value={1000} language="en" />)
const input3 = getInput(<CurrencyInput value={1000.5} language="en" />)
const input4 = getInput(<CurrencyInput value={1000000} language="en" />)
const input1 = getInput(
<CurrencyInput value={1000} language="fr" currencySymbol={''} />
)
const input2 = getInput(
<CurrencyInput value={1000} language="en" currencySymbol={''} />
)
const input3 = getInput(
<CurrencyInput value={1000.5} language="en" currencySymbol={''} />
)
const input4 = getInput(
<CurrencyInput value={1000000} language="en" currencySymbol={''} />
)
expect(input1.instance().value).to.equal('1 000')
expect(input2.instance().value).to.equal('1,000')
expect(input3.instance().value).to.equal('1,000.5')
Expand Down Expand Up @@ -90,7 +98,7 @@ describe('CurrencyInput', () => {
const clock = useFakeTimers()
let onChange = spy()
const input = getInput(
<CurrencyInput onChange={onChange} debounce={1000} />
<CurrencyInput onChange={onChange} debounce={1000} currencySymbol={''} />
)
input.simulate('change', { target: { value: '1', focus: () => {} } })
expect(onChange).not.to.have.been.called
Expand All @@ -106,12 +114,12 @@ describe('CurrencyInput', () => {
})

it('should initialize with value of the value prop', () => {
const input = getInput(<CurrencyInput value={1} />)
const input = getInput(<CurrencyInput value={1} language="fr" />)
expect(input.instance().value).to.equal('1')
})

it('should update its value if the value prop changes', () => {
const component = mount(<CurrencyInput value={1} />)
const component = mount(<CurrencyInput value={1} language="fr" />)
component.setProps({ value: 2 })
expect(component.find('input').instance().value).to.equal('2')
})
Expand Down
5 changes: 4 additions & 1 deletion source/components/PeriodSwitch.js
View file
Open in desktop
Expand Up @@ -29,7 +29,10 @@ export default function PeriodSwitch() {
},
[dispatch, rules, situation]
)
const periods = ['mois', 'année']
let periods = ['mois', 'année']
if (initialPeriod === 'année') {
periods.reverse()
}

return (
<span id="PeriodSwitch">
Expand Down
34 changes: 23 additions & 11 deletions source/components/TargetSelection.css
View file
Open in desktop
Expand Up @@ -106,35 +106,47 @@
text-decoration: none;
}

#targetSelection .editable:not(.attractClick) {
border: 2px solid rgba(0, 0, 0, 0);
border-bottom: 1px dashed #ffffff91;
min-width: 2.5em;
display: inline-block;
}
#targetSelection .targetInputOrValue > :not(.targetInput):not(.attractClick) {
margin: 0.2rem 0.6rem;
}

#targetSelection .attractClick.editable::before {
content: '€';
#targetSelection input {
margin: 2.7px 0;
}

#targetSelection .attractClick,
#targetSelection .targetInput {
width: 5.5em;
max-width: 7.5em;
display: inline-block;
text-align: right;
background: rgba(255, 255, 255, 0.2);
cursor: text;
padding: 0;
padding: 0.2rem 0.6rem;
border-radius: 0.3rem;
border: 2px solid;
font-size: inherit;
}

#targetSelection .editableTarget {
max-width: 7.5em;
display: inline-block;
text-align: right;
padding: 0 2px;
font-size: inherit;
}

#targetSelection .targetInputBottomBorder {
margin: 0;
padding: 0;
height: 0;
overflow: hidden;
position: relative;
top: -6px;
}

#targetSelection .editableTarget + .targetInputBottomBorder {
border-bottom: 1px dashed #ffffff91;
}

#targetSelection .unit {
margin-left: 0.4em;
font-size: 110%;
Expand Down