import React from "react";
import propTypes from "prop-types";
import { useThemeByComponent } from "../components/uclprovider/UCLProvider";

export default function SkeletonThemeWrapper(props) {
  let Component = props.component;
  if (!Component) {
    return null;
  }

  let componentName = Component.name.replace("Skeleton", "");
  const componentThemeProps = useThemeByComponent(componentName) || {};

  // // {shape}                  {shape}
  // // Component.defaultProps - componentThemeProps

  // console.log("componentThemeProps", componentThemeProps);

  return (
    <Component
      {...componentThemeProps}
      {...props.basicProps}
      {...props.renderProps}
    />
  );
}

SkeletonThemeWrapper.propTypes = {
  component: propTypes.any,
  basicProps: propTypes.object,
  renderProps: propTypes.object
};
