Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add UI for Required Reports Phase update #774

Open
wants to merge 64 commits into
base: development
Choose a base branch
from

Conversation

Paul-Clue
Copy link
Collaborator

@Paul-Clue Paul-Clue commented Sep 18, 2023

see #683
The purpose of this PR is to enable admins to edit the requirements for updating the phase for testPlanVersions. I added the dropdown for editing the requirements on the data management page and the test queue page.

Paul-Clue and others added 27 commits August 17, 2023 15:47
… before the associated reports were all marked as final (but the tests were 100% done in the Test Queue)
* Refine raise an issue behavior

* Address feedback

* Fixed squished dot icon

* Address last feedback

* Hide closed issues on datamgmt page
* First pass on functioning sort buttons for DataManagePage

* Functioning sort

* Filter functionality for DataManagement

* Refactor filter buttons on DataManagement to reduce complexity

* Filter buttons as separate component

* DataManagement page, break sort out into dedicated hook

* DataManagement page, dedicated hook for filtering

* DataManagement, add constant for test plan version phases to simplify hooks code

* Add relevant dynamic aria attributes to DataManagement column sort elements

* Add relevant dynamic aria attributes to DataManagement filter buttons

* unit tests for SortableTableHeader

* unit tests for FilterButtons

* unit tests for useDataManagementTableSorting hook

* Add unit tests for useDataManagementTableFiltering hook

* Filter buttons only show buttons that have have label, handle testPlans with multiple versions, ...

useDataManagementTableFiltering don't generate label for buttons that have no associated plans

* Break out overall phase derivation logic into dedicated hooks, functional filter and sort

* Simplify useDerivedTestPlanOverallPhase

* Additional unit tests for additional hooks and to test scenarios with multiple test plan versions for a single test plan

hook rename

* Different UX click interaction sequence with SortableTableHeader

* Correct interpretation of alphabetical ascending/descending

* Rename DataManagement/hooks.js to filterSortHooks

* Move sorting and filtering enums to more specific locations based on use

* Fix file locations in unit tests, DataManagement, FilterButtons, SortableTableHeader

* Smaller margin between buttons, FilterButtons

* First pass on functioning sort buttons for DataManagePage

* Functioning sort

* Filter functionality for DataManagement

* Refactor filter buttons on DataManagement to reduce complexity

* Filter buttons as separate component

* DataManagement page, break sort out into dedicated hook

* DataManagement page, dedicated hook for filtering

* DataManagement, add constant for test plan version phases to simplify hooks code

* Add relevant dynamic aria attributes to DataManagement column sort elements

* Add relevant dynamic aria attributes to DataManagement filter buttons

* unit tests for SortableTableHeader

* unit tests for FilterButtons

* unit tests for useDataManagementTableSorting hook

* Add unit tests for useDataManagementTableFiltering hook

* Filter buttons only show buttons that have have label, handle testPlans with multiple versions, ...

useDataManagementTableFiltering don't generate label for buttons that have no associated plans

* Break out overall phase derivation logic into dedicated hooks, functional filter and sort

* Simplify useDerivedTestPlanOverallPhase

* Additional unit tests for additional hooks and to test scenarios with multiple test plan versions for a single test plan

hook rename

* Different UX click interaction sequence with SortableTableHeader

* Correct interpretation of alphabetical ascending/descending

* Rename DataManagement/hooks.js to filterSortHooks

* Move sorting and filtering enums to more specific locations based on use

* Fix file locations in unit tests, DataManagement, FilterButtons, SortableTableHeader

* Smaller margin between buttons, FilterButtons

* Cleanup after rebase

* Render SortableTableHeader inside <table> for test to dismiss warning

* Add AriaLiveRegionProvider, Update DataManagement table to use it

* Allow SortableTableHeader component to work without AriaLiveRegionProvider
* Start to support for sunset phase

* Explicitly use 'DEPRECATED' phase for TestPlanVersion.phase

* Add checks to prevent test plan versions in R&D or Deprecated from being shown in data management dropdown

* Remove duplicate updateTestPlanVersion call

* Reuse phase variable

* Add copy for deprecated reports with DisclaimerInfo component

* Exclude 'DEPRECATED' testPlanVersions on DataManagement page query
* Adjust cell items for data management row to use list-related roles; update aria-labels

* Address PR feedback

* Remove width:max-content

* Address PR feedback

* Formatting

* Address feedback
* Revise required reports approach

* Update tests

* Revert dev.env
* Apply correct sort order for Timeline for All Versions section

* Update headings used on Versions page

* Add aria-labelledby's for tables

* Add &nbsp; for applicable spaces so the text is properly announced by NVDA

