IdeaBottomSection 컴포넌트 중복 줄이기

[seung-00]

<IdeaBottomSection /> 에는 비슷한 동작을 하는 로직이 있는데

1. 선택한 탭에 따라서
2. 해당 API 를 찌른 데이터를 패치 받아서
3. 그 데이터를 props 로 하는 컴포넌트를 loop 하고
4. 인증이 실패한 경우엔 <ForbiddenComment /> 을 보여주는 로직이다.

따로 함수를 만들어 쓰고 싶은데, 특히 컴포넌트를 인자로 받아 loop 돌릴 수 있으면 좋겠다. 근데 그러려면 컴포넌트의 타입을 정해줘야 한다. loop 의 대상이 되는 컴포넌트들의 타입을 정의 하기가 어렵다.
제네릭을 써서 해결할 수 있지 않을까? 아래 링크를 참고해서 리팩터링 해보자.

[React] TypeScript Generic React Component :: 김명재, Myeongjae Kim