import React from "react";
import SkeletonThemeWrapper from "../../customization-cornor/skeletonCustomization";

import avatarPropTypes, {
  defaultProps,
  propsDescription
} from "./Avatar.propTypes";

import useCommonReducer from "../../libraries/reducerHandler";
import avatarStateReducers from "./Avatar.reducers";
import avatarHooks from "./Avatar.hooks";
import * as avatarConstants from "./Avatar.actionConstants";
export default function AvatarBehaviour(props) {
  let { state = {}, dispatch } = useCommonReducer(
    avatarStateReducers,
    props.reducer,
    {
      showAvatar: props.photoUrl ? true : false
    }
  );

  let renderProps = {
    onError: () => {
      dispatch({ type: avatarConstants.INVALID_PHOTOURL_PUSH });
    },
    onLoad: () => {
      dispatch({ type: avatarConstants.VALID_PHOTOURL_PUSH });
    },
    getContent: avatarHooks.getContent,
    getAbbr: avatarHooks.getAbbr,
    showAvatar: state.showAvatar
  };

  let { renderComponent, ...basicProps} = props;

  return <SkeletonThemeWrapper basicProps={basicProps} renderProps={renderProps} component={renderComponent} />
}

AvatarBehaviour.propTypes = avatarPropTypes;
AvatarBehaviour.defaultProps = defaultProps;
AvatarBehaviour.propsDescription = propsDescription;
