Annotating useNavigation type when it is used in a generic component

Question

TLDR: Is it possible to annotate the useNavigation hook in a generic component?

If I create a component that uses the useNavigation() hook is there a way to have it correctly type the hook when it is used in multiple screens?

The docs recommend typing this as:

const navigation = useNavigation();

However, this only works for when using useNavigation in a specific screen. How does one annotate the hook for more than one screen?

user_1665026 · Answer

You should specify a default type:

declare global {
  namespace ReactNavigation {
    interface RootParamList extends RootStackParamList {}
  }
}

Specifying a default type means you don't need to annotate it. This is perfect for generic components which are used in multiple places.