withNavigationParamsHoc.tsx

import React from 'react';
import { NavigationStackScreenProps } from 'react-navigation-stack';

interface Props extends NavigationStackScreenProps {
  foo: string;
}
const TestScreen = ({ navigation, foo }: Props) => {
  const barDirectly = navigation.getParam('bar');

  return <Text>bar from navigation: {barDirectly} bar as foo from HOC: {foo}</Text>;
};

const withNavigationParam = <P extends NavigationStackScreenProps>(
  mapPropsToParams: { [key in keyof P]?: P[key] },
) => (Component: React.ComponentType<P>) => (props: P) => {
  const propsFromParams = Object.entries(mapPropsToParams).reduce(
    (finalProps, [propName, paramName]) => ({
      ...finalProps,
      [propName]: props.navigation.getParam(paramName),
    }),
    {},
  );
  return <Component {...propsFromParams} {...props} />;
};

export default withNavigationParam<Props>({
  foo: 'bar',
})(TestScreen);