javascript - Definición de tipo para un elemento react/jsx que acepta un conjunto específico de props?

Si tengo lo siguiente:

interface TestProps { test: string }
const TestComponent = (props: TestProps) => <>{props.test}</>;

interface OtherProps { test2: number }
const OtherComponent = (props: OtherProps) => <>{props.test2}</>;

¿Cómo puedo asegurarme de que una variable sea un elemento JSX derivado de TestComponent, pero no de OtherComponent?

Por ejemplo, lo siguiente debería funcionar bien:

const testElement: ReactElement<TestProps> = <TestComponent test="hi"/>; // OK

Pero esto no debería funcionar:

const testElement: ReactElement<TestProps> = <OtherComponent test2={6}/>; // Warning

Se agradece mucho la ayuda