Exemplo usando props

index.jsx

import React, { useState } from 'react'
import YearMonthSelector from './YearMonthSelector'
import InvoiceResult from './InvoiceResult'
import InvoiceDispute from './InvoiceDispute'

const Invoice = () => {
  const [year, setYear] = useState()
  const [month, setMonth] = useState()
  const [refetchInvoice, setRefetchInvoice] = useState()
  const [selectedItem, setselectedItem] = useState()
  
  return (
    <>
      <YearMonthSelector year={year} month={month} setYear={setYear} setMonth={setMonth} />
      <InvoiceResult
        year={year}
        month={month}
        refetchInvoice={refetchInvoice}
        setRefetchInvoice={setRefetchInvoice}
        selectedItem={selectedItem}
        setselectedItem={setselectedItem}
      />
      <InvoiceDispute invoiceEntry={selectedItem} onSubmit={() => setRefetchInvoice(true)} />
    </>
  )
}

export default Invoice