Merge pull request #9 from eduNEXT/lfc/depr-truncate

jignaciopm · web-flow · commit 255329369b98 · 2025-06-03T15:17:47.000-04:00
fix: deprecate Truncate component
diff --git a/src/course-outline/card-header/TitleButton.jsx b/src/course-outline/card-header/TitleButton.jsx
@@ -39,7 +39,7 @@ const TitleButton = ({
         className="item-card-header__title-btn"
         onClick={onTitleClick}
       >
-        <Truncate lines={1} className={`${namePrefix}-card-title mb-0`}>{title}</Truncate>
+        <Truncate.Deprecated lines={1} className={`${namePrefix}-card-title mb-0`}>{title}</Truncate.Deprecated>
       </Button>
     </OverlayTrigger>
   );
diff --git a/src/course-outline/card-header/TitleLink.jsx b/src/course-outline/card-header/TitleLink.jsx
@@ -14,7 +14,7 @@ const TitleLink = ({
     className="item-card-header__title-btn"
     to={titleLink}
   >
-    <Truncate lines={1} className={`${namePrefix}-card-title mb-0`}>{title}</Truncate>
+    <Truncate.Deprecated lines={1} className={`${namePrefix}-card-title mb-0`}>{title}</Truncate.Deprecated>
   </Button>
 );
 
diff --git a/src/course-outline/page-alerts/PageAlerts.jsx b/src/course-outline/page-alerts/PageAlerts.jsx
@@ -378,7 +378,7 @@ const PageAlerts = ({
             dismissError={() => dispatch(dismissError(msgObj.key))}
           >
             <Alert.Heading>{msgObj.title}</Alert.Heading>
-            {msgObj.desc && <Truncate lines={2}>{msgObj.desc}</Truncate>}
+            {msgObj.desc && <Truncate.Deprecated lines={2}>{msgObj.desc}</Truncate.Deprecated>}
           </ErrorAlert>
         ) : (
           <Alert
@@ -387,7 +387,7 @@ const PageAlerts = ({
             key={msgObj.key}
           >
             <Alert.Heading>{msgObj.title}</Alert.Heading>
-            {msgObj.desc && <Truncate lines={2}>{msgObj.desc}</Truncate>}
+            {msgObj.desc && <Truncate.Deprecated lines={2}>{msgObj.desc}</Truncate.Deprecated>}
           </Alert>
         )
       ))
diff --git a/src/editors/containers/EditorContainer/components/TitleHeader/__snapshots__/index.test.jsx.snap b/src/editors/containers/EditorContainer/components/TitleHeader/__snapshots__/index.test.jsx.snap
@@ -14,11 +14,11 @@ exports[`TitleHeader snapshots initialized 1`] = `
 <div
   className="d-flex flex-row align-items-center mt-1"
 >
-  <Truncate>
+  <Truncate.Deprecated>
     {
       "useSelector": [Function],
     }
-  </Truncate>
+  </Truncate.Deprecated>
   <IconButton
     alt="Edit Title"
     className="mx-2"
diff --git a/src/editors/containers/EditorContainer/components/TitleHeader/index.jsx b/src/editors/containers/EditorContainer/components/TitleHeader/index.jsx
@@ -49,9 +49,9 @@ const TitleHeader = ({
   }
   return (
     <div className="d-flex flex-row align-items-center mt-1">
-      <Truncate>
+      <Truncate.Deprecated>
         {title}
-      </Truncate>
+      </Truncate.Deprecated>
       <IconButton
         alt={intl.formatMessage(messages.editTitleLabel)}
         iconAs={Icon}
diff --git a/src/editors/sharedComponents/SelectionModal/GalleryCard.jsx b/src/editors/sharedComponents/SelectionModal/GalleryCard.jsx
@@ -66,7 +66,7 @@ const GalleryCard = ({
         </div>
         <div className="card-text px-3 py-2" style={{ marginTop: '10px' }}>
           <h3 className="text-primary-500">
-            <Truncate>{asset.displayName}</Truncate>
+            <Truncate.Deprecated>{asset.displayName}</Truncate.Deprecated>
           </h3>
           { asset.transcripts && (
             <div style={{ margin: '0 0 5px 0' }}>
diff --git a/src/editors/sharedComponents/SelectionModal/__snapshots__/GalleryCard.test.jsx.snap b/src/editors/sharedComponents/SelectionModal/__snapshots__/GalleryCard.test.jsx.snap
@@ -59,9 +59,9 @@ exports[`GalleryCard component snapshot with duration badge 1`] = `
       <h3
         className="text-primary-500"
       >
-        <Truncate>
+        <Truncate.Deprecated>
           props.img.displayName
-        </Truncate>
+        </Truncate.Deprecated>
       </h3>
       <p
         className="text-gray-500"
@@ -138,9 +138,9 @@ exports[`GalleryCard component snapshot with duration transcripts 1`] = `
       <h3
         className="text-primary-500"
       >
-        <Truncate>
+        <Truncate.Deprecated>
           props.img.displayName
-        </Truncate>
+        </Truncate.Deprecated>
       </h3>
       <div
         style={
@@ -232,9 +232,9 @@ exports[`GalleryCard component snapshot with status badge 1`] = `
       <h3
         className="text-primary-500"
       >
-        <Truncate>
+        <Truncate.Deprecated>
           props.img.displayName
-        </Truncate>
+        </Truncate.Deprecated>
       </h3>
       <p
         className="text-gray-500"
@@ -312,9 +312,9 @@ exports[`GalleryCard component snapshot with thumbnail fallback and load error 1
       <h3
         className="text-primary-500"
       >
-        <Truncate>
+        <Truncate.Deprecated>
           props.img.displayName
-        </Truncate>
+        </Truncate.Deprecated>
       </h3>
       <p
         className="text-gray-500"
@@ -392,9 +392,9 @@ exports[`GalleryCard component snapshot with thumbnail fallback and no error 1`]
       <h3
         className="text-primary-500"
       >
-        <Truncate>
+        <Truncate.Deprecated>
           props.img.displayName
-        </Truncate>
+        </Truncate.Deprecated>
       </h3>
       <p
         className="text-gray-500"
@@ -471,9 +471,9 @@ exports[`GalleryCard component snapshot: dateAdded=12345 1`] = `
       <h3
         className="text-primary-500"
       >
-        <Truncate>
+        <Truncate.Deprecated>
           props.img.displayName
-        </Truncate>
+        </Truncate.Deprecated>
       </h3>
       <p
         className="text-gray-500"
diff --git a/src/files-and-videos/files-page/FileInfoModalSidebar.jsx b/src/files-and-videos/files-page/FileInfoModalSidebar.jsx
@@ -57,9 +57,9 @@ const FileInfoModalSidebar = ({
       </div>
       <ActionRow>
         <div style={{ wordBreak: 'break-word' }}>
-          <Truncate lines={1}>
+          <Truncate.Deprecated lines={1}>
             {asset?.portableUrl}
-          </Truncate>
+          </Truncate.Deprecated>
         </div>
         <ActionRow.Spacer />
         <IconButton
@@ -74,9 +74,9 @@ const FileInfoModalSidebar = ({
       </div>
       <ActionRow>
         <div style={{ wordBreak: 'break-word' }}>
-          <Truncate lines={1}>
+          <Truncate.Deprecated lines={1}>
             {asset?.externalUrl}
-          </Truncate>
+          </Truncate.Deprecated>
         </div>
         <ActionRow.Spacer />
         <IconButton
diff --git a/src/files-and-videos/generic/DeleteConfirmationModal.jsx b/src/files-and-videos/generic/DeleteConfirmationModal.jsx
@@ -35,9 +35,9 @@ const DeleteConfirmationModal = ({
         styling="basic"
         title={(
           <h3 className="h5 m-n2">
-            <Truncate lines={1}>
+            <Truncate.Deprecated lines={1}>
               {original.displayName}
-            </Truncate>
+            </Truncate.Deprecated>
           </h3>
         )}
         data-testid={`collapsible-${original.id}`}
diff --git a/src/files-and-videos/generic/InfoModal.jsx b/src/files-and-videos/generic/InfoModal.jsx
@@ -48,9 +48,9 @@ const InfoModal = ({
       <ModalDialog.Header>
         <ModalDialog.Title>
           <div style={{ wordBreak: 'break-word' }}>
-            <Truncate lines={2} className="font-weight-bold small mt-3">
+            <Truncate.Deprecated lines={2} className="font-weight-bold small mt-3">
               {file?.displayName}
-            </Truncate>
+            </Truncate.Deprecated>
           </div>
         </ModalDialog.Title>
       </ModalDialog.Header>
diff --git a/src/files-and-videos/generic/table-components/GalleryCard.jsx b/src/files-and-videos/generic/table-components/GalleryCard.jsx
@@ -67,9 +67,9 @@ const GalleryCard = ({
           />
         </div>
         <div style={{ wordBreak: 'break-word' }}>
-          <Truncate lines={1} className="font-weight-bold mt-2 picture-title">
+          <Truncate.Deprecated lines={1} className="font-weight-bold mt-2 picture-title">
             {original.displayName}
-          </Truncate>
+          </Truncate.Deprecated>
         </div>
       </Card.Section>
       <Card.Footer className="p-3 pt-4 row m-0 flex-row-reverse justify-content-between align-items-center">
diff --git a/src/files-and-videos/videos-page/upload-modal/UploadProgressList.jsx b/src/files-and-videos/videos-page/upload-modal/UploadProgressList.jsx
@@ -25,9 +25,9 @@ const UploadProgressList = ({ videosList }) => (
         <Stack role="listitem" gap={2} direction="horizontal" className="mb-3 small" key={id}>
           <span>{bulletNumber}</span>
           <div className="col-5 pl-0">
-            <Truncate>
+            <Truncate.Deprecated>
               {video.name}
-            </Truncate>
+            </Truncate.Deprecated>
           </div>
           <div className="col-6 p-0">
             <span className="row m-0 justify-content-end font-weight-bold">
diff --git a/src/group-configurations/common/TitleButton.jsx b/src/group-configurations/common/TitleButton.jsx
@@ -27,7 +27,7 @@ const TitleButton = ({
     >
       <div className="configuration-card-header__title">
         <h3>
-          <Truncate lines={1}>{name}</Truncate>
+          <Truncate.Deprecated lines={1}>{name}</Truncate.Deprecated>
         </h3>
         <span className="x-small text-gray-500">
           {formatMessage(messages.titleId, { id })}
diff --git a/src/group-configurations/experiment-configurations-section/ExperimentCardGroup.jsx b/src/group-configurations/experiment-configurations-section/ExperimentCardGroup.jsx
@@ -14,7 +14,7 @@ const ExperimentCardGroup = ({ groups }) => {
           data-testid="configuration-card-content-experiment-stack"
           key={item.id}
         >
-          <Truncate lines={1}>{item.name}</Truncate>
+          <Truncate.Deprecated lines={1}>{item.name}</Truncate.Deprecated>
           <span>{percentage}</span>
         </div>
       ))}

Original file line number	Diff line number	Diff line change
`@@ -39,7 +39,7 @@ const TitleButton = ({`
`39`	`39`	`className="item-card-header__title-btn"`
`40`	`40`	`onClick={onTitleClick}`
`41`	`41`	`>`
`42`		- <Truncate lines={1} className={`${namePrefix}-card-title mb-0`}>{title}</Truncate>
	`42`	+ <Truncate.Deprecated lines={1} className={`${namePrefix}-card-title mb-0`}>{title}</Truncate.Deprecated>
`43`	`43`	`</Button>`
`44`	`44`	`</OverlayTrigger>`
`45`	`45`	`);`
Original file line number	Diff line number	Diff line change
`@@ -14,7 +14,7 @@ const TitleLink = ({`
`14`	`14`	`className="item-card-header__title-btn"`
`15`	`15`	`to={titleLink}`
`16`	`16`	`>`
`17`		- <Truncate lines={1} className={`${namePrefix}-card-title mb-0`}>{title}</Truncate>
	`17`	+ <Truncate.Deprecated lines={1} className={`${namePrefix}-card-title mb-0`}>{title}</Truncate.Deprecated>
`18`	`18`	`</Button>`
`19`	`19`	`);`
`20`	`20`
Original file line number	Diff line number	Diff line change
`@@ -378,7 +378,7 @@ const PageAlerts = ({`
`378`	`378`	`dismissError={() => dispatch(dismissError(msgObj.key))}`
`379`	`379`	`>`
`380`	`380`	`<Alert.Heading>{msgObj.title}</Alert.Heading>`
`381`		`- {msgObj.desc && <Truncate lines={2}>{msgObj.desc}</Truncate>}`
	`381`	`+ {msgObj.desc && <Truncate.Deprecated lines={2}>{msgObj.desc}</Truncate.Deprecated>}`
`382`	`382`	`</ErrorAlert>`
`383`	`383`	`) : (`
`384`	`384`	`<Alert`
`@@ -387,7 +387,7 @@ const PageAlerts = ({`
`387`	`387`	`key={msgObj.key}`
`388`	`388`	`>`
`389`	`389`	`<Alert.Heading>{msgObj.title}</Alert.Heading>`
`390`		`- {msgObj.desc && <Truncate lines={2}>{msgObj.desc}</Truncate>}`
	`390`	`+ {msgObj.desc && <Truncate.Deprecated lines={2}>{msgObj.desc}</Truncate.Deprecated>}`
`391`	`391`	`</Alert>`
`392`	`392`	`)`
`393`	`393`	`))`
Original file line number	Diff line number	Diff line change
@@ -14,11 +14,11 @@ exports[`TitleHeader snapshots initialized 1`] = `
`14`	`14`	`<div`
`15`	`15`	`className="d-flex flex-row align-items-center mt-1"`
`16`	`16`	`>`
`17`		`- <Truncate>`
	`17`	`+ <Truncate.Deprecated>`
`18`	`18`	`{`
`19`	`19`	`"useSelector": [Function],`
`20`	`20`	`}`
`21`		`- </Truncate>`
	`21`	`+ </Truncate.Deprecated>`
`22`	`22`	`<IconButton`
`23`	`23`	`alt="Edit Title"`
`24`	`24`	`className="mx-2"`