addressed pr comments

microsoft · Sep 4, 2018 · 83d0977 · 83d0977
1 parent 4cdecc7
commit 83d0977
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 29 deletions.
diff --git a/docs/src/examples/components/Chat/Variations/ChatExampleAvatar.tsx b/docs/src/examples/components/Chat/Variations/ChatExampleAvatar.tsx
diff --git a/src/components/Chat/ChatMessage.tsx b/src/components/Chat/ChatMessage.tsx
@@ -1,5 +1,6 @@
 import * as React from 'react'
 import * as PropTypes from 'prop-types'
+import * as cx from 'classnames'
 
 import { childrenExist, createShorthandFactory, customPropTypes, UIComponent } from '../../lib'
 import { ComponentVariablesInput, IComponentPartStylesInput } from '../../../types/theme'
@@ -67,10 +68,14 @@ class ChatMessage extends UIComponent<Extendable<IChatMessageProps>, any> {
   renderComponent({ ElementType, classes, rest, styles }) {
     const { avatar, children, content, mine } = this.props
 
-    return (
+    return childrenExist(children) ? (
+      <ElementType {...rest} className={cx(classes.root, classes.chatContent)}>
+        {children}
+      </ElementType>
+    ) : (
       <ElementType {...rest} className={classes.root}>
         {!mine && this.renderAvatar(avatar, styles)}
-        <div className={classes.chatContent}>{childrenExist(children) ? children : content}</div>
+        <div className={classes.chatContent}>{content}</div>
         {mine && this.renderAvatar(avatar, styles)}
       </ElementType>
     )

diff --git a/test/specs/components/Chat/ChatMessage-test.tsx b/test/specs/components/Chat/ChatMessage-test.tsx
@@ -11,8 +11,8 @@ describe('ChatMessage', () => {
 
   describe('avatar', () => {
     it('creates an Avatar component when the avatar shorthand is provided', () => {
-      const name = 'AB'
-      const chatMsg = mountWithProvider(<ChatMessage avatar="AB" />)
+      const name = 'John Doe'
+      const chatMsg = mountWithProvider(<ChatMessage avatar={name} />)
 
       expect(chatMsg.find('Avatar').prop('name')).toEqual(name)
     })