React 아코디언 효과 구현하기

다음과 같이 transition 속성을 적용하여 컴포넌트를 클릭했을때, 컴포넌트가 아코디언 처럼 서서히 펼쳐지고, 접히는 효과를 구현하고 싶습니다. isOpen이 true가 되어 펼쳐지는 효과는 정상적으로 구현되는데, 접히는 효과가 안나타나고 한번에 사라집니다. transition 속성을 어떻게 적용하면 될까요?