Styled component update : rempace useContext(ThemeContext) par useTheme
parent
6cc6a2ee23
commit
930b382c5a
|
@ -2,7 +2,7 @@ import { formatValue } from 'publicodes'
|
|||
import React, { useContext } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import { animated, config, useSpring } from 'react-spring'
|
||||
import { styled, ThemeContext } from 'styled-components'
|
||||
import { styled, useTheme } from 'styled-components'
|
||||
|
||||
import useDisplayOnIntersecting from '@/components/utils/useDisplayOnIntersecting'
|
||||
import { Emoji } from '@/design-system/emoji'
|
||||
|
@ -30,7 +30,7 @@ function ChartItemBar({
|
|||
colors: {
|
||||
bases: { primary },
|
||||
},
|
||||
} = useContext(ThemeContext)
|
||||
} = useTheme()
|
||||
const style = useSpring({
|
||||
config: config.slow,
|
||||
delay: 100,
|
||||
|
|
|
@ -3,10 +3,9 @@ import BarChartBranch from '@/components/BarChart'
|
|||
import '@/components/Distribution.css'
|
||||
|
||||
import { DottedName } from 'modele-social'
|
||||
import { useContext } from 'react'
|
||||
import { Trans, useTranslation } from 'react-i18next'
|
||||
import { useSelector } from 'react-redux'
|
||||
import { ThemeContext } from 'styled-components'
|
||||
import { useTheme } from 'styled-components'
|
||||
|
||||
import Value, {
|
||||
Condition,
|
||||
|
@ -31,7 +30,7 @@ import { DistributionSection } from './SalaryExplanation'
|
|||
|
||||
export default function IndépendantExplanation() {
|
||||
const { t } = useTranslation()
|
||||
const { colors } = useContext(ThemeContext)
|
||||
const { colors } = useTheme()
|
||||
|
||||
return (
|
||||
<>
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import { useContext, useRef } from 'react'
|
||||
import { useRef } from 'react'
|
||||
import { Trans, useTranslation } from 'react-i18next'
|
||||
import { ThemeContext } from 'styled-components'
|
||||
import { useTheme } from 'styled-components'
|
||||
|
||||
import Distribution from '@/components/Distribution'
|
||||
import PaySlip from '@/components/PaySlip'
|
||||
|
@ -105,7 +105,7 @@ export default function SalaryExplanation() {
|
|||
|
||||
function RevenueRepartitionSection(props: { onSeePayslip: () => void }) {
|
||||
const { t } = useTranslation()
|
||||
const { colors } = useContext(ThemeContext)
|
||||
const { colors } = useTheme()
|
||||
const { currentSimulatorData } = useCurrentSimulatorData()
|
||||
|
||||
return (
|
||||
|
|
|
@ -2,7 +2,7 @@ import { BlobProvider } from '@react-pdf/renderer'
|
|||
import { RuleNode, utils } from 'publicodes'
|
||||
import { lazy, Suspense, useContext, useRef, useState } from 'react'
|
||||
import SignaturePad from 'react-signature-pad-wrapper'
|
||||
import { ThemeContext } from 'styled-components'
|
||||
import { useTheme } from 'styled-components'
|
||||
|
||||
import { TrackingContext, TrackPage } from '@/components/ATInternetTracking'
|
||||
import { Condition } from '@/components/EngineValue'
|
||||
|
@ -37,7 +37,7 @@ export default function EndBlock({ fields, missingValues }: EndBlockProps) {
|
|||
const engine = useContext(EngineContext)
|
||||
const signatureRef = useRef<SignaturePadInstance>()
|
||||
const tracker = useContext(TrackingContext)
|
||||
const { colors } = useContext(ThemeContext)
|
||||
const { colors } = useTheme()
|
||||
if (missingValues.length) {
|
||||
return (
|
||||
<Message type="info" icon>
|
||||
|
|
|
@ -1,6 +1,5 @@
|
|||
import { useContext } from 'react'
|
||||
import { Trans, useTranslation } from 'react-i18next'
|
||||
import { ThemeContext } from 'styled-components'
|
||||
import { useTheme } from 'styled-components'
|
||||
|
||||
import ChiffreAffairesActivitéMixte from '@/components/ChiffreAffairesActivitéMixte'
|
||||
import { WhenAlreadyDefined } from '@/components/EngineValue'
|
||||
|
@ -54,7 +53,7 @@ export default function AutoEntrepreneur() {
|
|||
|
||||
function Explanation() {
|
||||
const { t } = useTranslation()
|
||||
const { colors } = useContext(ThemeContext)
|
||||
const { colors } = useTheme()
|
||||
|
||||
return (
|
||||
<section>
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
import { DottedName } from 'modele-social'
|
||||
import { useContext, useEffect, useState } from 'react'
|
||||
import { useEffect, useState } from 'react'
|
||||
import { Trans, useTranslation } from 'react-i18next'
|
||||
import { useDispatch } from 'react-redux'
|
||||
import { ThemeContext } from 'styled-components'
|
||||
import { useTheme } from 'styled-components'
|
||||
|
||||
import { Condition } from '@/components/EngineValue'
|
||||
import Notifications from '@/components/Notifications'
|
||||
|
@ -107,7 +107,7 @@ const DividendesSimulationGoals = () => (
|
|||
|
||||
const DividendesExplanation = () => {
|
||||
const { t } = useTranslation()
|
||||
const { colors } = useContext(ThemeContext)
|
||||
const { colors } = useTheme()
|
||||
|
||||
return (
|
||||
<Condition expression="bénéficiaire . dividendes . bruts > 0">
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
import { formatValue } from 'publicodes'
|
||||
import { ComponentProps, ReactElement, ReactNode, useContext } from 'react'
|
||||
import { ComponentProps, ReactElement, ReactNode } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import {
|
||||
Area,
|
||||
|
@ -16,7 +16,7 @@ import {
|
|||
XAxis,
|
||||
YAxis,
|
||||
} from 'recharts'
|
||||
import { ThemeContext } from 'styled-components'
|
||||
import { useTheme } from 'styled-components'
|
||||
|
||||
import { StyledLegend } from '@/components/charts/PagesCharts'
|
||||
import { Strong } from '@/design-system/typography'
|
||||
|
@ -77,7 +77,7 @@ export default function VisitsChart({
|
|||
}: VisitsChartProps) {
|
||||
const { t } = useTranslation()
|
||||
const [darkMode] = useDarkMode()
|
||||
const { colors } = useContext(ThemeContext)
|
||||
const { colors } = useTheme()
|
||||
if (!data.length) {
|
||||
return null
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue