React.FC is not the preferable way to type a React component, here's a link.

I personally use this type:

const Component1 = ({ prop1, prop2 }): JSX.Element => { /*...*/ }

Short list of React.FC cons:

1. Provides an implicit definition of children, even if your component doesn't need to have children. That might cause an error.
2. Doesn't support generics.
3. Doesn't work correctly with defaultProps.

Best solution:

The second approach + a return type

const PrintName2 = ({ prop1, prop2 }: Props): JSX.Element => { /** */}

This gives you complete control over the Props and is more explicit (there is no hidden magic).

Link to GitHub PR to remove React.FC

Kent C Dodds has some thoughts why this is here

Sub-optimal solution:

The first version (React.FC) will add a few types for you - they come from the React Typings

interface FunctionComponent<P = {}> {
  (props: PropsWithChildren<P>, context?: any): ReactElement | null;
  propTypes?: WeakValidationMap<P>;
  contextTypes?: ValidationMap<any>;
  defaultProps?: Partial<P>;
  displayName?: string;
}

This approach is useful for a few reasons but an obvious one is if your component has children, then you don't need to manually add a children prop. It's not great because there are issues with default props and many components don't have children.

Since you are using React and TypeScript, you should always use the first pattern, as it will ensure that your component is more strictly typed since it implies that the PrintName will be of type React Functional Component, and it takes in props of type Props.

const PrintName: React.FC<Props>

You may read the full interface definition for Functional Components on the React TypeScript typings repository.

The second example you have provided does not provide any form of typings, except that it is a function that takes a set of parameters of type Props, and that it can return anything in general.

Therefore, writing

const PrintName2 = (props:Props)

is akin to

const PrintName2: JSX.Element = (props:Props) 

as TypeScript is definitely unable to automatically infer that it is a Functional Component.

In addition the FC provides typings for displayName and ensure the proper return type. Without FC the following is valid TypeScript:

export const HapticTabF = (props: BottomTabBarButtonProps) => {
  return { "abc": "def" }
}
HapticTabF.displayName = {"AKJASDKL":"ASD"};

The only major gap of FC is it does not designate the Props as Readonly which means the following is allowed.

export const HapticTab: FC<BottomTabBarButtonProps> = (props) => {
  props.style = {"shadowColor":"123"}
}

But having it be export const HapticTab: FC<Readonly<BottomTabBarButtonProps>> ... is too verbose and is better off that React fixes it in their libraries.

Don't use React.FC anymore. The reason why people used to use React.FC was because it added more types like children to your props.

in your code example you don't need children so just write it like this

const PrintName: (props: {name:string; priority: "bold" | "normal"}) => {
  return (
    <div>
      <p style={{ fontWeight: props.priority ? "bold" : "normal" }}>
        {props.name}
      </p>
    </div>
  )
}

but the problem you will eventually have is that you will want to pass in children to your components and the preferred way of doing this is like this

interface Props extends React.PropsWithChildren {
   name: string
   priority: "bold" | "normal"
}

const PrintName: (props: Props) => {
  return (
    <div>
      <h1>{props.name}</h1>
      <p style={{ fontWeight: props.priority ? "bold" : "normal" }}> 
        {props.children}
      </p>
    </div>
  )
}

extending with React.PropsWithChildren is the same as if you typed:

interface Props {
   name:string
   priority: "bold" | "normal"
   children?: ReactNode
}

React.PropsWithChildren can also be passed a generic but the default is unknown. If you want you can set children like this, but unless you are sure you only want a specific type I would just use the default.

React.PropsWithChildren<Button> 

and pass in the type of children you want in your component.

You do not have to pass a return type of JSX.Element, because it's inferred.