Accordion with state and function

Accordion.js

import React, { useState } from 'react'
import Collapsed from './Collapsed'
import Expanded from './Expanded'

const Accordion = ({ children }) => {
  const [open, setOpen] = useState('')
  
  const handleOpen = (e) => {
    const id = e.target.getAttribute('data-id')
    id === open ? setOpen('') : setOpen(id)
  }
  
  return <div>{children}</div>
}

Accordion.Collapsed = Collapsed
Accordion.Expanded = Expanded
Accordion.Item = ({ children }) => children

export default Accordion