Merge pull request #289 from AppQuality/fixes-chat

fix(chat): add clear from external save and fix shrinked avat
AppQuality · Jan 2, 2024 · 0961895 · 0961895
2 parents 6969349 + ae3d42f
commit 0961895
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 8 deletions.
diff --git a/src/stories/chat/chatInput.tsx b/src/stories/chat/chatInput.tsx
diff --git a/src/stories/chat/context/chatContext.tsx b/src/stories/chat/context/chatContext.tsx
@@ -35,6 +35,7 @@ export const ChatContextProvider = ({
       triggerSave: () => {
         if (editor && onSave) {
           onSave(editor);
+          editor.commands.clearContent();
         }
       },
     }),

diff --git a/src/stories/chat/index.stories.tsx b/src/stories/chat/index.stories.tsx
@@ -101,7 +101,7 @@ const defaultArgs: EditorStoryArgs = {
       },
     },
     {
-      message: "Hi, I'm a comment too but with <strong>bold</strong>",
+      message: "Hi, I'm a comment too but with <strong>bold</strong>. lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec auctor, nisl eget ultricies ultricies, nunc nisl ultricies nunc, quis ultricies nisl nisl eget ultricies ultricies, nunc nisl ultricies nunc, quis ultricies nisl",
       date: " | 27 dic. 2023 | 12:00",
       author: {
         name: "Marco B.",

diff --git a/src/stories/chat/parts/comment.tsx b/src/stories/chat/parts/comment.tsx
@@ -32,9 +32,9 @@ const AuthorContainer = styled.div`
 `;
 
 const CommentDate = styled.span`
-color: ${({ theme }) => theme.palette.grey[500]};
-font-weight: ${({ theme }) => theme.fontWeights.thin};
-`
+  color: ${({ theme }) => theme.palette.grey[500]};
+  font-weight: ${({ theme }) => theme.fontWeights.thin};
+`;
 
 const Footer = styled.div`
   display: flex;
@@ -48,15 +48,21 @@ export const Comment = ({
   message,
   children,
   date,
-}: PropsWithChildren<{ author: Author; message: string, date:string }>) => {
+}: PropsWithChildren<{ author: Author; message: string; date: string }>) => {
   return (
     <CommentCard>
       <AuthorContainer>
-        <Avatar avatarType={author.avatarType ?? "text"}>
+        <Avatar
+          avatarType={author.avatarType ?? "text"}
+          style={{ flexShrink: 0 }}
+        >
           {author.avatar}
         </Avatar>
         <div>
-          <Title>{author.name ?? "User"}<CommentDate>{date}</CommentDate></Title>
+          <Title>
+            {author.name ?? "User"}
+            <CommentDate>{date}</CommentDate>
+          </Title>
           <ReadOnly>
             <Editor editable={false}>{message}</Editor>
           </ReadOnly>