From 82334aca0116f5f1f727b75ca049ffddc71089f7 Mon Sep 17 00:00:00 2001 From: Jerel Miller Date: Wed, 14 Oct 2020 13:45:57 -0700 Subject: [PATCH] chore: handle pure tutorial steps --- src/components/Tutorial.js | 29 +++++++++++++++++++++-------- 1 file changed, 21 insertions(+), 8 deletions(-) diff --git a/src/components/Tutorial.js b/src/components/Tutorial.js index 6d835907c..e3c2fc41d 100644 --- a/src/components/Tutorial.js +++ b/src/components/Tutorial.js @@ -13,6 +13,9 @@ const Tutorial = ({ children }) => { validateChildren(children); }); + const isSectioned = children.some((child) => + isMdxType(child, 'TutorialSection') + ); const projectElement = isMdxType(children[0], 'Project') ? children[0] : null; if (projectElement) { @@ -23,13 +26,27 @@ const Tutorial = ({ children }) => { ? parseProjectStateFromConfig(projectElement) : parseProjectStateFromChildren(children); + if (isSectioned) { + return gatherSections(children, initialProjectState); + } + + const { steps } = gatherSteps(children, initialProjectState); + + return steps; +}; + +Tutorial.propTypes = { + children: PropTypes.node, +}; + +const gatherSections = (children, initialProjectState) => { const { elements } = children.reduce( (memo, child) => { const { elements, currentProjectState } = memo; if (isMdxType(child, 'TutorialSection')) { const { steps, currentProjectState: projectState } = gatherSteps( - child, + child.props.children, currentProjectState ); @@ -47,13 +64,9 @@ const Tutorial = ({ children }) => { return elements; }; -Tutorial.propTypes = { - children: PropTypes.node, -}; - -const gatherSteps = (parentElement, initialProjectState) => { - return Children.toArray(parentElement.props.children).reduce( - ({ steps, currentProjectState }, stepElement, idx, children) => { +const gatherSteps = (children, initialProjectState) => { + return Children.toArray(children).reduce( + ({ steps, currentProjectState }, stepElement, idx) => { const sharedProps = { stepNumber: idx + 1, totalSteps: children.length }; const codeBlock = Children.toArray(stepElement.props.children).find( (child) => isCodeBlock(child) && !isShellCommand(child)