diff --git a/src/course-unit/course-sequence/sequence-navigation/UnitButton.jsx b/src/course-unit/course-sequence/sequence-navigation/UnitButton.tsx similarity index 63% rename from src/course-unit/course-sequence/sequence-navigation/UnitButton.jsx rename to src/course-unit/course-sequence/sequence-navigation/UnitButton.tsx index f86dbb781d..76aa728ed8 100644 --- a/src/course-unit/course-sequence/sequence-navigation/UnitButton.jsx +++ b/src/course-unit/course-sequence/sequence-navigation/UnitButton.tsx @@ -1,21 +1,29 @@ -import PropTypes from 'prop-types'; +import { type FC } from 'react'; import { useSelector } from 'react-redux'; import { Button } from '@openedx/paragon'; import { Link } from 'react-router-dom'; +import { DeprecatedReduxState } from '@src/store'; +import { getCourseId, getSequenceId } from '@src/course-unit/data/selectors'; import UnitIcon from './UnitIcon'; -import { getCourseId, getSequenceId } from '../../data/selectors'; -const UnitButton = ({ +interface Props { + unitId: string; + className?: string; + showTitle?: boolean; + isActive?: boolean; +} + +const UnitButton: FC = ({ unitId, className, - showTitle, isActive, // passed from parent (SequenceNavigationTabs) + showTitle = false, }) => { const courseId = useSelector(getCourseId); const sequenceId = useSelector(getSequenceId); - const unit = useSelector((state) => state.models.units[unitId]); + const unit = useSelector((state: DeprecatedReduxState) => state.models.units[unitId]); const { title, contentType } = unit || {}; return ( @@ -33,17 +41,4 @@ const UnitButton = ({ ); }; -UnitButton.propTypes = { - className: PropTypes.string, - showTitle: PropTypes.bool, - unitId: PropTypes.string.isRequired, - isActive: PropTypes.bool, -}; - -UnitButton.defaultProps = { - className: undefined, - showTitle: false, - isActive: false, -}; - export default UnitButton; diff --git a/src/course-unit/course-sequence/sequence-navigation/UnitIcon.jsx b/src/course-unit/course-sequence/sequence-navigation/UnitIcon.tsx similarity index 50% rename from src/course-unit/course-sequence/sequence-navigation/UnitIcon.jsx rename to src/course-unit/course-sequence/sequence-navigation/UnitIcon.tsx index 9294d419f1..2b426ef0cb 100644 --- a/src/course-unit/course-sequence/sequence-navigation/UnitIcon.jsx +++ b/src/course-unit/course-sequence/sequence-navigation/UnitIcon.tsx @@ -1,17 +1,17 @@ -import PropTypes from 'prop-types'; +import { type FC } from 'react'; import { Icon } from '@openedx/paragon'; import { BookOpen as BookOpenIcon } from '@openedx/paragon/icons'; -import { UNIT_TYPE_ICONS_MAP, UNIT_ICON_TYPES } from '../../../generic/block-type-utils/constants'; +import { UNIT_TYPE_ICONS_MAP } from '@src/generic/block-type-utils/constants'; -const UnitIcon = ({ type }) => { +interface Props { + type: keyof typeof UNIT_TYPE_ICONS_MAP; +} + +const UnitIcon: FC = ({ type }) => { const icon = UNIT_TYPE_ICONS_MAP[type] || BookOpenIcon; return ; }; -UnitIcon.propTypes = { - type: PropTypes.oneOf(UNIT_ICON_TYPES).isRequired, -}; - export default UnitIcon; diff --git a/src/generic/block-type-utils/constants.ts b/src/generic/block-type-utils/constants.ts index aedb48c14e..f9dd23cfdb 100644 --- a/src/generic/block-type-utils/constants.ts +++ b/src/generic/block-type-utils/constants.ts @@ -21,8 +21,6 @@ import { } from '@openedx/paragon/icons'; import NewsstandIcon from '../NewsstandIcon'; -export const UNIT_ICON_TYPES = ['video', 'other', 'vertical', 'problem', 'lock']; - export const COMPONENT_TYPES = { advanced: 'advanced', discussion: 'discussion',