fix: fixes for compatibility with redwood which doesn't fully support…

… typescript yet
open-craft · Aug 30, 2024 · acbd7fa · acbd7fa
1 parent 87cc442
commit acbd7fa
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 34 deletions.
diff --git a/src/grading-settings/data/apiHooks.ts → src/grading-settings/data/apiHooks.js b/src/grading-settings/data/apiHooks.ts → src/grading-settings/data/apiHooks.js
@@ -1,21 +1,21 @@
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
 import { getCourseSettings, getGradingSettings, sendGradingSettings } from './api';
 
-export const useGradingSettings = (courseId: string) => (
+export const useGradingSettings = (courseId) => (
   useQuery({
     queryKey: ['gradingSettings', courseId],
     queryFn: () => getGradingSettings(courseId),
   })
 );
 
-export const useCourseSettings = (courseId: string) => (
+export const useCourseSettings = (courseId) => (
   useQuery({
     queryKey: ['courseSettings', courseId],
     queryFn: () => getCourseSettings(courseId),
   })
 );
 
-export const useGradingSettingUpdater = (courseId: string) => {
+export const useGradingSettingUpdater = (courseId) => {
   const queryClient = useQueryClient();
   return useMutation({
     mutationFn: (settings) => sendGradingSettings(courseId, settings),

diff --git a/...-scale/components/GradingScaleSegment.tsx → ...-scale/components/GradingScaleSegment.jsx b/...-scale/components/GradingScaleSegment.tsx → ...-scale/components/GradingScaleSegment.jsx
@@ -1,25 +1,11 @@
 import { useIntl } from '@edx/frontend-platform/i18n';
 import { Button } from '@openedx/paragon';
-import React, { ChangeEvent } from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
 import messages from '../messages';
 
 import { getLettersOnLongScale, getLettersOnShortScale } from '../utils';
 
-interface RangeSegment {
-  previous: number,
-  current: number,
-}
-
-interface GradingScaleSegmentProps {
-  idx: number,
-  value: number,
-  getSegmentProps: () => { [key: string]: string },
-  handleLetterChange: (event: ChangeEvent, idx: number) => void,
-  letters: [string],
-  gradingSegments: RangeSegment[],
-  removeGradingSegment: (idx: number) => void,
-}
-
 const GradingScaleSegment = ({
   idx,
   value,
@@ -28,7 +14,7 @@ const GradingScaleSegment = ({
   letters,
   gradingSegments,
   removeGradingSegment,
-}: GradingScaleSegmentProps) => {
+}) => {
   const intl = useIntl();
   const prevValue = gradingSegments[idx === 0 ? 0 : idx - 1]?.previous ?? 0;
   const segmentRightMargin = (value - prevValue) < 6 ? '0.125rem' : '1.25rem';
@@ -46,22 +32,22 @@ const GradingScaleSegment = ({
         }}
       >
         {gradingSegments.length === 2 && (
-        <input
-          className="grading-scale-segment-content-title m-0"
-          data-testid="grading-scale-segment-input"
-          value={getLettersOnShortScale(idx, letters, intl)}
-          onChange={e => handleLetterChange(e, idx)}
-          disabled={idx === gradingSegments.length}
-        />
+          <input
+            className="grading-scale-segment-content-title m-0"
+            data-testid="grading-scale-segment-input"
+            value={getLettersOnShortScale(idx, letters, intl)}
+            onChange={e => handleLetterChange(e, idx)}
+            disabled={idx === gradingSegments.length}
+          />
         )}
         {gradingSegments.length > 2 && (
-        <input
-          className="grading-scale-segment-content-title m-0"
-          data-testid="grading-scale-segment-input"
-          value={getLettersOnLongScale(idx, letters, gradingSegments)}
-          onChange={e => handleLetterChange(e, idx)}
-          disabled={idx === gradingSegments.length}
-        />
+          <input
+            className="grading-scale-segment-content-title m-0"
+            data-testid="grading-scale-segment-input"
+            value={getLettersOnLongScale(idx, letters, gradingSegments)}
+            onChange={e => handleLetterChange(e, idx)}
+            disabled={idx === gradingSegments.length}
+          />
         )}
         <span className="grading-scale-segment-content-number m-0">
           {gradingSegments[idx === 0 ? 0 : idx - 1]?.previous} - {value === 100 ? value : value - 1}
@@ -83,4 +69,19 @@ const GradingScaleSegment = ({
   );
 };
 
+GradingScaleSegment.propTypes = {
+  idx: PropTypes.number.isRequired,
+  value: PropTypes.number.isRequired,
+  getSegmentProps: PropTypes.func.isRequired,
+  handleLetterChange: PropTypes.func.isRequired,
+  removeGradingSegment: PropTypes.func.isRequired,
+  gradingSegments: PropTypes.arrayOf(
+    PropTypes.shape({
+      current: PropTypes.number.isRequired,
+      previous: PropTypes.number.isRequired,
+    }),
+  ).isRequired,
+  letters: PropTypes.arrayOf(PropTypes.string).isRequired,
+};
+
 export default GradingScaleSegment;