* Add migration to add missing deprecatedAt dates and to also properly set the candidatePhaseReachedAt dates to more practical dates after the migrations (if candidatePhaseReachedAt < draftPhaseReachedAt, set it candidatePhaseReachedAt to draftPhaseReachedAt + 1day)

* Test Plan Versions Page: Use standard testPlanVersions descending sort and show all phases being included in Version Summary

* Switch issues search support for checking against hidden body content instead

* Fix TestPlanReportStatusDialog using d (day of the week) and y (era)

* Explicit check for older date when deprecating existing RD test plan versions during import

* Update hidden message content in github issue

* Update query for anon user on TestRun page

* Keep overall status pill from drifting to center of cell

* Fix R&D only TestPlanVersion's table not being shown

* Use aria-label for heading to prevent space being announced
Paul-Clue and others added 5 commits September 27, 2023 14:45
…ase with old TestPlanVersion results (#771)

* Revise deprecation process when copying results from earlier version to avoid unexpected errors

* Additional edge case management for updatePhaseResolver during copying of old test results

* Address edge cases during phase update process when using old results

* Update tests to include updatePhase process

* Extend default timeout

* Make db docs consistent between test and dev

* Update database.md formatting

---------

Co-authored-by: alflennik <[email protected]>
Base automatically changed from update-database-impl to main September 28, 2023 20:01
# Conflicts:
#	client/components/DataManagement/queries.js
#	client/components/ManageTestQueue/index.jsx
#	client/components/common/PhasePill/index.jsx
#	client/tests/__mocks__/GraphQLMocks/DataManagementPagePopulatedMock.js
#	client/tests/__mocks__/GraphQLMocks/TestQueuePageAdminPopulatedMock.js
#	client/tests/__mocks__/GraphQLMocks/TestQueuePageTesterPopulatedMock.js
#	server/graphql-schema.js
#	server/resolvers/index.js
@howard-e
Copy link
Contributor

@Paul-Clue this should be ready for you to pull whenever you're ready again!

Copy link
Contributor

@howard-e howard-e left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@Paul-Clue thanks, I'm super impressed with the work to include this component and verified it does work as expected!

I think there are minor usability items I found and other nitpicks in code enhancements I've suggested below.

Another suggestion I had was with the edit button when clicked. Can the AT and Browser fields in the modal already be populated with the values of the row being click?

client/components/ManageTestQueue/index.jsx Show resolved Hide resolved
client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
@howard-e
Copy link
Contributor

howard-e commented Oct 4, 2023

An additional observation I had here is that while going through the ManageTestQueue file now, I found myself getting repeatedly confused about state variables and functions, which isn't related to this PR or has happened to be just now. But rather that this component now has several instances of AT and Browser states being handled in their own Disclosures:

  • ATs and AtVersions in Manage Assistive Technology Versions disclosure
  • Test Plans, Test Plan Versions, ATs and Browsers in Add Test Plans to the Test Queue disclosure
  • And now Manage Required Reports disclosure with its own instance of ATs and Browsers being handled

I definitely think it's time to split these up into separate components in a follow up enhancement issue.

cc @alflennik

Copy link
Contributor

@alflennik alflennik left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Fantastic work, really happy to see this making it over the finish line!

Copy link
Contributor

@howard-e howard-e left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice! Looks good to me other than the typos.

client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
Copy link
Contributor

@stalgiag stalgiag left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is so exciting! The interface looks and works great for the most part. I had pointed out a few small issues and asked questions inline.

client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
client/components/ManageTestQueue/index.jsx Outdated Show resolved Hide resolved
client/components/TestQueue/index.jsx Show resolved Hide resolved
client/components/ManageTestQueue/index.jsx Show resolved Hide resolved
server/models/services/AtBrowserService Outdated Show resolved Hide resolved
Copy link
Contributor

@stalgiag stalgiag left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is so exciting! The interface looks and works great for the most part. I have pointed out a few small issues and asked questions inline.

@alflennik
Copy link
Contributor

alflennik commented Oct 18, 2023

Hi @Paul-Clue sorry for the late notice on this bug, but I noticed an issue on mobile or small screen devices with one of the dropdowns. When there's not enough space for the contents of the dropdown, it will push the disclosure triangle out of the dropdown box, and it will wrap even though it feels like it should remain in its box. Hopefully the screenshots illustrate that.

Disclosure triangle escaping the dropdown Disclosure triangle escaping the dropdown when phase selected

Also, I got the following error when I tried to use the dropdowns, it might be related to missing a browser field in the queries.

Screenshot of error and stack trace for Uncaught TypeError: Cannot read properties of undefined (reading 'map')

Let me know when this is fixed, as well as the conflicts. Thank you!

@howard-e howard-e changed the base branch from main to development April 4, 2024 22:24
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants