【React】ForwardRefを使ったら "Component definition is missing display name" というeslintの警告がでた

forwardRefを使ったら以下のeslintの警告がでた

Component definition is missing display name

stackoverflow.com

これを読むに、displayNameプロパティに値をセットしないとならないみたいだが、ちょっと毎回これを書かなければならないのは微妙

import React from "react";

const Search = React.forwardRef<HTMLInputElement>((props, ref) => {
  return <input ref={ref} type="search" />;
});
Search.displayName = "Search";

export default Search;

ということで、この他を調べたら、以下のやりかたでも解決される

import React from "react";

export default React.forwardRef<HTMLInputElement>(function Search(props, ref) => {
  return <input ref={ref} type="search" />;
});

こちらの方が馴染みがあるのでこちらを採用することにする