Dashboard Page: Update with Sorted Table, Add Empty States to Table

[zhuje]

Related to issue(s)

#96

Overview:

This is a PR that addresses only the Submissions page.

• 1. Convert the current Dashboard Page from using Cards [1] to using the PatternFly Sortable Responsive Table [2]
• 2. Add Empty States to the Table (Loading, and Unable to connect). 'No Results' page is not in this PR because the Filters were not included.

Before:

Figure 1. Dashboard Page with mocked response. Rows are displayed using Card components.

After

Figure 2. Display data using PatternFly Sortable Responsive Table
Figure 3. Table Data: Error
Figure 4. Table Data: Loading

[vishnoianil]

@zhuje If you are still having issue for github authentication setup, please ping me on slack, and i am happy to debug it with you.

Also please fix the UI lint (run npm run lint:fix locally) and signoff the commits, so the DCO jobs will pass.

Once you login with the github, you will see that we have the empty state. Pushed through the following PR#176. Please review the existing empty state page and see if there are any gaps that needs to be address.

Progress on 1) looks great to me. Thanks for the mockups. @Misjohns Please review the mockups and share your thoughts.

[Misjohns]

Thank you @zhuje looking good. We probably could use PF status icons for status but we don't need anything for created and updated.

[zhuje]

@Misjohns I left the icons in there by accident, those where from the Patternfly template for responsive tables. I'll remove the icons from the created and updated columns.

I might leave out the attribute search/text filtering in this iteration of the Table. It's adding a bit of complexity that is growing the PR.

We can add the attribute search/text filtering as a separate feature in the future if you still want to proceed with that. WDYT?

Sorry, about the slowed progress, I have some other priorities that took my attention. I'm still continuing with the work on this PR.

[Misjohns]

Agree, we can add the search at a later time.