example_complicated.jsx

// CountingButton.js
import React, { useState, useEffect } from "react"

const CountingButton = ({ onClick, count }) => {
    const [displayText, setDisplayText] = useState("")

    useEffect(() => {
        setDisplayText(`You clicked me ${count} times!`)
    }, [count, setDisplayText])

    return <button onClick={onClick}>{displayText}</button>
}

export default CountingButton

// someOtherFile.js
import React, { useState, useEffect } from "react"
import CountingButton from "./CountingButton"

const ExampleComponent = () => {
    const [count, setCount] = useState(0)
    const increaseCount = () => setCount(count+1)
    return <CountingButton onClick={increaseCount} count={count} />
}