export * from "./Test";
export * from "./TestProps";
export * from "./TestState";

import * as PropTypes from "prop-types";

export interface TestProps {
    header: string,
    count: number;
    onIncrement: () => any;
}

export const TestPropTypes = {
    header: PropTypes.string
};

export interface TestState {
    name: string
}

import React, { Component } from "react";
import {TestProps, TestPropTypes} from "./TestProps";
import {TestState} from "./TestState";
import { HOC } from "../HOC/";

@HOC
export class Test extends Component<TestProps, TestState> {
    public static propTypes = TestPropTypes;
    public render(): JSX.Element {
        const { header } = this.props;
        return <div>{header}</div>
    }
}

export * from "./HOC";

import * as React from "react";
import { Subtract } from "utility-types";

interface HOCProps {
    count: number;
    onIncrement: () => any;
}

export const HOC = <WrappedProps extends HOCProps>(
    WrappedComponent: React.ComponentType<WrappedProps>
) => {
    type HocProps = Subtract<WrappedProps, HOCProps> & {
        initialCount?: number;
    };
    interface HocState {
        readonly count: number;
    };

    return class WithState extends React.Component<HocProps, HocState> {
        public static displayName = `withState(${WrappedComponent.name})`;
        public static readonly WrappedComponent = WrappedComponent;
        public readonly state: HocState = {
            count: Number(this.props.initialCount) || 0,
        };

        public handleIncrement = () => {
            this.setState({ count: this.state.count + 1 });
        };

        public render() {
            const { ...restProps } = this.props as {};
            const { count } = this.state;

            return (
                <WrappedComponent
                    {...restProps}
                    count={count}
                    onIncrement={this.handleIncrement}
                />
            );
        }
    };
};