fix: Fixes the saving pop-up to appear

Moves the array updation statement and introduces two ways of updating the grading statement. Signed-off-by: Farhaan Bukhsh <[email protected]>
open-craft · Oct 25, 2024 · bb553c5 · bb553c5
1 parent 3b56fab
commit bb553c5
Show file tree

Hide file tree

Showing 3 changed files with 61 additions and 28 deletions.
diff --git a/src/grading-settings/grading-scale/GradingScale.jsx b/src/grading-settings/grading-scale/GradingScale.jsx
@@ -55,40 +55,44 @@ const GradingScale = ({
   }, [gradingSegments, letters]);
 
   const addNewGradingSegment = () => {
-    setGradingSegments(prevSegments => {
+    setGradingSegments((prevSegments) => {
+      let updatedGradingSegment = [];
       if (prevSegments.length >= 5) {
         const segSize = MAXIMUM_SCALE_LENGTH / (prevSegments.length + 1);
-        return Array.from({ length: prevSegments.length + 1 }).map((_, i) => (
-          {
-            current: 100 - i * segSize,
-            previous: 100 - (i + 1) * segSize,
-          }
-        ));
-      }
-      const firstSegment = prevSegments[prevSegments.length - 1];
-      const secondSegment = prevSegments[prevSegments.length - 2];
-      const newCurrentValue = Math.ceil((secondSegment.current - secondSegment.previous) / 2);
-
-      const newSegment = {
-        current: (firstSegment.current + newCurrentValue),
-        previous: firstSegment.current,
-      };
+        updatedGradingSegment = Array.from({
+          length: prevSegments.length + 1,
+        }).map((_, i) => ({
+          current: 100 - i * segSize,
+          previous: 100 - (i + 1) * segSize,
+        }));
+      } else {
+        const firstSegment = prevSegments[prevSegments.length - 1];
+        const secondSegment = prevSegments[prevSegments.length - 2];
+        const newCurrentValue = Math.ceil(
+          (secondSegment.current - secondSegment.previous) / 2,
+        );
+
+        const newSegment = {
+          current: firstSegment.current + newCurrentValue,
+          previous: firstSegment.current,
+        };
 
-      const updatedSecondSegment = {
-        ...secondSegment,
-        previous: (firstSegment.current + newCurrentValue),
-      };
+        const updatedSecondSegment = {
+          ...secondSegment,
+          previous: firstSegment.current + newCurrentValue,
+        };
+        updatedGradingSegment = [
+          ...prevSegments.slice(0, prevSegments.length - 2),
+          updatedSecondSegment,
+          newSegment,
+          firstSegment,
+        ];
+      }
 
       showSavePrompt(true);
       setShowSuccessAlert(false);
       setOverrideInternetConnectionAlert(false);
-
-      return [
-        ...prevSegments.slice(0, prevSegments.length - 2),
-        updatedSecondSegment,
-        newSegment,
-        firstSegment,
-      ];
+      return updatedGradingSegment;
     });
 
     const nextIndex = (letters.length % defaultGradeDesignations.length);

diff --git a/src/grading-settings/grading-scale/GradingScale.test.jsx b/src/grading-settings/grading-scale/GradingScale.test.jsx
@@ -123,4 +123,33 @@ describe('<GradingScale />', () => {
       expect(segmentInputs[1]).toHaveValue('Test');
     });
   });
+
+  it('should render GradingScale component with more than 5 grades', async () => {
+    const { getAllByTestId } = render(
+      <IntlProvider locale="en" messages={{}}>
+        <GradingScale
+          intl={injectIntl}
+          gradeCutoffs={gradeCutoffs}
+          gradeLetters={gradeLetters}
+          sortedGrades={sortedGrades}
+          resetDataRef={{ current: false }}
+          showSavePrompt={jest.fn()}
+          setShowSuccessAlert={jest.fn()}
+          setGradingData={jest.fn()}
+          setOverrideInternetConnectionAlert={jest.fn()}
+          setEligibleGrade={jest.fn()}
+          defaultGradeDesignations={['A', 'B', 'C', 'D', 'E']}
+        />
+      </IntlProvider>,
+    );
+    await waitFor(() => {
+      const addNewSegmentBtn = getAllByTestId('grading-scale-btn-add-segment');
+      expect(addNewSegmentBtn[0]).toBeInTheDocument();
+      fireEvent.click(addNewSegmentBtn[0]);
+      const segments = getAllByTestId('grading-scale-segment-number');
+      // Calculation is based on 100/6 i.e A, B, C, D, E, F which comes to 16.666666666666657
+      expect(segments[0].textContent).toEqual('83.33333333333333 - 100');
+      expect(segments[6].textContent).toEqual('0 - 15.666666666666657');
+    });
+  });
 });
diff --git a/src/grading-settings/grading-scale/components/GradingScaleSegment.jsx b/src/grading-settings/grading-scale/components/GradingScaleSegment.jsx
@@ -49,7 +49,7 @@ const GradingScaleSegment = ({
             disabled={idx === gradingSegments.length}
           />
         )}
-        <span className="grading-scale-segment-content-number m-0">
+        <span data-testid="grading-scale-segment-number" className="grading-scale-segment-content-number m-0">
           {gradingSegments[idx === 0 ? 0 : idx - 1]?.previous} - {value === 100 ? value : value - 1}
         </span>
       </div>