diff --git a/src/components/Analysis/MonthlyAnalysis.tsx b/src/components/Analysis/MonthlyAnalysis.tsx
index 41162174c4dc579f5f82cba4ae1ee4de30bb6eb9..520fd87c1e03ab8f2c16efb0023105284d8d5416 100644
--- a/src/components/Analysis/MonthlyAnalysis.tsx
+++ b/src/components/Analysis/MonthlyAnalysis.tsx
@@ -72,6 +72,7 @@ const MonthlyAnalysis: React.FC = () => {
         fluidTypes,
         periods.comparisonTimePeriod
       )
+
       if (subscribed) {
         if (fetchedPerformanceIndicators) {
           const fluidLackOfDataIndicators: Array<FluidType> = []
diff --git a/src/components/Challenge/ChallengeCardOnGoing.tsx b/src/components/Challenge/ChallengeCardOnGoing.tsx
index 70538bfe1374bfc3a7a177e91c648cf5f2fce50d..73d13c48b723efffce95087b59620b58c227d35b 100644
--- a/src/components/Challenge/ChallengeCardOnGoing.tsx
+++ b/src/components/Challenge/ChallengeCardOnGoing.tsx
@@ -26,6 +26,7 @@ import { UserQuizState } from 'enum/userQuiz.enum'
 import ChallengeNoFluidModal from './ChallengeNoFluidModal'
 import { UserExplorationState } from 'enum/userExploration.enum'
 import { UserActionState } from 'enum/userAction.enum'
+import StyledBlackSpinner from 'components/CommonKit/Spinner/StyledBlackSpinner'
 
 interface ChallengeCardOnGoingProps {
   userChallenge: UserChallenge
@@ -37,9 +38,10 @@ const ChallengeCardOnGoing: React.FC<ChallengeCardOnGoingProps> = ({
   const { t } = useI18n()
   const dispatch = useDispatch()
   const history = useHistory()
-  const [isOneFluidUp, setIsOneFluidUp] = useState(true)
-  const [challengeIcon, setChallengeIcon] = useState(defaultIcon)
-  const [isDone, setisDone] = useState(false)
+  const [isOneFluidUp, setIsOneFluidUp] = useState<boolean>(true)
+  const [challengeIcon, setChallengeIcon] = useState<string>(defaultIcon)
+  const [isDone, setisDone] = useState<boolean>(false)
+  const [isLoading, setIsLoading] = useState<boolean>(false)
   const {
     challenge: { currentDataload },
     global: { fluidTypes, fluidStatus },
@@ -49,6 +51,7 @@ const ChallengeCardOnGoing: React.FC<ChallengeCardOnGoingProps> = ({
     setIsOneFluidUp(prev => !prev)
   }, [])
   const goDuel = async () => {
+    setIsLoading(true)
     //Check if at least one fluid is up
     if (fluidTypes.length !== 0) {
       if (userChallenge.duel.state !== UserDuelState.ONGOING) {
@@ -61,8 +64,10 @@ const ChallengeCardOnGoing: React.FC<ChallengeCardOnGoingProps> = ({
         )
         dispatch(updateUserChallengeList(updatedChallenge))
       }
+      setIsLoading(false)
       history.push('/challenges/duel')
     } else {
+      setIsLoading(false)
       toggleNoFluidModal()
     }
   }
@@ -215,18 +220,27 @@ const ChallengeCardOnGoing: React.FC<ChallengeCardOnGoingProps> = ({
           <StarsContainer result={userChallenge.progress.actionProgress} />
         </div>
       </div>
-      {userChallenge.progress.actionProgress +
+      {(userChallenge.progress.actionProgress +
         userChallenge.progress.explorationProgress +
         userChallenge.progress.quizProgress >=
         userChallenge.target &&
-      userChallenge.duel.state === UserDuelState.UNLOCKED ? (
+        userChallenge.duel.state === UserDuelState.UNLOCKED) ||
+      userChallenge.duel.state === UserDuelState.NO_REF_PERIOD_VALID ? (
         <button className="smallCard goDuel" onClick={goDuel}>
-          {t('challenge.card.ongoing.duel')}
-          <StyledIcon
-            className="challengeminIcon"
-            icon={challengeIcon}
-            size={60}
-          />
+          {isLoading ? (
+            <div className="spinner-container">
+              <StyledBlackSpinner className="duel-spinner" size={46} />
+            </div>
+          ) : (
+            <>
+              {t('challenge.card.ongoing.duel')}
+              <StyledIcon
+                className="challengeminIcon"
+                icon={challengeIcon}
+                size={60}
+              />
+            </>
+          )}
         </button>
       ) : userChallenge.duel.state === UserDuelState.ONGOING && !isDone ? (
         <div className={'smallCard duelCard active'} onClick={goDuel}>
diff --git a/src/components/Challenge/challengeCardOnGoing.scss b/src/components/Challenge/challengeCardOnGoing.scss
index 4935315691aaa69440da2fef6ed235e05cdc8155..3ed1d006de2e7aab600f531d30169f32c1b5291f 100644
--- a/src/components/Challenge/challengeCardOnGoing.scss
+++ b/src/components/Challenge/challengeCardOnGoing.scss
@@ -67,6 +67,11 @@
       margin-bottom: 0.3em;
     }
   }
+  .spinner-container {
+    height: 3.75rem;
+    width: 3.75rem;
+    margin: auto;
+  }
   .cardIcon {
     margin-right: 0.6rem;
   }
diff --git a/src/services/duel.service.spec.ts b/src/services/duel.service.spec.ts
index a174506a2463e8925f865f6ea50f3a3029e86326..c3ec5a642ce960562f172cc9f407166baf0d9cc2 100644
--- a/src/services/duel.service.spec.ts
+++ b/src/services/duel.service.spec.ts
@@ -153,6 +153,7 @@ describe('Duel service', () => {
       )
       const mockUpdatedDuel: UserDuel = {
         ...duelData,
+        state: UserDuelState.UNLOCKED,
         threshold: 55,
         fluidTypes: [FluidType.ELECTRICITY, FluidType.WATER, FluidType.GAS],
       }
diff --git a/src/services/duel.service.ts b/src/services/duel.service.ts
index 7a79cbca64bdf827e7aeb6f2e9258992e7098f8b..7360017e6d981f4963cb880e0515a338f943c640 100644
--- a/src/services/duel.service.ts
+++ b/src/services/duel.service.ts
@@ -215,7 +215,7 @@ export default class DuelService {
       }
       const updatedUserDuel: UserDuel = {
         ...userDuel,
-        state: userDuel.state,
+        state: UserDuelState.UNLOCKED,
         threshold: updatedThreshold,
         fluidTypes: fluidTypes,
       }
diff --git a/src/services/performanceIndicator.service.spec.ts b/src/services/performanceIndicator.service.spec.ts
index ab249310fd5f95b65847ecbac1318d72020057a1..71a0e0b0dc78dcf08445d1d828f473d10ae3caf6 100644
--- a/src/services/performanceIndicator.service.spec.ts
+++ b/src/services/performanceIndicator.service.spec.ts
@@ -75,9 +75,9 @@ describe('performanceIndicator service', () => {
         },
       ]
       expectedResult = {
-        value: 0,
         compareValue: 6.5084,
-        percentageVariation: 1,
+        percentageVariation: 0.5544988015487677,
+        value: 2.8994999999999997,
       }
       result = performanceIndicatorService.aggregatePerformanceIndicators(
         performanceIndicator
diff --git a/src/services/performanceIndicator.service.ts b/src/services/performanceIndicator.service.ts
index 8a2369cbce1a695cc35973862eb2228280bba2f2..59a0143c3b5eeac2605b7852f5ee008044662f9c 100644
--- a/src/services/performanceIndicator.service.ts
+++ b/src/services/performanceIndicator.service.ts
@@ -13,20 +13,12 @@ export default class PerformanceIndicatorService {
       performanceIndicators[1] &&
       performanceIndicators[2]
     ) {
-      if (
-        !performanceIndicators[0].value ||
-        !performanceIndicators[1].value ||
-        !performanceIndicators[2].value
-      ) {
-        currentValue = 0
-      } else {
-        for (const key in performanceIndicators) {
-          const performanceIndicator = performanceIndicators[key]
-          const fluidType = parseInt(key)
-          currentValue += performanceIndicator.value
-            ? converterService.LoadToEuro(performanceIndicator.value, fluidType)
-            : 0
-        }
+      for (const key in performanceIndicators) {
+        const performanceIndicator = performanceIndicators[key]
+        const fluidType = parseInt(key)
+        currentValue += performanceIndicator.value
+          ? converterService.LoadToEuro(performanceIndicator.value, fluidType)
+          : 0
       }
       if (
         !performanceIndicators[0].compareValue ||