From a3f10ddcdf4d135b0304e440e904d4c75b0f1bf3 Mon Sep 17 00:00:00 2001
From: Albin Henriksson <albhe428@student.liu.se>
Date: Thu, 29 Apr 2021 14:18:27 +0200
Subject: [PATCH] Improve correcting instructions

---
 .../slideSettingsComponents/Instructions.tsx  |  1 +
 .../components/JudgeScoringInstructions.tsx   | 24 +++++++++----------
 client/src/pages/views/components/styled.tsx  |  7 +++++-
 3 files changed, 18 insertions(+), 14 deletions(-)

diff --git a/client/src/pages/presentationEditor/components/slideSettingsComponents/Instructions.tsx b/client/src/pages/presentationEditor/components/slideSettingsComponents/Instructions.tsx
index 48917fcc..99b4b1d8 100644
--- a/client/src/pages/presentationEditor/components/slideSettingsComponents/Instructions.tsx
+++ b/client/src/pages/presentationEditor/components/slideSettingsComponents/Instructions.tsx
@@ -54,6 +54,7 @@ const Instructions = ({ activeSlide, competitionId }: InstructionsProps) => {
       <ListItem divider>
         <Center>
           <TextField
+            multiline
             id="outlined-basic"
             defaultValue={activeSlide.questions[0].correcting_instructions}
             onChange={updateInstructionsText}
diff --git a/client/src/pages/views/components/JudgeScoringInstructions.tsx b/client/src/pages/views/components/JudgeScoringInstructions.tsx
index 97062246..86d8eaf1 100644
--- a/client/src/pages/views/components/JudgeScoringInstructions.tsx
+++ b/client/src/pages/views/components/JudgeScoringInstructions.tsx
@@ -1,26 +1,24 @@
-import { Box, Card, Typography } from '@material-ui/core'
-import axios from 'axios'
+import { Typography } from '@material-ui/core'
 import React from 'react'
-import { getPresentationCompetition } from '../../../actions/presentation'
-import { useAppDispatch, useAppSelector } from '../../../hooks'
 import { RichQuestion } from '../../../interfaces/ApiRichModels'
-import {
-  AnswerContainer,
-  JudgeScoringInstructionsContainer,
-  ScoreDisplayContainer,
-  ScoreDisplayHeader,
-  ScoreInput,
-} from './styled'
+import { JudgeScoringInstructionsContainer, ScoringInstructionsInner } from './styled'
 
 type JudgeScoringInstructionsProps = {
   question: RichQuestion
 }
 
 const JudgeScoringInstructions = ({ question }: JudgeScoringInstructionsProps) => {
+  console.log(question)
   return (
     <JudgeScoringInstructionsContainer elevation={3}>
-      <Typography variant="h4">Rättningsinstruktioner</Typography>
-      <Typography variant="body1">{question?.correcting_instructions}</Typography>
+      <ScoringInstructionsInner>
+        <Typography variant="h4">Rättningsinstruktioner</Typography>
+        <Typography variant="body1">
+          {question?.correcting_instructions !== null
+            ? question?.correcting_instructions
+            : 'Det finns inga rättningsinstruktioner för denna fråga'}
+        </Typography>
+      </ScoringInstructionsInner>
     </JudgeScoringInstructionsContainer>
   )
 }
diff --git a/client/src/pages/views/components/styled.tsx b/client/src/pages/views/components/styled.tsx
index fef186f7..a5142d0b 100644
--- a/client/src/pages/views/components/styled.tsx
+++ b/client/src/pages/views/components/styled.tsx
@@ -1,4 +1,4 @@
-import { Card, Paper, TextField } from '@material-ui/core'
+import { Paper, TextField } from '@material-ui/core'
 import styled from 'styled-components'
 
 export const SlideContainer = styled.div`
@@ -38,6 +38,11 @@ export const JudgeScoringInstructionsContainer = styled(Paper)`
   bottom: 0;
   height: 250px;
   width: 100%;
+`
+
+export const ScoringInstructionsInner = styled.div`
+  margin-left: 15px;
+  margin-right: 15px;
   display: flex;
   align-items: center;
   flex-direction: column;
-- 
GitLab