refactor skelton component

packages/app/src/components/Skelton.tsx

@@ -3,19 +3,28 @@ import React from 'react';
 type SkeltonProps = {
   width?: number,
   height?: number,
-  additionalClass?: string,
+  componentClass?: string,
+  componentHeight?: number,
   roundedPill?: boolean,
 }
 
 export const Skelton = (props: SkeltonProps): JSX.Element => {
   const {
-    width, height, additionalClass, roundedPill,
+    width, height, componentHeight, componentClass, roundedPill,
   } = props;
 
-  const style = {
+  const componentStyle = {
+    height: componentHeight,
+  };
+
+  const skeltonStyle = {
     width,
     height,
   };
 
-  return <div style={style} className={`grw-skelton ${additionalClass} ${roundedPill ? 'rounded-pill' : ''}`}></div>;
+  return (
+    <div style={componentStyle} className={`d-flex align-items-center ${componentClass}`}>
+      <div style={skeltonStyle} className={`grw-skelton ${roundedPill ? 'rounded-pill' : ''}`}></div>
+    </div>
+  );
 };