display all review level/steps

ShMcK · ShMcK · commit 261d4a320f37 · 2020-07-11T21:00:52.000-07:00
Signed-off-by: shmck &lt;shawn.j.mckay@gmail.com&gt;
diff --git a/web-app/src/containers/Tutorial/components/Step.tsx b/web-app/src/containers/Tutorial/components/Step.tsx
@@ -8,6 +8,7 @@ interface Props {
   content: string
   status: T.ProgressStatus
   subtasks: { name: string; pass: boolean }[] | null
+  displayAll: boolean
 }
 
 const styles = {
@@ -40,7 +41,7 @@ const styles = {
 }
 
 const Step = (props: Props) => {
-  const showStep = props.status !== 'INCOMPLETE'
+  const showStep = props.displayAll || props.status !== 'INCOMPLETE'
   if (!showStep) {
     return null
   }
diff --git a/web-app/src/containers/Tutorial/components/Steps.tsx b/web-app/src/containers/Tutorial/components/Steps.tsx
@@ -6,6 +6,7 @@ import Hints from './Hints'
 
 interface Props {
   steps: TT.Step[]
+  displayAll: boolean
 }
 
 const styles = {
@@ -27,7 +28,13 @@ const Steps = (props: Props) => {
         }
         return (
           <div key={step.id}>
-            <Step key={step.id} status={step.status || 'INCOMPLETE'} content={step.content} subtasks={step.subtasks} />
+            <Step
+              key={step.id}
+              status={step.status || 'INCOMPLETE'}
+              displayAll={props.displayAll}
+              content={step.content}
+              subtasks={step.subtasks}
+            />
             <Hints hints={step.hints || []} />
           </div>
         )
diff --git a/web-app/src/containers/Tutorial/components/TestStatusIcon.tsx b/web-app/src/containers/Tutorial/components/TestStatusIcon.tsx
@@ -19,12 +19,16 @@ const styles = {
     icon: 'warning',
     color: '#ff9300',
   },
+  incomplete: {
+    icon: 'lock',
+    color: 'lightgrey',
+  },
 }
 
 const TestStatusIcon = (props: Props) => {
   // @ts-ignore
   const style: { icon: string; color: string } = styles[props.status.toLowerCase()]
-  return <Icon type="success-filling" size={props.size} style={{ color: style.color }} />
+  return <Icon type={style.icon} size={props.size} style={{ color: style.color }} />
 }
 
 export default TestStatusIcon
diff --git a/web-app/src/containers/Tutorial/containers/Review.tsx b/web-app/src/containers/Tutorial/containers/Review.tsx
@@ -35,7 +35,7 @@ const ReviewPage = (props: Props) => {
         <div key={level.id}>
           <div>
             <Content title={level.title} content={level.content} />
-            <Steps steps={level.steps} />
+            <Steps steps={level.steps} displayAll />
           </div>
           {/* divider */}
           {index < props.levels.length - 1 ? <hr /> : null}

Original file line number	Diff line number	Diff line change
`@@ -8,6 +8,7 @@ interface Props {`
`8`	`8`	`content: string`
`9`	`9`	`status: T.ProgressStatus`
`10`	`10`	`subtasks: { name: string; pass: boolean }[] \| null`
	`11`	`+ displayAll: boolean`
`11`	`12`	`}`
`12`	`13`
`13`	`14`	`const styles = {`
`@@ -40,7 +41,7 @@ const styles = {`
`40`	`41`	`}`
`41`	`42`
`42`	`43`	`const Step = (props: Props) => {`
`43`		`- const showStep = props.status !== 'INCOMPLETE'`
	`44`	`+ const showStep = props.displayAll \|\| props.status !== 'INCOMPLETE'`
`44`	`45`	`if (!showStep) {`
`45`	`46`	`return null`
`46`	`47`	`}`