From 0e9560b455197a134288c088ea39711e6c4b8133 Mon Sep 17 00:00:00 2001
From: Sem Bauke <46919888+Sembauke@users.noreply.github.com>
Date: Tue, 9 Feb 2021 18:18:05 +0100
Subject: [PATCH] fix(client): display challenge completion status inline
 (#41006)

---
 .../Challenges/components/Challenge-Title.js  |  10 +-
 .../__snapshots__/ChallengeTitle.test.js.snap | 116 +++++++++---------
 2 files changed, 63 insertions(+), 63 deletions(-)

diff --git a/client/src/templates/Challenges/components/Challenge-Title.js b/client/src/templates/Challenges/components/Challenge-Title.js
index c6fb4b0b9f..ca0c71fe5c 100644
--- a/client/src/templates/Challenges/components/Challenge-Title.js
+++ b/client/src/templates/Challenges/components/Challenge-Title.js
@@ -39,12 +39,12 @@ function ChallengeTitle({ block, children, isCompleted, superBlock }) {
       </div>
       <div className='challenge-title'>
         <b>{children}</b>
+        {isCompleted ? (
+          <GreenPass
+            style={{ height: '15px', width: '15px', marginLeft: '7px' }}
+          />
+        ) : null}
       </div>
-      {isCompleted ? (
-        <GreenPass
-          style={{ height: '15px', width: '15px', marginLeft: '7px' }}
-        />
-      ) : null}
     </div>
   );
 }
diff --git a/client/src/templates/Challenges/components/__snapshots__/ChallengeTitle.test.js.snap b/client/src/templates/Challenges/components/__snapshots__/ChallengeTitle.test.js.snap
index 5930286dc4..734ff5f7de 100644
--- a/client/src/templates/Challenges/components/__snapshots__/ChallengeTitle.test.js.snap
+++ b/client/src/templates/Challenges/components/__snapshots__/ChallengeTitle.test.js.snap
@@ -34,64 +34,64 @@ exports[`<ChallengeTitle/> renders correctly 1`] = `
     <b>
       title text
     </b>
-  </div>
-  <span
-    className="sr-only"
-  >
-    icons.passed
-  </span>
-  <svg
-    height="50"
-    style={
-      Object {
-        "height": "15px",
-        "marginLeft": "7px",
-        "width": "15px",
+    <span
+      className="sr-only"
+    >
+      icons.passed
+    </span>
+    <svg
+      height="50"
+      style={
+        Object {
+          "height": "15px",
+          "marginLeft": "7px",
+          "width": "15px",
+        }
       }
-    }
-    viewBox="0 0 200 200"
-    width="50"
-    xmlns="http://www.w3.org/2000/svg"
-  >
-    <g>
-      <title>
-        icons.passed
-      </title>
-      <circle
-        cx="100"
-        cy="99"
-        fill="var(--primary-color)"
-        r="95"
-        stroke="var(--primary-color)"
-        strokeDasharray="null"
-        strokeLinecap="null"
-        strokeLinejoin="null"
-      />
-      <rect
-        fill="var(--primary-background)"
-        height="30"
-        stroke="var(--primary-background)"
-        strokeDasharray="null"
-        strokeLinecap="null"
-        strokeLinejoin="null"
-        transform="rotate(-45, 120, 106.321)"
-        width="128.85878"
-        x="55.57059"
-        y="91.32089"
-      />
-      <rect
-        fill="var(--primary-background)"
-        height="30"
-        stroke="var(--primary-background)"
-        strokeDasharray="null"
-        strokeLinecap="null"
-        strokeLinejoin="null"
-        transform="rotate(45, 66.75, 123.75)"
-        width="80.66548"
-        x="26.41726"
-        y="108.75"
-      />
-    </g>
-  </svg>
+      viewBox="0 0 200 200"
+      width="50"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g>
+        <title>
+          icons.passed
+        </title>
+        <circle
+          cx="100"
+          cy="99"
+          fill="var(--primary-color)"
+          r="95"
+          stroke="var(--primary-color)"
+          strokeDasharray="null"
+          strokeLinecap="null"
+          strokeLinejoin="null"
+        />
+        <rect
+          fill="var(--primary-background)"
+          height="30"
+          stroke="var(--primary-background)"
+          strokeDasharray="null"
+          strokeLinecap="null"
+          strokeLinejoin="null"
+          transform="rotate(-45, 120, 106.321)"
+          width="128.85878"
+          x="55.57059"
+          y="91.32089"
+        />
+        <rect
+          fill="var(--primary-background)"
+          height="30"
+          stroke="var(--primary-background)"
+          strokeDasharray="null"
+          strokeLinecap="null"
+          strokeLinejoin="null"
+          transform="rotate(45, 66.75, 123.75)"
+          width="80.66548"
+          x="26.41726"
+          y="108.75"
+        />
+      </g>
+    </svg>
+  </div>
 </div>
 `;