group sharing message as gray text in story title

UniversityOfHelsinkiCS · Oct 7, 2024 · 3738e44 · 3738e44
1 parent da7db02
commit 3738e44
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 2 deletions.
diff --git a/client/assets/custom.scss b/client/assets/custom.scss
@@ -1622,6 +1622,7 @@ label.file-upload-btn {
 
   @media (min-width: 640px) {
     margin-left: 1rem;
+    margin-right: 1rem;
 
     &:hover {
       cursor: pointer;

diff --git a/client/components/LibraryView/StoryListItem.js b/client/components/LibraryView/StoryListItem.js
@@ -20,6 +20,7 @@ const StoryTitle = ({
   currentGroup,
   libraryShown,
   setConfirmationOpen,
+  storyGroupShareInfo,
   handleControlledStoryCancel,
 }) => {
   const learningLanguage = useSelector(learningLanguageSelector)
@@ -38,14 +39,25 @@ const StoryTitle = ({
   return (
     <StoryDetailsModal
       trigger={
-        <span className="space-between" style={{ overflow: 'hidden', width: '100%' }}>
+        <span className="flex" style={{ overflow: 'hidden', width: '100%' }}>
           <Icon color="grey" name="ellipsis vertical" className="story-item-dots" />
           <h5
             className="story-item-title"
-            style={{ marginBottom: '.5rem', ...getTextStyle(learningLanguage) }}
+            style={{ marginBottom: '.5rem', width: '65%', ...getTextStyle(learningLanguage) }}
           >
             {story.title}
           </h5>
+          {inGroupLibrary && storyGroupShareInfo && (
+            <span style={{
+              whiteSpace: 'nowrap', 
+              overflow: 'hidden',
+              textOverflow: 'ellipsis',
+              '-o-text-overflow': 'ellipsis',
+              width: '30%',
+            }}>
+              {storyGroupShareInfo.message}
+            </span>
+          )}
         </span>
       }
       story={story}
@@ -368,6 +380,7 @@ const StoryListItem = ({ story, libraryShown, selectedGroup }) => {
           inGroupLibrary={inGroupLibrary}
           currentGroup={currentGroup}
           libraryShown={libraryShown}
+          storyGroupShareInfo={storyGroupShareInfo}
           handleControlledStoryCancel={handleControlledStoryCancel}
         />
       </Card.Content>