import type { FC, ComponentType } from 'react';
import React from 'react';
import { View } from 'react-native';
import { layout } from '../styles';
import Toaster from '../components/Toaster/Toaster';

interface Props {
    navigation: any;
}

const withMessageHandlers = <ComponentProps extends Props>(
    Component: ComponentType<ComponentProps>
): FC<ComponentProps> => {
    const WithMessageHandlers: FC<ComponentProps> & { router?: any } = ({
        navigation
    }) => (
        <View style={layout.fill}>
            {
                // @ts-ignore
                <Component navigation={navigation} />
            }
            <Toaster />
        </View>
    );
    // @ts-ignore
    WithMessageHandlers.router = Component.router;
    return WithMessageHandlers;
};

export default withMessageHandlers;