Added description to referral question (#92)

* Added description to referral question * Added correct format on statistics page
digitalungdom-se · Mar 6, 2022 · 75e104e · 75e104e
1 parent 732f05a
commit 75e104e
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 7 deletions.
diff --git a/src/components/Survey/index.tsx b/src/components/Survey/index.tsx
@@ -9,7 +9,7 @@ import FormLabel from "react-bootstrap/FormLabel";
 import Rating from "components/Rating";
 import React from "react";
 import styled from "styled-components";
-import { useTranslation } from "react-i18next";
+import { Trans, useTranslation } from "react-i18next";
 
 const validationSchema = Yup.object().shape({
   city: Yup.string(),
@@ -238,7 +238,14 @@ const Survey = ({ survey, onSubmit, disabled }: SurveyProps) => {
                     />
                   </FormGroup>
                   <FormGroup controlId="form-city">
-                    <FormLabel>{t("How did you hear about Rays?")}</FormLabel>
+                    <FormLabel>
+                      <Trans i18nKey="How did you hear about Rays?">
+                        How did you hear about Rays?
+                        <span style={{display: "block", fontSize: "0.8rem"}}>
+                          If you heard it from someone who previously attended Rays (an xRay), please write their name!
+                        </span>
+                      </Trans>
+                    </FormLabel>
                     <FormControl
                       value={values.informant}
                       onChange={handleChange}

diff --git a/src/features/admin/Statistics.tsx b/src/features/admin/Statistics.tsx
@@ -3,7 +3,7 @@ import React from "react";
 import Spinner from "react-bootstrap/Spinner";
 import Table from "react-bootstrap/Table";
 import useAxios from "axios-hooks";
-import { useTranslation } from "react-i18next";
+import { useTranslation, Trans } from "react-i18next";
 
 interface UseStatistics {
   loading: boolean;
@@ -98,7 +98,7 @@ function useStatistics(): UseStatistics {
 
 interface StringTableProps {
   answers: string[];
-  title: string;
+  title: React.ReactNode;
 }
 
 function StringTable({ answers, title }: StringTableProps) {
@@ -198,7 +198,14 @@ function StatisticsPage(): React.ReactElement {
         answers={data.improvement}
       />
       <StringTable
-        title={t("How did you hear about Rays?")}
+        title={
+          <Trans i18nKey="How did you hear about Rays?">
+            How did you hear about Rays?
+            <span style={{display: "block", fontSize: "0.8rem"}}>
+              If you heard it from someone who previously attended Rays (an xRay), please write their name!
+            </span>
+          </Trans>
+        }
         answers={data.informant}
       />
     </div>

diff --git a/src/resources/locales/en.json b/src/resources/locales/en.json
@@ -43,7 +43,7 @@
   "You need to set a score": "You need to set a score!",
   "What are your thoughts on the application portal?": "What are your thoughts on the application portal?",
   "Improvements on application process and portal": "How can the application process and portal be improved?",
-  "How did you hear about Rays?": "How did you hear about Rays?",
+  "How did you hear about Rays?": "How did you hear about Rays?<1>If you heard it from someone who previously attended Rays (an xRay), please write their name!</1>",
   "Save answers": "Save answers",
   "Saving answers": "Saving answers...",
   "Male": "Male",

diff --git a/src/resources/locales/sv.json b/src/resources/locales/sv.json
@@ -44,7 +44,7 @@
   "You need to set a score": "Du måste betygsätta!",
   "What are your thoughts on the application portal?": "Vad tycker du om ansökningsportalen?",
   "Improvements on application process and portal": "Hur kan ansökningsprocessen och portalen förbättras?",
-  "How did you hear about Rays?": "Hur hörde du talas om Rays?",
+  "How did you hear about Rays?": "Hur hörde du talas om Rays?<1>Om du hörde det från någon som deltagit i Rays (en xRay), skriv gärna deras namn!</1>",
   "Save answers": "Spara svar",
   "Saving answers": "Sparar svar...",
   "Male": "Man",