/* eslint-disable @typescript-eslint/no-unsafe-argument */
/* eslint-disable @typescript-eslint/no-unsafe-assignment */
/* eslint-disable @typescript-eslint/ban-types */
import * as React from 'react';
import { expandObj } from 'src/types';
import classnames from 'classnames';
import BaseLayout from './base';

interface DirectPropsI {
  Top: Function;
  Right: Function;
  Bottom: Function;
  Left: Function;
  Content: Function;
}
// eslint-disable-next-line @typescript-eslint/ban-types
function getLayout(Wrapper: Function, addProps: DirectPropsI) {
  function Layout(props: expandObj) {
    const { className, style } = props;

    return (
      <Wrapper
        {...props}
        style={style}
        className={classnames(className, 'op-layout')}
      />
    );
  }
  Layout.role = 'layout';
  Layout.Right = addProps.Right;
  Layout.Left = addProps.Left;
  Layout.Bottom = addProps.Bottom;
  Layout.Top = addProps.Top;
  Layout.Content = addProps.Content;
  return Layout;
}

// eslint-disable-next-line @typescript-eslint/ban-types
function getContent(Wrapper: Function) {
  function Content(props: object) {
    if (props instanceof Function) {
      props = {
        children: props,
      };
    }
    return <Wrapper {...props} />;
  }
  Content.role = 'content';
  return Content;
}

// eslint-disable-next-line @typescript-eslint/ban-types
function getTop(Wrapper: Function) {
  function Top(props: object) {
    if (props instanceof Function) {
      props = {
        children: props,
      };
    }
    return <Wrapper {...props} />;
  }
  Top.role = 'top';
  return Top;
}

// eslint-disable-next-line @typescript-eslint/ban-types
function getBottom(Wrapper: Function) {
  function Bottom(props: object) {
    if (props instanceof Function) {
      props = {
        children: props,
      };
    }
    return <Wrapper {...props} />;
  }
  Bottom.role = 'bottom';
  return Bottom;
}

// eslint-disable-next-line @typescript-eslint/ban-types
function getLeft(Wrapper: Function) {
  function Left(props: object) {
    if (props instanceof Function) {
      props = {
        children: props,
      };
    }
    return <Wrapper {...props} />;
  }
  Left.role = 'left';
  return Left;
}

// eslint-disable-next-line @typescript-eslint/ban-types
function getRight(Wrapper: Function) {
  function Right(props: object) {
    if (props instanceof Function) {
      props = {
        children: props,
      };
    }
    return <Wrapper {...props} />;
  }
  Right.role = 'right';
  return Right;
}

const Layout = getLayout(BaseLayout, {
  Top: getTop(BaseLayout),
  Bottom: getBottom(BaseLayout),
  Left: getLeft(BaseLayout),
  Right: getRight(BaseLayout),
  Content: getContent(BaseLayout),
});

export default Layout;