[Prod] Remove fields from the objective form on the RTR

.circleci/config.yml

@@ -420,10 +420,10 @@ parameters:
     type: string
   dev_git_branch: # change to feature branch to test deployment
     description: "Name of github branch that will deploy to dev"
-    default: "mb/TTAHUB-2857/update-goal-status-logic"
+    default: "mb/TTAHUB-2660/activity-report-updates-for-reduced-objectives"
     type: string
   sandbox_git_branch:  # change to feature branch to test deployment
-    default: "mb/TTAHUB-2609/move-components"
+    default: "mb/TTAHUB-2530/update-RTR-objective-form"
     type: string
   prod_new_relic_app_id:
     default: "877570491"

.gitignore

@@ -9,6 +9,8 @@ playwright
 tests/**/report/*.html
 tests/api/report
 tests/e2e/report
+tests/e2e/test-results
+tests/api/test-results
 
 # Ignore /doc => /docs symbolic link created for adr-tools
 /doc

docs/logical_data_model.puml

@@ -137,6 +137,7 @@ class ActivityReportObjectives{
  arOrder : integer : 1
  closeSuspendContext : text
  closeSuspendReason : enum
+ objectiveCreatedHere : boolean
  status : varchar(255)
  supportType : enum
  title : text

frontend/src/components/FileUploader/FileTable.js

@@ -80,23 +80,19 @@ const FileTable = ({ onFileRemoved, files }) => {
                 {getStatus(file.status)}
               </td>
               <td>
-                {file.showDelete
-                  ? (
-                    <Button
-                      type="button"
-                      className="smart-hub--file-tag-button"
-                      unstyled
-                      onClick={(e) => {
-                        e.preventDefault();
-                        handleDelete(currentIndex);
-                      }}
-                    >
-                      <span className="fa-sm">
-                        <FontAwesomeIcon color={colors.textInk} icon={faTrash} aria-label={`remove ${file.originalFileName}`} />
-                      </span>
-                    </Button>
-                  )
-                  : null }
+                <Button
+                  type="button"
+                  className="smart-hub--file-tag-button"
+                  unstyled
+                  onClick={(e) => {
+                    e.preventDefault();
+                    handleDelete(currentIndex);
+                  }}
+                >
+                  <span className="fa-sm">
+                    <FontAwesomeIcon color={colors.textInk} icon={faTrash} aria-label={`remove ${file.originalFileName}`} />
+                  </span>
+                </Button>
               </td>
             </tr>
           ))}

frontend/src/components/GoalCards/GoalCard.js

@@ -69,7 +69,7 @@ ObjectiveSwitch.propTypes = {
   dispatchStatusChange: PropTypes.func.isRequired,
 };
 
-function GoalCard({
+export default function GoalCard({
   goal,
   recipientId,
   regionId,
@@ -100,10 +100,12 @@ function GoalCard({
     isReopenedGoal,
   } = goal;
 
+  const { user } = useContext(UserContext);
+  const { setIsAppLoading } = useContext(AppLoadingContext);
   const [invalidStatusChangeAttempted, setInvalidStatusChangeAttempted] = useState();
   const sortedObjectives = [...objectives, ...(sessionObjectives || [])];
   sortedObjectives.sort((a, b) => ((new Date(a.endDate) < new Date(b.endDate)) ? 1 : -1));
-
+  const hasEditButtonPermissions = canEditOrCreateGoals(user, parseInt(regionId, DECIMAL_BASE));
   const {
     atLeastOneObjectiveIsNotCompletedOrSuspended,
     dispatchStatusChange,
@@ -123,10 +125,8 @@ function GoalCard({
 
   const goalNumbers = `${goal.goalNumbers.join(', ')}${isReopenedGoal ? '-R' : ''}`;
 
-  const { user } = useContext(UserContext);
-  const { setIsAppLoading } = useContext(AppLoadingContext);
-
   const editLink = `/recipient-tta-records/${recipientId}/region/${regionId}/goals?id[]=${ids.join(',')}`;
+  const viewLink = `/recipient-tta-records/${recipientId}/region/${regionId}/goals/view?${ids.map((d) => `id[]=${d}`).join('&')}`;
 
   const onUpdateGoalStatus = (newStatus) => {
     const statusesThatNeedObjectivesFinished = [
@@ -154,33 +154,39 @@ function GoalCard({
     setObjectivesExpanded(!objectivesExpanded);
   };
 
-  const hasEditButtonPermissions = canEditOrCreateGoals(user, parseInt(regionId, DECIMAL_BASE));
-  const determineMenuItems = () => {
-    // Add reopen button if user has permissions and the goal is closed.
-    const createdMenuItems = [];
+  const contextMenuLabel = `Actions for goal ${id}`;
 
-    if (goalStatus === 'Closed' && hasEditButtonPermissions) {
-      createdMenuItems.push({
-        label: 'Reopen',
-        onClick: () => {
-          showReopenGoalModal(id);
-        },
-      });
-    }
+  const menuItems = [];
 
-    // Add edit button if user has permissions or if the goal is closed.
-    createdMenuItems.push({
-      label: goalStatus === 'Closed' || !hasEditButtonPermissions ? 'View' : 'Edit',
+  if (goalStatus === 'Closed' && hasEditButtonPermissions) {
+    menuItems.push({
+      label: 'Reopen',
+      onClick: () => {
+        showReopenGoalModal(id);
+      },
+    });
+    menuItems.push({
+      label: 'View',
+      onClick: () => {
+        history.push(viewLink);
+      },
+    });
+  } else if (hasEditButtonPermissions) {
+    menuItems.push({
+      label: 'Edit',
       onClick: () => {
         history.push(editLink);
       },
     });
+  } else {
+    menuItems.push({
+      label: 'View',
+      onClick: () => {
+        history.push(viewLink);
+      },
+    });
+  }
 
-    return createdMenuItems;
-  };
-  const menuItems = determineMenuItems();
-
-  const contextMenuLabel = `Actions for goal ${id}`;
   const canDeleteQualifiedGoals = (() => {
     if (isAdmin(user)) {
       return true;
@@ -218,16 +224,16 @@ function GoalCard({
       <div className="display-flex flex-justify">
         <div className="display-flex flex-align-start flex-row">
           { !hideCheckbox && (
-          <Checkbox
-            id={`goal-select-${id}`}
-            label=""
-            value={id}
-            checked={isChecked}
-            onChange={handleGoalCheckboxSelect}
-            aria-label={`Select goal ${goalText}`}
-            className="margin-right-1"
-            data-testid="selectGoalTestId"
-          />
+            <Checkbox
+              id={`goal-select-${id}`}
+              label=""
+              value={id}
+              checked={isChecked}
+              onChange={handleGoalCheckboxSelect}
+              aria-label={`Select goal ${goalText}`}
+              className="margin-right-1"
+              data-testid="selectGoalTestId"
+            />
           )}
           <GoalStatusDropdown
             showReadOnlyStatus={showReadOnlyStatus}
@@ -239,11 +245,11 @@ function GoalCard({
           />
         </div>
         { !hideGoalOptions && (
-        <ContextMenu
-          label={contextMenuLabel}
-          menuItems={menuItems}
-          menuWidthOffset={100}
-        />
+          <ContextMenu
+            label={contextMenuLabel}
+            menuItems={menuItems}
+            menuWidthOffset={100}
+          />
         )}
       </div>
       <GoalStatusChangeAlert
@@ -258,9 +264,9 @@ function GoalCard({
             {' '}
             {goalNumbers}
             {isMerged && (
-            <Tag className="margin-left-1 text-ink text-normal" background={colors.baseLighter}>
-              Merged
-            </Tag>
+              <Tag className="margin-left-1 text-ink text-normal" background={colors.baseLighter}>
+                Merged
+              </Tag>
             )}
           </h3>
           <p className="text-wrap usa-prose margin-y-0">
@@ -356,5 +362,3 @@ GoalCard.defaultProps = {
   hideGoalOptions: false,
   erroneouslySelected: false,
 };
-
-export default GoalCard;

frontend/src/components/GoalForm/Form.js

@@ -3,7 +3,7 @@ import React, { useContext } from 'react';
 import PropTypes from 'prop-types';
 import { uniq } from 'lodash';
 import {
-  Alert, FormGroup,
+  Alert,
 } from '@trussworks/react-uswds';
 import ObjectiveForm from './ObjectiveForm';
 import PlusButton from './PlusButton';
@@ -16,11 +16,12 @@ import {
 } from './constants';
 import AppLoadingContext from '../../AppLoadingContext';
 import './Form.scss';
-import ReadOnlyField from '../ReadOnlyField';
 import GoalName from './GoalName';
 import RTRGoalSource from './RTRGoalSource';
 import FormFieldThatIsSometimesReadOnly from './FormFieldThatIsSometimesReadOnly';
 import RTRGoalPrompts from './RTRGoalPrompts';
+import ReadOnlyGoalCollaborators from '../ReadOnlyGoalCollaborators';
+import GoalFormTitle from './GoalFormTitle';
 
 export const BEFORE_OBJECTIVES_CREATE_GOAL = 'Enter a goal before adding an objective';
 export const BEFORE_OBJECTIVES_SELECT_RECIPIENTS = 'Select a grant number before adding an objective';
@@ -44,7 +45,6 @@ export default function Form({
   objectives,
   setObjectives,
   setObjectiveError,
-  topicOptions,
   isOnApprovedReport,
   isOnReport,
   isCurated,
@@ -54,7 +54,6 @@ export default function Form({
   fetchError,
   goalNumbers,
   clearEmptyObjectiveError,
-  onUploadFiles,
   userCanEdit,
   source,
   setSource,
@@ -101,17 +100,16 @@ export default function Form({
   };
 
   const objectiveErrors = errors[FORM_FIELD_INDEXES.OBJECTIVES];
-
-  const formTitle = goalNumbers && goalNumbers.length ? `Goal ${goalNumbers.join(', ')}${isReopenedGoal ? '-R' : ''}` : 'Recipient TTA goal';
-
   const showAlert = isOnReport && status !== 'Closed';
-
   const notClosedWithEditPermission = (() => (status !== 'Closed' && userCanEdit))();
   return (
     <div className="ttahub-create-goals-form">
       { fetchError ? <Alert type="error" role="alert">{ fetchError }</Alert> : null}
       <div className="display-flex flex-align-center margin-top-2 margin-bottom-1">
-        <h2 className="margin-0">{formTitle}</h2>
+        <GoalFormTitle
+          goalNumbers={goalNumbers}
+          isReopenedGoal={isReopenedGoal}
+        />
         { status.toLowerCase() === 'draft'
         && (
           <span className="usa-tag smart-hub--table-tag-status smart-hub--status-draft padding-x-105 padding-y-1 margin-left-2">Draft</span>
@@ -134,22 +132,9 @@ export default function Form({
 
       <h3 className="margin-top-4 margin-bottom-3">Goal summary</h3>
 
-      {collaborators.length > 0 ? collaborators.map((collaborator) => {
-        const {
-          goalCreatorName,
-          goalCreatorRoles,
-          goalNumber,
-        } = collaborator;
-        if (!goalCreatorName) return null;
-        return (
-          <FormGroup key={goalNumber}>
-            <ReadOnlyField label={`Entered by${collaborators.length > 1 ? ` (${goalNumber})` : ''}`}>
-              {goalCreatorName}
-              {goalCreatorRoles ? `, ${goalCreatorRoles}` : ''}
-            </ReadOnlyField>
-          </FormGroup>
-        );
-      }) : null}
+      <ReadOnlyGoalCollaborators
+        collaborators={collaborators}
+      />
 
       <GrantSelect
         selectedGrants={selectedGrants}
@@ -197,6 +182,7 @@ export default function Form({
           status !== 'Closed',
           createdVia !== 'tr',
           userCanEdit,
+          !isOnApprovedReport,
         ]}
         label="Goal source"
         value={uniq(Object.values(source || {})).join(', ') || ''}
@@ -238,8 +224,6 @@ export default function Form({
           // that way we don't get the white screen of death
           errors={objectiveErrors[i] || OBJECTIVE_DEFAULT_ERRORS}
           setObjective={(data) => setObjective(data, i)}
-          topicOptions={topicOptions}
-          onUploadFiles={onUploadFiles}
           goalStatus={status}
           userCanEdit={userCanEdit}
         />
@@ -302,10 +286,6 @@ Form.propTypes = {
   endDate: PropTypes.string,
   setEndDate: PropTypes.func.isRequired,
   setObjectives: PropTypes.func.isRequired,
-  topicOptions: PropTypes.arrayOf(PropTypes.shape({
-    label: PropTypes.string,
-    value: PropTypes.number,
-  })).isRequired,
   objectives: PropTypes.arrayOf(PropTypes.shape({
     objective: PropTypes.string,
     topics: PropTypes.arrayOf(PropTypes.shape({
@@ -325,7 +305,6 @@ Form.propTypes = {
     [PropTypes.string, PropTypes.arrayOf(PropTypes.string)],
   ).isRequired,
   clearEmptyObjectiveError: PropTypes.func.isRequired,
-  onUploadFiles: PropTypes.func.isRequired,
   validateGoalNameAndRecipients: PropTypes.func.isRequired,
   userCanEdit: PropTypes.bool,
   prompts: PropTypes.shape({

frontend/src/components/GoalForm/GoalFormTitle.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const GoalFormTitle = ({ goalNumbers, isReopenedGoal }) => {
+  const formTitle = goalNumbers && goalNumbers.length ? `Goal ${goalNumbers.join(', ')}${isReopenedGoal ? '-R' : ''}` : 'Recipient TTA goal';
+  return (
+    <h2 className="font-serif-xl margin-0">{formTitle}</h2>
+  );
+};
+
+GoalFormTitle.propTypes = {
+  goalNumbers: PropTypes.arrayOf(PropTypes.string),
+  isReopenedGoal: PropTypes.bool,
+};
+
+GoalFormTitle.defaultProps = {
+  goalNumbers: [],
+  isReopenedGoal: false,
+};
+
+export default GoalFormTitle;

frontend/src/components/GoalForm/GoalNudge.js

@@ -108,6 +108,8 @@ export default function GoalNudge({
 
   // what a hack
   const checkboxZed = similar.length && !useOhsInitiativeGoal && !dismissSimilar ? 'z-bottom' : '';
+  const showOhsInitiativeGoalCheckbox = goalTemplates && goalTemplates.length > 0;
+  const buttonGroupFlex = showOhsInitiativeGoalCheckbox ? 'flex-justify' : 'flex-justify-end';
 
   return (
     <div className="ttahub-goal-nudge--container position-relative margin-bottom-3">
@@ -131,8 +133,8 @@ export default function GoalNudge({
         onSelectNudgedGoal={onSelectNudgedGoal}
         initiativeRef={initiativeRef}
       />
-      <div className="desktop:display-flex flex-justify margin-top-1 smart-hub-maxw-form-field">
-        { (goalTemplates && goalTemplates.length > 0) && (
+      <div className={`desktop:display-flex ${buttonGroupFlex} margin-top-1 smart-hub-maxw-form-field`}>
+        { (showOhsInitiativeGoalCheckbox) && (
         <Checkbox
           id="use-ohs-initiative-goal"
           name="use-ohs-initiative-goal"