Start new UI, add session variables for temporary API portion

[johnmhoran]

Reference: https://github.com/nexB/vulnerablecode/issues/798

Signed-off-by: John M. Horan [email protected]

[pombredanne]

Here is some comments on the current state of this PR... The goal would be to have a minimally new UI working so we can release it in verision 30.0:

On the landing page

• [x] remove template in navbar

JMH: Done -- hidden using debug setting in navbar (affects all 5 primary pages).

third-party JS

• [x] Remove https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js https://github.com/nexB/vulnerablecode/blob/441852f29a3d43b5ccf898ebdb1c405cb6e402d5/vulnerabilities/templates/vulnerability.html#L515 we cannot source JS from third-party sites. We would instead keep a Jquery under version control https://github.com/nexB/scancode.io/tree/main/scancodeio/static

JMH: Done -- downloaded and added jquery-3.6.0.js and jquery-3.6.0.min.js to vulnerablecode/vulnerablecode/static/js/ and added <script type="text/javascript" src="{% static 'js/jquery-3.6.0.js' %}"></script> to the head section of base.html.

Package search

• [x] Replace HTML by proper link in the packages search results list page
• [x] In the package detail view hide everything after fixing vulnerabilities

JMH: Both are done.

Vulnerabilities search

• [x] Replace HTML by proper link in the vulnerabilities search results list page

JMH: Done.

• [x] In the vulnerabilities detail view hide everything after fixed package
  • [x] hide everything after aliases on the essential tabs
  • [x] Populate Affected Packages and Fixed Packages

JMH: Both are done.

for later:

• ~~[ ] limit searches to a minimum number of characters~~ See https://github.com/nexB/vulnerablecode/issues/871

[pombredanne]

Here are a few more suggestions:

• [x] for the package details, we could have no tabs and everything in one view

• [x] for the vulnerabilities details, a more compact view that would also display affected and fixed packages.
• [x] The first few affected packages and first few fixed packages would be always listed on the main tab.
• [x] There would be a ... (dot dot dot) linking to the tab with the full table
  • It seems Bulma tabsets do not enable such indirect links to a tab, so I added the dots via a for loop and above added a parenthetical (see xxx tab)
• [x] Full details would be in the tabs.
• [x] The count of references, and other items would be added to the right of the tab title inside parenthesis as in References (23)

[johnmhoran]

• ~~[ ] Fix the sorting for all lists in the UI.~~ See https://github.com/nexB/vulnerablecode/issues/872
• [x] Change documentation link in navbar from API doc to the ReadTheDocs.
• [x] Remove dash in vulnerabilities reference list when there is no value in a field. Same in other fields.
• [x] Make sure search box in both search results pages and both details pages are populated with current search/display value(s).
• [x] Make sure footer appears at bottom of all "short" pages -- fix package details.
• ~~[ ] Add info to package/purl details page reflecting closest version with no unresolved reported vulnerabilities. (Do we not want to use the term "reported"?)~~ See https://github.com/nexB/vulnerablecode/issues/873
• ~~[ ] Add tests for new UI views, templates etc.~~ See https://github.com/nexB/vulnerablecode/issues/874
• ~~[ ] Allow lowercase searches for VULCOID-* (which might be renamed).~~ See https://github.com/nexB/vulnerablecode/issues/875
• [x] Clean up custom.css.

[johnmhoran]

@tdruez Re my using too many style attributes, I'll do my best to replace these with Bulma classes as you requested, but it will take a fair amount of time to figure out what the Bulma version is of a specific display style I've fine-tuned, and not all likely are covered by the class choices provided by Bulma. Working on this now.

[tdruez]

• [x] Fix the labels and wording case consistency