Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add callback method from CustomSeed to Bracket #10

Open
orieuxe opened this issue Aug 23, 2021 · 4 comments
Open

Add callback method from CustomSeed to Bracket #10

orieuxe opened this issue Aug 23, 2021 · 4 comments

Comments

@orieuxe
Copy link

orieuxe commented Aug 23, 2021

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.
image

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
Copy link
Contributor

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
Copy link
Author

orieuxe commented Aug 24, 2021

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
Copy link
Owner

mohux commented Aug 25, 2021

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
Copy link

humarkx commented Jan 13, 2022

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants