Create submission portal landing page

[emileyfadrosh]

An improved landing page for the Submission Portal is needed to help orient users and provide links to the quick start guide, tutorials, and reference materials. A mock up of the landing page is here and also a screenshot below. The following links would need to be included:

1. Quickstart: https://nmdc-documentation.readthedocs.io/en/latest/howto_guides/submit2nmdc.html
2. Tutorial: https://nmdc-documentation.readthedocs.io/en/latest/tutorials/submission_portal.html
3. Reference: https://nmdc-documentation.readthedocs.io/en/latest/reference/metadata/combined_schema_docs.html

FYI @mslarae13 @jkelliher-github @shreddd @ssarrafan

[eecavanna]

Someone said, during the infrastructure meeting, that this landing page content was proposed so that the web page isn't "blank" when someone has no submissions. That leads me to wonder whether people want this landing page content to only appear in that situation (i.e. only appear if the user has no submissions), or to always be visible (regardless of how many submissions the user has).

[ssarrafan]

Someone said, during the infrastructure meeting, that this landing page content was proposed so that the web page isn't "blank" when someone has no submissions. That leads me to wonder whether people want this landing page content to only appear in that situation (i.e. only appear if the user has no submissions), or to always be visible (regardless of how many submissions the user has).

Good question @eecavanna. What are your thoughts @emileyfadrosh @mslarae13?

[emileyfadrosh]

Here are my suggestions: Have the full landing page for new users, but also have a modified banner with the same help links for users who log in and have a submission in the works. Hope this makes sense!

BEFORE AFTER

And for users who have a new submission, there would be a modified guidance to still retain this information but not have a full page: BEFORE AFTER

[eecavanna]

This comment will contain my notes about implementing this landing page (I'll update the comment as I work on the feature).

Notes

• Path to source file: web/src/views/SubmissionPortal/Components/SubmissionList.vue
• The project uses: "vuetify": "^2.6.1", (Vuetify docs)

[eecavanna]

Hi @emileyfadrosh, the Google Doc mockup contains a a hero image and three icon images.

Regarding the hero image: ~Do you know where I might be able to get that image in either (a) SVG or (b) PNG format (in a large size)?~

I was able to get it in PNG format by clicking "Save to Keep" in Google Docs, and then right-clicking the image and downloading it as a PNG; but the resulting PNG was small and distorted.

Regarding the three icons: ~Do you know where I might be able to get those images in SVG format? That would allow me to display them at any size without a loss in clarity.~

I was able to get those three icons in PNG format by downloading the Google Doc in HTML format to my laptop, which included those three icons in PNG format.

If this were a voice conversation, I'd ask: Where'd these images come from?

---

Update: @emileyfadrosh sent me the following assets via Slack:

[eecavanna]

Status update: A skeleton of the landing page exists in my local environment. Now, it's a matter of adding images and then adjusting the styles/formatting—which I'll do on Friday.

[eecavanna]

Update: In my local development environment, here's the page that a logged-out user would see.

Note: I redesigned the login prompt.

[eecavanna]

Update: In my local development environment, here's the page that a logged-in user would see if they have some submissions. Note: The web browser window is slightly wider than in the screenshot above—that's why there's more margin around the banner here.

[eecavanna]

Update: In my local development environment, here's the page that a logged-in user would see if they do not have any submissions. This page includes the same elements as in the previous screenshot, plus the paragraphs of text.

[emileyfadrosh]

This is looking FANTASTIC!!

[eecavanna]

During last Friday's hackathon, the people in the documentation-focused breakout room agreed ("decided") to stop maintaining the copy of the schema documentation (i.e. this copy) that exists on the main NMDC documentation site, and instead have the site "link out" to the standalone schema documentation site (i.e. this site).

The main NMDC documentation site has been updated accordingly (this is shown in the screenshot below): now, the sidebar link that used to point to the copy of the schema documentation embedded into the main NMDC documentation site, points to the standalone schema documentation site (technically, it links to a w3id URL, which redirects to the latter).

@shreddd and I are writing this ADR (still in a draft state) about that "decision": https://github.com/microbiomedata/issues/blob/0010-doc-building/decisions/0010-documentation-setup.md

@emileyfadrosh, given the above "decision," are you OK with me having the "Reference" icon on this landing page link to the standalone schema documentation site (i.e. this site) instead of to the copy of the schema documentation (i.e. this copy) that exists on the main NMDC documentation site? If so, I would link it to that same w3id URL as I referred to above.

[ssarrafan]

Since this issue is about the landing page (and not specifically the docs), can this issue be closed? @eecavanna @emileyfadrosh

[eecavanna]

Hi @ssarrafan, my plan is to make the 1 change naglepuff suggested today (regarding the spelling of "ORCiD" versus "ORCID"), then re-request a review from him and marySalvi, then merge it in once they approve it. I'm waiting to close this issue until that merge happens.

[shreddd]

Thanks - for the logged-out user page, can we make it more obvious that folks need to login to create a submission? Some possibilities (any combination of these based on your judgement)

• Use with some bigger/bloder text to draw attention to login
• Use an icon in the gray section that prompts the user to login to create submission.
• Replace Gray with a different color or add a border

[eecavanna]

Thanks for sharing that feedback, @shreddd. I have created a new issue for it (at: https://github.com/microbiomedata/nmdc-server/issues/1187) and will close this one.