Create reusable template parts

[charliepnnl]

We seem to be using the same content for parts of each workflow template. Namely, the Project tab and the beginning of the Report tab. One of the beauties of MDX it produces a React component. So we should be able to create reusable parts of templates.

These template parts should live in reusable folder inside the templates folder. Say we create a template part in _templates/reusable/project_infoinputs.mdx called that includes the mdx for the Project tab. Then in _components/mdxwrapper.tsx we add the line import ProjectInfoInputs from "../templates/reusable/project_info_inputs.mdx and add ProjectInfoInputs to the components object. Then we can use <ProjectInfoInputs /> in the Project tab of our workflow templates.

[sudhacheran]

Charile, I have tried implementing as you have detailed. ProjectInfoInputs importing this way is imported as JSX element. The component inside ProjectInfoInputs such as 'StringInput' is not getting initialized. So app is throwing error saying 'StringInput' not found. It works fine when no components are included in the project_info_inputs.mdx file.

[charliepnnl]

@sudhacheran Try using <ProjectInfoInputs {...props} />. The {...props} sends all the properties on to ProjectInfoInputs; that should include components.

[sudhacheran]

Committed the changes to the branch "119-create-reusable-template-parts".