irida icon indicating copy to clipboard operation
irida copied to clipboard

Update Metadata Import Wizard to use react-router-dom Outlet

Open joshsadam opened this issue 2 years ago • 0 comments

What needs changed?

Currently SampleMetadataImportWizard is wrapped around each route in the sample metadata import.  This causes the page header and the steps to be re-rendered each time the child component needs to be re-rendered.  What needs to happen is that a layout component needs to be created to handle this and instead of wrapping each route, use react-router-dom's component Outlet.  The router in src/main/webapp/resources/js/pages/projects/samples-metadata-import/index.js will need to be re-written to look something like this:

BrowserRouter
  Routes
  	Route element=layout
  		Route element=SampleMetadataImportSelectFile
  		...
  	/Route
  /Routes
/BrouserRouter

Additional information

A good example can be seen from the react-router-dom documentation: https://reactrouter.com/en/main/components/outlet and their example repo: https://github.com/remix-run/react-router/blob/dev/examples/basic/src/App.tsx

joshsadam avatar Jan 26 '23 21:01 joshsadam