Update Data Management, Test Queue and Candidate Review Pages and Dat…

…abase Implementation to support #648 (#688)

Changes added to primarily support #648, but also #518 and w3c/aria-at#950. This includes functional changes to the Data Management, the Test Queue and the Candidate Review pages. It also includes changes to the database structure, described in #632.

* feature: updates functionality of Data Management page (#713)
* feature: updates functionality of Test Queue page (#715)
* feature: updates functionality of Candidate Review page (#715) 
* feature: include functionality to support the concept of required reports (#722)
* feature: adds Test Plan Report Status dialog (#728)
* enhancement: move Candidate Phase Start Date and Target Completion Date into dedicated columns on Candidate Review page (#730)
* feature: adds Test Plan Version page (#747)
* enhancement: explicitly support ‘DEPRECATED’ phase status for TestPlanVersions (#749)
* feature: adds filter and sorting functionality by columns headers on Data Management page (#750)
* bugfix: update semantic structure of cells with multiple list items on Data Management page (#752)
* enhancement: include GitHub issues on Test Plan Version page (#753)
* bugfix: revision of the required reports conditions for updating to CANDIDATE and RECOMMENDED phases (#764)
* bugfix: removes superfluous header from Test Plan Report Status dialog (#766)
* bugfix: update and revise sorts, headings and descriptions of elements on Test Plan Version page (#767)
* bugfix: account for several other update phase scenarios that could prevent the update from happening if there is an older TestPlanVersion that exists with results (#771)
* bugfix: update headings and revise deprecated dates shown on Test Plan Version page (#773)
* enhancement: allow updating of GitHub issues being presented in the app to be more easily understood (#775)
* bugfix: correct deprecatedAt date to be relative to when the ‘next’ TestPlanVersion was added (#780)
* enhancement: update the text shown when deprecation occurs during a phase on Test Plan Version page (#781)
* bugfix: fix inverted sort descriptions and pin sort of of Test Plan name columns on Data Management page (#790)

---------

Co-authored-by: Erika Miguel <[email protected]>
Co-authored-by: Paul Clue <[email protected]>
Co-authored-by: alflennik <[email protected]>
Co-authored-by: Stalgia Grigg <[email protected]>
Co-authored-by: Howard Edwards <[email protected]>

.github/workflows/runtest.yml

@@ -37,6 +37,7 @@ jobs:
           yarn sequelize:test db:migrate
           yarn sequelize:test db:seed:all
           yarn workspace server db-import-tests:test -c ${IMPORT_ARIA_AT_TESTS_COMMIT_1}
+          yarn workspace server db-import-tests:test -c ${IMPORT_ARIA_AT_TESTS_COMMIT_2}
           yarn workspace server db-import-tests:test
           yarn workspace server db-populate-sample-data:test
       - name: test

client/components/AddTestToQueueWithConfirmation/index.jsx

@@ -0,0 +1,92 @@
+import React, { useRef, useState } from 'react';
+import PropTypes from 'prop-types';
+import { Button } from 'react-bootstrap';
+import BasicModal from '../common/BasicModal';
+import { useMutation } from '@apollo/client';
+import { ADD_TEST_QUEUE_MUTATION } from '../TestQueue/queries';
+import { LoadingStatus, useTriggerLoad } from '../common/LoadingStatus';
+
+function AddTestToQueueWithConfirmation({
+    testPlanVersion,
+    browser,
+    at,
+    disabled = false,
+    buttonText = 'Add to Test Queue',
+    triggerUpdate = () => {}
+}) {
+    const [showConfirmation, setShowConfirmation] = useState(false);
+    const [addTestPlanReport] = useMutation(ADD_TEST_QUEUE_MUTATION);
+    const { triggerLoad, loadingMessage } = useTriggerLoad();
+    const buttonRef = useRef();
+
+    const feedbackModalTitle = 'Successfully Added Test Plan';
+
+    const feedbackModalContent = (
+        <>
+            Successfully added <b>{testPlanVersion?.title}</b> for{' '}
+            <b>
+                {at?.name} and {browser?.name}
+            </b>{' '}
+            to the Test Queue.
+        </>
+    );
+
+    const addTestToQueue = async () => {
+        await triggerLoad(async () => {
+            await addTestPlanReport({
+                variables: {
+                    testPlanVersionId: testPlanVersion.id,
+                    atId: at.id,
+                    browserId: browser.id
+                }
+            });
+        }, 'Adding Test Plan to Test Queue');
+        setShowConfirmation(true);
+    };
+
+    return (
+        <>
+            <LoadingStatus message={loadingMessage}></LoadingStatus>
+            <Button
+                ref={buttonRef}
+                disabled={disabled}
+                variant="secondary"
+                onClick={addTestToQueue}
+                className="w-auto"
+                data-testid="add-button"
+            >
+                {buttonText}
+            </Button>
+            <BasicModal
+                show={showConfirmation}
+                closeButton={false}
+                title={feedbackModalTitle}
+                content={feedbackModalContent}
+                closeLabel="Ok"
+                handleClose={async () => {
+                    await triggerUpdate();
+                    setShowConfirmation(false);
+                    setTimeout(() => {
+                        if (buttonRef?.current) {
+                            buttonRef.current.focus();
+                        }
+                    }, 0);
+                }}
+            />
+        </>
+    );
+}
+
+AddTestToQueueWithConfirmation.propTypes = {
+    testPlanVersion: PropTypes.object,
+    browser: PropTypes.object,
+    at: PropTypes.object,
+    buttonRef: PropTypes.object,
+    onFocus: PropTypes.func,
+    onBlur: PropTypes.func,
+    disabled: PropTypes.bool,
+    buttonText: PropTypes.string,
+    triggerUpdate: PropTypes.func
+};
+
+export default AddTestToQueueWithConfirmation;

client/components/App/App.jsx

@@ -70,20 +70,17 @@ const App = () => {
                                     Test Reports
                                 </Nav.Link>
                             </li>
-                            {isSignedIn && isAdmin && (
-                                <li>
-                                    <Nav.Link
-                                        as={Link}
-                                        to="/test-management"
-                                        aria-current={
-                                            location.pathname ===
-                                            '/test-management'
-                                        }
-                                    >
-                                        Test Management
-                                    </Nav.Link>
-                                </li>
-                            )}
+                            <li>
+                                <Nav.Link
+                                    as={Link}
+                                    to="/data-management"
+                                    aria-current={location.pathname.startsWith(
+                                        '/data-management'
+                                    )}
+                                >
+                                    Data Management
+                                </Nav.Link>
+                            </li>
                             <li>
                                 <Nav.Link
                                     as={Link}
@@ -105,12 +102,12 @@ const App = () => {
                                 <li>
                                     <Nav.Link
                                         as={Link}
-                                        to="/candidate-tests"
+                                        to="/candidate-review"
                                         aria-current={location.pathname.startsWith(
-                                            '/candidate-test'
+                                            '/candidate'
                                         )}
                                     >
-                                        Candidate Tests
+                                        Candidate Review
                                     </Nav.Link>
                                 </li>
                             )}