Confused about React TypeScript function and function component declarations

I'm wondering why some ways of declarations are valid while others are not and are throwing errors as shown below:

Correct

export const useDebounce = <T,>(val: T): T => {
    const [debouncedValue, setDebouncedValue] = useState<T>(val)
    return debouncedValue;
};
export function useDebounce<T>(val: T): T {
const [debouncedValue, setDebouncedValue] = useState<T>(val)
return debouncedValue;
}

Incorrect

export const useDebounce<T,> = (val: T): T => {
    const [debouncedValue, setDebouncedValue] = useState<T>(val)
    return debouncedValue;
};

Error(s) thrown:

1. Variable 'useDebounce' implicitly has an 'any' type.
2. '(' expected.
3. Cannot find name 'T'.

Correct

export const SearchComponentDebounce: React.FC = () => {
    return <div></div>
}

Incorrect

export const SearchComponentDebounce = (): React.FC => {
    return <div></div>
}

Error thrown:

Type 'Element' is not assignable to type 'FC<{}>'.
  Type 'ReactElement<any, any>' provides no match for the signature '(props: {}): ReactNode | Promise<ReactNode>'.