Type Annotation in react-navigation

Question

I am quite new to typescript and so I am struggling a bit with type annotating. I am using react-navigation and adding a custom header. Everything works fine. But I am unable to add types for custom header props. My code looks like this:

import { DrawerHeaderProps, DrawerToggleButton } from '@react-navigation/drawer';
import { FullIcon } from 'm/images';
import React from 'react';
import { TouchableNativeFeedback } from 'react-native';
import { Colors, Image, View } from 'react-native-ui-lib';

const IMGASPECTRATIO = 3.052;

const HomeHeader: React.FC<DrawerHeaderProps> = ({ navigation }) => {
    const openModal = () => {
        navigation.navigate('Home', { screen: 'ListView' })
    };

    return (
        <View paddingV-s2 paddingL-s1 paddingR-s4 row centerV spread height={56}>
            <DrawerToggleButton tintColor={Colors.white} />
            <Image height={20} width={20 * IMGASPECTRATIO} source={FullIcon} resizeMode="contain" />
            <TouchableNativeFeedback onPress={openModal}>
                <View height={35} width={35} br100 backgroundColor={Colors.blue1}></View>
            </TouchableNativeFeedback>
        </View>
    );
};

export default HomeHeader;

I am not sure how can I get type checking for HeaderProps, DrawerHeaderProps seems to be working but it doesn't show the screen I am allowed to navigate from it. I have implemented a Drawer navigator and nested inside it is a Stack navigator.