Skip to content

Commit f53cffb

Browse files
jomcarvajaljomcarvajal
committed
hide footer with new condition
1 parent 5e6976b commit f53cffb

9 files changed

+33
-249
lines changed

‎src/components/Card.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ export const InnerStepCard = styled.div`
1010
flex-direction: column;
1111
flex: 1 1 auto;
1212
min-height: 400px;
13-
margin: 0 auto 5rem auto;
13+
margin: 0 auto auto auto;
1414
border: 1px solid ${colors.palette.light};
1515
border-radius: 0.25rem;
1616
background-color: white;

‎src/components/Exercise/styles.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,6 @@ export const exerciseStyles = css`
1414
1515
&.preview-card {
1616
--spacing: 0.8rem;
17-
min-height: 30rem;
1817
1918
[data-task-step-id] {
2019
padding: 0;

‎src/components/ExercisePreview.tsx

Lines changed: 11 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -80,28 +80,24 @@ export const ExercisePreview = (
8080

8181
const StyledExercise = styled(Exercise)`
8282
83-
.step-card-footer-inner {
84-
border-top: none;
85-
}
86-
8783
${(!showAllFeedback) &&
8884
`.step-card-footer {
89-
display: none;
90-
}`
85+
display: none;
86+
}`
9187
}
9288
${!showCorrectAnswer &&
9389
`.answer-answer {
94-
font-weight: normal;
95-
& > div {
96-
display: none;
97-
}
90+
font-weight: normal;
91+
& > div {
92+
display: none;
9893
}
94+
}
9995
100-
.answer-letter-wrapper::before {
101-
color: ${colors.palette.neutralThin} !important;
102-
border-color: #c6c6c6 !important;
103-
background: ${colors.palette.white} !important;
104-
}`
96+
.answer-letter-wrapper::before {
97+
color: ${colors.palette.neutralThin} !important;
98+
border-color: #c6c6c6 !important;
99+
background: ${colors.palette.white} !important;
100+
}`
105101
}
106102
`;
107103

‎src/components/ExerciseQuestion.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -134,6 +134,7 @@ export const ExerciseQuestion = React.forwardRef((props: ExerciseQuestionProps,
134134
>
135135
<FreeResponseReview free_response={free_response} />
136136
</Question>
137+
{(previewMode && detailedSolution ) || !previewMode?
137138
<StepCardFooter className="step-card-footer">
138139
<div className="step-card-footer-inner">
139140
<div className="points" role="status">
@@ -163,7 +164,7 @@ export const ExerciseQuestion = React.forwardRef((props: ExerciseQuestionProps,
163164
<NextButton onClick={() => onNextStep(questionNumber - 1)} canUpdateCurrentStep={canUpdateCurrentStep} />}
164165
</div>
165166
</div>
166-
</StepCardFooter>
167+
</StepCardFooter> : null}
167168
</div>
168169
);
169170
})

‎src/components/Print.stories.tsx

Lines changed: 0 additions & 101 deletions
Original file line numberDiff line numberDiff line change
@@ -1,101 +0,0 @@
1-
import { ExerciseData, ExerciseQueryData, ExerciseQuestionData, StepBase } from '../../src/types';
2-
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
3-
// @ts-ignore
4-
import data from '../../exercises.json';
5-
import styled from 'styled-components';
6-
import { Exercise } from './Exercise';
7-
8-
const ExerciseWrapper = styled.div`
9-
break-inside: avoid;
10-
11-
.step-card-body {
12-
padding: 24px 48px !important;
13-
}
14-
15-
.step-card-footer {
16-
display: none;
17-
}
18-
19-
.exercise-id {
20-
height: auto;
21-
}
22-
23-
.exercise-step {
24-
min-height: auto;
25-
}
26-
27-
.question-feedback {
28-
box-shadow: none !important;
29-
}
30-
31-
.openstax-answer {
32-
break-inside: avoid;
33-
34-
.answer-letter-wrapper::after {
35-
content: '' !important;
36-
}
37-
}
38-
`;
39-
40-
const exercises = (data as ExerciseQueryData).exercises as ExerciseData[];
41-
42-
const firstQuestionNumByExercise = exercises.reduce((acc, ex) => ({
43-
...acc,
44-
[ex.uuid]: acc.questionCounter + 1,
45-
questionCounter: acc.questionCounter + ex.questions.length
46-
}), {questionCounter: 0});
47-
48-
// placeholder until exercise data contains correct answer IDs
49-
const formatAnswerData = (questions: ExerciseQuestionData[]) => questions.map((q) => (
50-
{id: q.id, correct_answer_id: (q.answers.find((a) => a.correctness === '1.0')?.id || '')}));
51-
52-
const questionStateFields = {
53-
available_points: '1.0',
54-
is_completed: true,
55-
answer_id: '1',
56-
free_response: '',
57-
feedback_html: '',
58-
correct_answer_feedback_html: '',
59-
attempts_remaining: 0,
60-
attempt_number: 1,
61-
incorrectAnswerId: 0
62-
}
63-
64-
export const Default = () => (
65-
<>
66-
{data.title && <h2>Exercises for {data.title}</h2>}
67-
{exercises.map(((exercise) => {
68-
69-
const step: StepBase = {
70-
id: 1,
71-
uid: exercise.uid,
72-
available_points: '1.0',
73-
};
74-
75-
const questionStates = formatAnswerData(exercise.questions).reduce((acc, answer) => {
76-
const {id, correct_answer_id} = answer;
77-
return {...acc, [id]: {...questionStateFields, correct_answer_id}};
78-
}, {});
79-
80-
return (
81-
<ExerciseWrapper key={exercise.uid}>
82-
<Exercise
83-
key={exercise.uid}
84-
canAnswer={true}
85-
needsSaved={true}
86-
hasMultipleAttempts={false}
87-
onAnswerChange={() => undefined}
88-
onAnswerSave={() => undefined}
89-
onNextStep={() => undefined}
90-
apiIsPending={false}
91-
canUpdateCurrentStep={false}
92-
exercise={exercise}
93-
step={step}
94-
questionNumber={firstQuestionNumByExercise[exercise.uuid]}
95-
numberOfQuestions={exercises.length}
96-
questionStates={questionStates}
97-
show_all_feedback={true} />
98-
</ExerciseWrapper>
99-
)
100-
}))}
101-
</>);

‎src/components/__snapshots__/Card.spec.tsx.snap

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ exports[`StepCard matches snapshot 1`] = `
55
className="sc-gsnTZi dxdISE"
66
>
77
<div
8-
className="sc-bczRLJ eAXREJ"
8+
className="sc-bczRLJ LfjAZ"
99
>
1010
<div>
1111
<div
@@ -58,7 +58,7 @@ exports[`StepCard matches snapshot with more than one question 1`] = `
5858
className="sc-gsnTZi dxdISE"
5959
>
6060
<div
61-
className="sc-bczRLJ eAXREJ"
61+
className="sc-bczRLJ LfjAZ"
6262
>
6363
<div>
6464
<div
@@ -118,7 +118,7 @@ exports[`TaskStepCard can optionally provide task 1`] = `
118118
data-task-step-id={1}
119119
>
120120
<div
121-
className="sc-bczRLJ eAXREJ exercise-step"
121+
className="sc-bczRLJ LfjAZ exercise-step"
122122
>
123123
<div>
124124
<div
@@ -163,7 +163,7 @@ exports[`TaskStepCard can optionally provide type 1`] = `
163163
data-task-step-id={1}
164164
>
165165
<div
166-
className="sc-bczRLJ eAXREJ exercise-step"
166+
className="sc-bczRLJ LfjAZ exercise-step"
167167
>
168168
<div>
169169
<div
@@ -208,7 +208,7 @@ exports[`TaskStepCard matches snapshot 1`] = `
208208
data-task-step-id={1}
209209
>
210210
<div
211-
className="sc-bczRLJ eAXREJ exercise-step"
211+
className="sc-bczRLJ LfjAZ exercise-step"
212212
>
213213
<div>
214214
<div

‎src/components/__snapshots__/CompletionStatus.spec.tsx.snap

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22

33
exports[`CompletionStatus matches snapshot 1`] = `
44
<div
5-
className="sc-bczRLJ sc-gKXOVf eAXREJ hSbqXj sc-ftvSup"
5+
className="sc-bczRLJ sc-gKXOVf LfjAZ hSbqXj sc-ftvSup"
66
>
77
<h2
88
className="sc-iBkjds jcQjIn"
@@ -24,7 +24,7 @@ exports[`CompletionStatus matches snapshot 1`] = `
2424

2525
exports[`CompletionStatus matches snapshot with all questions completed 1`] = `
2626
<div
27-
className="sc-bczRLJ sc-gKXOVf eAXREJ hSbqXj sc-ftvSup"
27+
className="sc-bczRLJ sc-gKXOVf LfjAZ hSbqXj sc-ftvSup"
2828
>
2929
<h2
3030
className="sc-iBkjds jcQjIn"
@@ -46,7 +46,7 @@ exports[`CompletionStatus matches snapshot with all questions completed 1`] = `
4646

4747
exports[`CompletionStatus matches snapshot with some questions completed 1`] = `
4848
<div
49-
className="sc-bczRLJ sc-gKXOVf eAXREJ hSbqXj sc-ftvSup"
49+
className="sc-bczRLJ sc-gKXOVf LfjAZ hSbqXj sc-ftvSup"
5050
>
5151
<h2
5252
className="sc-iBkjds jcQjIn"

‎src/components/__snapshots__/Exercise.spec.tsx.snap

Lines changed: 7 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ exports[`Exercise using step data matches snapshot 1`] = `
99
data-task-step-id={1}
1010
>
1111
<div
12-
className="sc-bczRLJ eAXREJ exercise-step sc-breuTD dSaRVj sc-hAZoDl fZGyZE"
12+
className="sc-bczRLJ LfjAZ exercise-step sc-breuTD dSaRVj sc-hAZoDl QazMO"
1313
>
1414
<div>
1515
<div
@@ -206,7 +206,7 @@ exports[`Exercise with overlay rendering matches snapshot 1`] = `
206206
data-task-step-id={1}
207207
>
208208
<div
209-
className="sc-bczRLJ eAXREJ exercise-step sc-breuTD dSaRVj sc-hAZoDl fZGyZE"
209+
className="sc-bczRLJ LfjAZ exercise-step sc-breuTD dSaRVj sc-hAZoDl QazMO"
210210
>
211211
<div
212212
onBlur={[Function]}
@@ -408,7 +408,7 @@ exports[`Exercise with overlay rendering matches snapshot with previewMode 1`] =
408408
data-task-step-id={1}
409409
>
410410
<div
411-
className="sc-bczRLJ eAXREJ exercise-step sc-breuTD dSaRVj sc-hAZoDl fZGyZE"
411+
className="sc-bczRLJ LfjAZ exercise-step sc-breuTD dSaRVj sc-hAZoDl QazMO"
412412
>
413413
<div
414414
onBlur={[Function]}
@@ -562,33 +562,6 @@ exports[`Exercise with overlay rendering matches snapshot with previewMode 1`] =
562562
</div>
563563
</div>
564564
</div>
565-
<div
566-
className="sc-ftvSup fUvOut step-card-footer"
567-
>
568-
<div
569-
className="step-card-footer-inner"
570-
>
571-
<div
572-
className="points"
573-
role="status"
574-
>
575-
<span
576-
className="attempts-left"
577-
/>
578-
</div>
579-
<div
580-
className="controls"
581-
>
582-
<button
583-
className="sc-jSMfEi hsxEPT"
584-
data-test-id="continue-btn"
585-
onClick={[Function]}
586-
>
587-
Next
588-
</button>
589-
</div>
590-
</div>
591-
</div>
592565
</div>
593566
</div>
594567
</div>
@@ -608,7 +581,7 @@ exports[`Exercise with question state data matches snapshot 1`] = `
608581
data-task-step-id={1}
609582
>
610583
<div
611-
className="sc-bczRLJ eAXREJ exercise-step sc-breuTD dSaRVj sc-hAZoDl fZGyZE"
584+
className="sc-bczRLJ LfjAZ exercise-step sc-breuTD dSaRVj sc-hAZoDl QazMO"
612585
>
613586
<div>
614587
<div
@@ -853,7 +826,7 @@ exports[`Exercise with question state data renders header icons with multiple ch
853826
data-task-step-id={1}
854827
>
855828
<div
856-
className="sc-bczRLJ eAXREJ exercise-step sc-breuTD dSaRVj sc-hAZoDl fZGyZE"
829+
className="sc-bczRLJ LfjAZ exercise-step sc-breuTD dSaRVj sc-hAZoDl QazMO"
857830
>
858831
<div>
859832
<div
@@ -1184,7 +1157,7 @@ exports[`Exercise with question state data renders header icons with two-step ex
11841157
data-task-step-id={1}
11851158
>
11861159
<div
1187-
className="sc-bczRLJ eAXREJ exercise-step sc-breuTD dSaRVj sc-hAZoDl fZGyZE"
1160+
className="sc-bczRLJ LfjAZ exercise-step sc-breuTD dSaRVj sc-hAZoDl QazMO"
11881161
>
11891162
<div>
11901163
<div
@@ -1501,7 +1474,7 @@ exports[`Exercise with question state data shows a detailed solution 1`] = `
15011474
data-task-step-id={1}
15021475
>
15031476
<div
1504-
className="sc-bczRLJ eAXREJ exercise-step sc-breuTD dSaRVj sc-hAZoDl fZGyZE"
1477+
className="sc-bczRLJ LfjAZ exercise-step sc-breuTD dSaRVj sc-hAZoDl QazMO"
15051478
>
15061479
<div>
15071480
<div

0 commit comments

Comments
 (0)