ylqjgm
/
canvas-lms
mirror of https://github.com/instructure/canvas-lms.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fix text not wrapping when word or link is very long 

closes VICE-2275
flag=react_inbox

Test Plan
1. Create a message that has a very long link or word
2. Open it in inbox
3. Verify that the word wraps inside of the message container.

Change-Id: I952d7e7c476ede1c40a8bca3d709be5c169ad1d8
Reviewed-on: https://gerrit.instructure.com/c/canvas-lms/+/310854
Reviewed-by: Omar Soto-Fortuño <omar.soto@instructure.com>
Product-Review: Omar Soto-Fortuño <omar.soto@instructure.com>
QA-Review: Caleb Guanzon <cguanzon@instructure.com>
Tested-by: Service Cloud Jenkins <svc.cloudjenkins@instructure.com>
This commit is contained in:
Jason Gillett 2023-02-10 11:41:52 -07:00
parent 1c5d0b418d
commit 95608500f8
1 changed files with 3 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
ui/features/inbox/react/components/MessageDetailItem/MessageDetailItem.js
View File

@ -85,12 +85,12 @@ export const MessageDetailItem = ({...props}) => {
/> />
</Flex.Item> </Flex.Item>
<Flex.Item> <Flex.Item>
<Text weight="normal" size={responsiveProps.courseNameDate}> <Text weight="normal" size={responsiveProps.courseNameDate} wrap="break-word">
{props.contextName} {props.contextName}
</Text> </Text>
</Flex.Item> </Flex.Item>
<Flex.Item> <Flex.Item>
<Text weight="normal" size={responsiveProps.courseNameDate}> <Text weight="normal" size={responsiveProps.courseNameDate} wrap="break-word">
{createdAt} {createdAt}
</Text> </Text>
</Flex.Item> </Flex.Item>
@ -108,6 +108,7 @@ export const MessageDetailItem = ({...props}) => {
)} )}
</Flex> </Flex>
<Text <Text
wrap="break-word"
size={responsiveProps.messageBody} size={responsiveProps.messageBody}
dangerouslySetInnerHTML={{__html: formatMessage(props.conversationMessage?.body)}} dangerouslySetInnerHTML={{__html: formatMessage(props.conversationMessage?.body)}}
/> />