Add saved templates to the home page

[zdeveloper]

In this story, display the created templates in the home page, when a template exists in localstorage under the templates key, otherwise keep the empty state

Acceptance Criteria

• The landing page should be hosted in the / route
• The page should show the list of saved template
• only display template name and template description
• ignore the row select box on the left
• clicking on + New Template button should route to /new-template/upload
• clicking on Run data extraction button should route to /extract/upload
• the left side nav bar links will not be functional for this story, but the annotate and extract should be selected.
• follow the attached design, use uswds components without customization as much as possible

Additional context Figma https://www.figma.com/design/1FW8ZSDV90q2wpRPOADE9r/MDE?node-id=635-5091&t=QCQ3zNlX7zRZaDXY-1

[prikiser]

@zdeveloper updated with the correct page and link. Let's avoid pulling images from V1 archived and only pull from those ready for development!

Also, I'd like us to follow the mocks, as there are some alterations on USWDS. I pulled from NBS mod internal DS as well. If there are issues, please ping me, and we can pair. I was thoughtful when I did have to alter slightly.

[schreiaj]

So it's clear - this page should live at / presumably the Dashboard link would direct to somewhere else (eg /dashboard) ? This is pertinent for the "active" link in the side bar - it is marked active if the current url path matches the url for the link.

[zdeveloper]

@zdeveloper updated with the correct page and link. Let's avoid pulling images from V1 archived and only pull from those ready for development!

Also, I'd like us to follow the mocks, as there are some alterations on USWDS. I pulled from NBS mod internal DS as well. If there are issues, please ping me, and we can pair. I was thoughtful when I did have to alter slightly.

Thanks, sorry about that, I am new to Figma and I am finally realizing there is a pages section on figma,

[zdeveloper]

So it's clear - this page should live at / presumably the Dashboard link would direct to somewhere else (eg /dashboard) ? This is pertinent for the "active" link in the side bar - it is marked active if the current url path matches the url for the link.

Yes, you can go based on the URL path or based on the params like this example

[schreiaj]

Behavior check mostly for @prikiser I'm still working on the UI a bit for it but I assume the intent of the up/down arrows next to the names was to allow sorting and choosing asc/desc? If so the attached should be the correct behavior? I assumed that we'd need some indicator of what the current sort is so used underlined, is this correct or is there another decoration I should use?

[prikiser]

@schreiaj, I’m not sure why Truss hasn’t expanded to include the other USWDS table styles. In terms of behavior, there’s currently only one arrow visible at a time. Is it possible to mimic the Material Design pattern for this? In that pattern, only one arrow is shown at a time, and clicking it toggles between ascending and descending order.

This also mimics the behavior of other CDC tools.

[bora-skylight]

@schreiaj I assigned this ticket to you. let me know if you are not the one taking this on.