import React from 'react';
import { interfaces } from 'inversify';
const context = React.createContext<interfaces.Container | null>(null);
export default context;

type Props = {
   container: interfaces.Container;
   children: ReactNode;
};
export function DiProvider({ container, children }: Props) {
   return <Context.Provider value={container}>{children}</Context.Provider>;
}

export function withProvider<P, C>(
   component: JSXElementConstructor<P> & C,
   container: interfaces.Container
) {
   class ProviderWrap extends Component<Props> {
       public static contextType = Context;
       public static displayName = `diProvider(${getDisplayName(component)})`;
       public constructor(props: Props, context?: interfaces.Container) {
           super(props);
           this.context = context;
           if (this.context) {
               container.parent = this.context;
           }
       }
       public render() {
           const WrappedComponent = component;
           return (
               <DiProvider container={container}>
                   <WrappedComponent {...(this.props as any)} />
               </DiProvider>
           );
       }
   }
   return ProviderWrap as ComponentClass<Props>;
}

container.bind<Store>("StoreKey").to(Store);