diff --git a/src/features/Dashboard/InstructorAssignSection/ClassCard.jsx b/src/features/Dashboard/InstructorAssignSection/ClassCard.jsx index 04a2fd3..ea82824 100644 --- a/src/features/Dashboard/InstructorAssignSection/ClassCard.jsx +++ b/src/features/Dashboard/InstructorAssignSection/ClassCard.jsx @@ -7,7 +7,8 @@ import { Button } from 'react-paragon-topaz'; import { formatDateRange } from 'helpers'; import { useInstitutionIdQueryParam } from 'hooks'; -import ToolTip from 'features/Dashboard/InstructorAssignSection/ToolTip'; +import EllipsisText from 'features/Dashboard/InstructorAssignSection/EllipsisText'; +import { textLength } from 'features/constants'; import 'features/Dashboard/InstructorAssignSection/index.scss'; @@ -19,19 +20,16 @@ const ClassCard = ({ data }) => { history.push(addQueryParam(`/manage-instructors/${encodeURIComponent(data?.masterCourseId)}/${encodeURIComponent(data?.classId)}?previous=dashboard`)); }; - const classElement = 'className'; - const courseElement = 'courseName'; - return (
- {data?.className.length > 20 ? ( - + {data?.className.length > textLength ? ( + ) : (

{data?.className}

)} - {data?.masterCourseName.length > 20 ? ( - + {data?.masterCourseName.length > textLength ? ( + ) : (

{data?.masterCourseName}

)} diff --git a/src/features/Dashboard/InstructorAssignSection/ToolTip.jsx b/src/features/Dashboard/InstructorAssignSection/EllipsisText.jsx similarity index 62% rename from src/features/Dashboard/InstructorAssignSection/ToolTip.jsx rename to src/features/Dashboard/InstructorAssignSection/EllipsisText.jsx index 398db9c..204407d 100644 --- a/src/features/Dashboard/InstructorAssignSection/ToolTip.jsx +++ b/src/features/Dashboard/InstructorAssignSection/EllipsisText.jsx @@ -1,7 +1,9 @@ import PropTypes from 'prop-types'; import { Tooltip, OverlayTrigger } from '@edx/paragon'; -const ToolTip = ({ title, type }) => ( +import { textLength } from 'features/constants'; + +const EllipsisText = ({ title, type }) => ( ( show={undefined} > {type === 'className' ? ( -

{title.substring(0, 20)}...

+

{title.substring(0, textLength)}...

) : ( -

{title.substring(0, 20)}...

+

{title.substring(0, textLength)}...

)}
); -ToolTip.propTypes = { +EllipsisText.propTypes = { title: PropTypes.string.isRequired, type: PropTypes.string.isRequired, }; -export default ToolTip; +export default EllipsisText; diff --git a/src/features/constants.js b/src/features/constants.js index 9fe51a2..20a26cc 100644 --- a/src/features/constants.js +++ b/src/features/constants.js @@ -82,3 +82,10 @@ export const cookieText = 'This website uses cookies to ensure you get the best * @constant {string} */ export const unauthorizedText = 'You do not have access to CertPREP Manager. If you believe you should have access then please contact your sales rep.'; + +/** + * Constant for text length. + * @readonly + * @number + */ +export const textLength = 20;