From 093065483222481e2a2c0d9b6060430e92e09c25 Mon Sep 17 00:00:00 2001
From: Marisol Pena <masopego@gmail.com>
Date: Mon, 11 Apr 2022 16:24:39 +0200
Subject: [PATCH 1/3] feat: add react markdown to radio label

---
 src/Questions/Radio/index.js | 25 +++++++++++++++++++++----
 1 file changed, 21 insertions(+), 4 deletions(-)

diff --git a/src/Questions/Radio/index.js b/src/Questions/Radio/index.js
index 22c92884..c70c729c 100644
--- a/src/Questions/Radio/index.js
+++ b/src/Questions/Radio/index.js
@@ -1,12 +1,13 @@
 import ErrorMessage from '../../Fields/Error'
 import Label from '../../Fields/Label'
 import Radio from '../../Fields/Radio'
-// import ReactMarkdown from '../../Fields/Markdown'
 /** @jsx jsx */
 /** @jsxRuntime classic */
 import { jsx } from 'theme-ui'
 
-const QuestionRadio = ({ question, useForm }) => {
+import ReactMarkdown from '../../Fields/Markdown'
+
+const QuestionRadio = ({ question, useForm, onLinkOpen }) => {
   const { register, errors } = useForm
 
   const radioButtonGenerator = (question) => {
@@ -45,11 +46,27 @@ const QuestionRadio = ({ question, useForm }) => {
       <fieldset sx={{ border: '0', m: '0', p: '0' }}>
         {question.accessibility ? (
           <legend sx={{ variant: 'forms.label' }} htmlFor={question.name}>
-            {question.label}
+            <ReactMarkdown
+              sx={{
+                alignSelf: 'center',
+                p: { m: '0px' }
+              }}
+              source={question.label}
+              onLinkOpen={onLinkOpen}
+              modalLabel={question.modalLabel}
+            />
           </legend>
         ) : (
           <Label htmlFor={question.label} key={question.label}>
-            {question.label}
+            <ReactMarkdown
+              sx={{
+                alignSelf: 'center',
+                p: { m: '0px' }
+              }}
+              source={question.label}
+              onLinkOpen={onLinkOpen}
+              modalLabel={question.modalLabel}
+            />
           </Label>
         )}
 

From d4efb820719078e7c86798c3b5e8c1495c430809 Mon Sep 17 00:00:00 2001
From: Marisol Pena <masopego@gmail.com>
Date: Tue, 12 Apr 2022 11:13:23 +0200
Subject: [PATCH 2/3] style: update radio markdown styles in an object

---
 src/Questions/Radio/index.js | 24 +++++++++++++++---------
 1 file changed, 15 insertions(+), 9 deletions(-)

diff --git a/src/Questions/Radio/index.js b/src/Questions/Radio/index.js
index c70c729c..83a0de25 100644
--- a/src/Questions/Radio/index.js
+++ b/src/Questions/Radio/index.js
@@ -8,6 +8,18 @@ import { jsx } from 'theme-ui'
 import ReactMarkdown from '../../Fields/Markdown'
 
 const QuestionRadio = ({ question, useForm, onLinkOpen }) => {
+  const styles = {
+    fieldset: {
+      border: '0',
+      m: '0',
+      p: '0'
+    },
+    markDown: {
+      alignSelf: 'center',
+      p: { m: '0px' }
+    }
+  }
+
   const { register, errors } = useForm
 
   const radioButtonGenerator = (question) => {
@@ -43,14 +55,11 @@ const QuestionRadio = ({ question, useForm, onLinkOpen }) => {
           : 'forms.radioContainer'
       }}
     >
-      <fieldset sx={{ border: '0', m: '0', p: '0' }}>
+      <fieldset sx={styles.fieldset}>
         {question.accessibility ? (
           <legend sx={{ variant: 'forms.label' }} htmlFor={question.name}>
             <ReactMarkdown
-              sx={{
-                alignSelf: 'center',
-                p: { m: '0px' }
-              }}
+              sx={styles.markDown}
               source={question.label}
               onLinkOpen={onLinkOpen}
               modalLabel={question.modalLabel}
@@ -59,10 +68,7 @@ const QuestionRadio = ({ question, useForm, onLinkOpen }) => {
         ) : (
           <Label htmlFor={question.label} key={question.label}>
             <ReactMarkdown
-              sx={{
-                alignSelf: 'center',
-                p: { m: '0px' }
-              }}
+              sx={styles.markDown}
               source={question.label}
               onLinkOpen={onLinkOpen}
               modalLabel={question.modalLabel}

From 60c666e7f158611cec8533e45e1ac8bf3b0a89e5 Mon Sep 17 00:00:00 2001
From: Marisol Pena <masopego@gmail.com>
Date: Tue, 12 Apr 2022 11:23:37 +0200
Subject: [PATCH 3/3] test: add radio markdown test

---
 src/Questions/Radio/__tests__/radio.test.js | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/src/Questions/Radio/__tests__/radio.test.js b/src/Questions/Radio/__tests__/radio.test.js
index d501fff0..30d28fdd 100644
--- a/src/Questions/Radio/__tests__/radio.test.js
+++ b/src/Questions/Radio/__tests__/radio.test.js
@@ -36,6 +36,24 @@ test('markdown is displayed', () => {
   expect(getByText('question text to display'))
 })
 
+test('handles default markdown link', () => {
+  const questionWithLink = {
+    ...question,
+    label: 'question text to display[radio link](https://www.google.es)'
+  }
+
+  const { getByRole } = render(
+    <QuestionRadio
+      question={questionWithLink}
+      useForm={{ errors: {}, register: () => {} }}
+    />
+  )
+
+  const markDownLink = getByRole('link')
+  expect(markDownLink.href).toBe('https://www.google.es/')
+  expect(markDownLink.target).toBe('_blank')
+})
+
 test('radio labels are displayed', () => {
   const { getByLabelText } = render(
     <QuestionRadio