0xFableOrg / 0xFable

A fully on-chain trading card game. There will be elves, wizards & shit. Drama and broken friendships also.
https://twitter.com/0xFableGame
BSD 3-Clause Clear License
103 stars 35 forks source link

Use `shadcn/ui` as the primary component library for the frontend. #104

Closed ultraviolet10 closed 5 months ago

ultraviolet10 commented 6 months ago

Refers to #99. daisyui has been removed from the necessary package files.

New components have been copied from the shadcn docs (button, navigation-menu, dialog, input).

Only necessary radix-ui components have been installed as instructed by the docs. Upon successful review, will remove the modal.tsx and ModalController files, since those aren't being used any longer.

Added new font and new spinner svg as well. ✨

norswap commented 6 months ago

This error is displayed: Warning: validateDOMNesting(...): %s cannot appear as a descendant of <%s>.%s both on Firefox and Chrome. I thought it might be caused by the remaining log statement, but that doesn't seem to be the case now that it's gone.

Sadly, this is mangled by my console.error replacements (that don't replace %s but it's basically a dom nesting error.

I disabled the filtering (by commenting the line in setup.ts) and it gives: <p> cannot appear as a descendant of <p> as well as <div> cannot appear as a descendant of <p>.

norswap commented 6 months ago

Another feature that got lost is that the code would force opening the correct modal depending on your in-game state, e.g. if you've joined a game or created a game it would open the corresponding modal (because you can't be joining multiple games at once, trying to create a game while being joined in another would fail).

ultraviolet10 commented 6 months ago

Another feature that got lost is that the code would force opening the correct modal depending on your in-game state, e.g. if you've joined a game or created a game it would open the corresponding modal (because you can't be joining multiple games at once, trying to create a game while being joined in another would fail).

if you have joined a game, and refresh the tab and try to create another one, it shows the Game In Progress modal and navigates to /play.

norswap commented 6 months ago

Another feature that got lost is that the code would force opening the correct modal depending on your in-game state, e.g. if you've joined a game or created a game it would open the corresponding modal (because you can't be joining multiple games at once, trying to create a game while being joined in another would fail).

if you have joined a game, and refresh the tab and try to create another one, it shows the Game In Progress modal and navigates to /play.

This only works once the game is started.

If you have created a game in reload, the createGameModal doesn't pop up.

Similarly, if you have joined a game but the game hasn't started yet, the joinGameModal doesn't pop up.

These were behaviours that were present in the older versions. You can lookup there, there was a value being computed that was passed to the modals to determine whether they'd be initially open or not (I think it might have been a call to the controller in useEffect). I'm not sure how the shadn modal works but it should be possible to either passion a parameter that determines whether the modal is initial open or not, or to call some js to open it in a useEffect.

norswap commented 5 months ago

This error is displayed: Warning: validateDOMNesting(...): %s cannot appear as a descendant of <%s>.%s both on Firefox and Chrome. I thought it might be caused by the remaining log statement, but that doesn't seem to be the case now that it's gone.

Sadly, this is mangled by my console.error replacements (that don't replace %s but it's basically a dom nesting error.

I disabled the filtering (by commenting the line in setup.ts) and it gives: <p> cannot appear as a descendant of <p> as well as <div> cannot appear as a descendant of <p>.

It seems to be coming from here: https://www.npmjs.com/package/@next/react-dev-overlay

Let's investigate this later, I'll open an issue for it.