Add word-wrap in strings in share lists

data-dot-all · Jan 12, 2024 · c51f280 · c51f280
1 parent b2c721c
commit c51f280
Showing 1 changed file with 20 additions and 4 deletions.
diff --git a/frontend/src/modules/Shares/components/ShareBoxListItem.js b/frontend/src/modules/Shares/components/ShareBoxListItem.js
@@ -39,7 +39,11 @@ export const ShareBoxListItem = ({ share }) => {
             <Typography color="textPrimary" variant="body1">
               Request owner
             </Typography>
-            <Typography color="textSecondary" variant="body1">
+            <Typography
+              color="textSecondary"
+              variant="body1"
+              style={{ wordWrap: 'break-word' }}
+            >
               {`${share.principal.SamlGroupName}`}
             </Typography>
           </Box>
@@ -55,7 +59,11 @@ export const ShareBoxListItem = ({ share }) => {
             <Typography color="textPrimary" variant="body1">
               IAM role name
             </Typography>
-            <Typography color="textSecondary" variant="body1">
+            <Typography
+              color="textSecondary"
+              variant="body1"
+              style={{ wordWrap: 'break-word' }}
+            >
               {`${share.principal.principalIAMRoleName}`}
             </Typography>
           </Box>
@@ -71,7 +79,11 @@ export const ShareBoxListItem = ({ share }) => {
             <Typography color="textPrimary" variant="body1">
               Dataset
             </Typography>
-            <Typography color="textSecondary" variant="body1">
+            <Typography
+              color="textSecondary"
+              variant="body1"
+              style={{ wordWrap: 'break-word' }}
+            >
               {`${share.dataset.datasetName}`}
             </Typography>
           </Box>
@@ -84,7 +96,11 @@ export const ShareBoxListItem = ({ share }) => {
               px: 3
             }}
           >
-            <Typography color="textPrimary" variant="body1">
+            <Typography
+              color="textPrimary"
+              variant="body1"
+              style={{ wordWrap: 'break-word' }}
+            >
               Dataset Owner
             </Typography>
             <Typography color="textSecondary" variant="body1">