Add callback method from CustomSeed to Bracket

[orieuxe]

trafficstars

Great library !

Use case : If one seed of the bracket is clicked, I would like to display the list of games attached to that match at the right of the page.

I couldn't find a way to pass a setter as prop from the Bracket to my CustomSeed component.

actual code : <Bracket rounds={winnerRounds} renderSeedComponent={CustomSeed} />

what i idealy hoped for :) : <Bracket rounds={winnerRounds} renderSeedComponent={CustomSeed} onSeedClick={(seed) => {}}/>

[mohammadou1]

Hi buddy, thank you so much! Why dont you use onClick inside customSeed component though? Since its just a component you use onClick inside it, plus you can pass any additional data in the seed object

[orieuxe]

Thanks, i know i can put an onClick inside of CustomSeed. But i need the parent component CustomBracket, located in a another file, to receive that event. I ended up using reactn global state management to pass the event inside CustomSeed

const onSeedClicked = () => {
    setGlobal({
	selectedMatch: m,
    })
}

and inside CustomBracket

const [selectedMatch] = useGlobal('selectedMatch')

useEffect(() => {
    //displaying games...
}, [selectedMatch])

Although i'm not very satisfied with this solution, feel free to close this issue

[mohux]

This way it will end up passing onClick prop to CustomSeed coming from Bracket as well, which will end the same result, but ok i might add it in next release to help you more,

Next release will be a breaking change from this one but its gonna take time to do.

[humarkx]

Imo @orieuxe onMouseOver gives better UI, since you don't actually need to click :)