fix(ObjectPage): Don't wrap header content if image is an avatar (#277)

Closes #273
SAP · Jan 21, 2020 · bd87102 · bd87102
1 parent 624e84f
commit bd87102
Showing 1 changed file with 4 additions and 4 deletions.
diff --git a/packages/main/src/components/ObjectPage/index.tsx b/packages/main/src/components/ObjectPage/index.tsx
@@ -39,7 +39,7 @@ import { ObjectPageAnchorButton } from './ObjectPageAnchorButton';
 export interface ObjectPagePropTypes extends CommonProps {
   title?: string;
   subTitle?: string;
-  image?: string | ReactNode;
+  image?: string | ReactElement<any>;
   imageShapeCircle?: boolean;
   headerActions?: Array<ReactElement<any>>;
   renderHeaderContent?: () => JSX.Element;
@@ -262,9 +262,9 @@ const ObjectPage: FC<ObjectPagePropTypes> = forwardRef((props: ObjectPagePropTyp
           </span>
         );
       } else {
-        // @ts-ignore
         avatar = React.cloneElement(image, {
-          size: AvatarSize.L
+          size: AvatarSize.L,
+          className: image.props?.className ? `${classes.headerImage} ${image.props?.className}` : classes.headerImage
         });
       }
     }
@@ -283,7 +283,7 @@ const ObjectPage: FC<ObjectPagePropTypes> = forwardRef((props: ObjectPagePropTyp
         <div className={classes.contentHeader}>
           <div className={classes.headerContent}>
             <div className={classes.flexBoxRow}>
-              <div>{avatar}</div>
+              {avatar}
               <div className={classes.flexBoxColumn}>
                 <div>{renderBreadcrumbs && renderBreadcrumbs()}</div>
                 <div className={classes.flexBoxRow}>