React+Typescript declare type before component vs after component

I am new to typescript, I saw some projects declaring the type before component and some of them declare after the component, may I know what are the differences?

export type TProps = {
    item: string;
}
export default function Component({item}: TProps) {
}

vs

export default function Component({item}: TProps) {
}
export type TProps = {
    item: string;
}

both of the code are able to run, which one is better and why?

couldn't find any article about this.

Thank you.

This is the same thing just like in JavaScript we can call function before initialisation.

It's just depends on developer who he can write the types .

When using types for props specifically, I tend to put it before the component. I do this for readability so I can quickly see what the component takes for parameters.

Ultimately it comes down to preference, but for readability sake, I like to keep it at the top.

I like types above or in a separate file and maybe interface but in your case, something like this:

type TProps = {
  item?: string;
};
const Component = ({ item = 'Test' }: TProps) => <div>{item}</div>;
export default Component;
// ...
<Parent>
<Component /> {/* skipping prop will default in 'Test' */}
</Parent>

Also I really like how compact and neat arrow functions for components are! (no FC required nowadays because defaultProps can be done through default param values of the props).