Hey all. First of all I want to say I'm so happy I found this project. Really amazing stuff. I have a stupid question. I am trying to implement SuperTokens into my React app. When I navigate to the /auth endpoint, the formatting seems like it is not configured correctly. Is this by design?

Hey @d3adb0y do you use emotion in your project?

Nope

Are you using vue?

i am using React on the frontend. I don't believe I have any dependencies using emotion

Hmm. What does the browser console log say?

nothing logged in the console

perhaps @porcellus can help here.

hi

howdy

yeah, and I think they make good points. I don't like the kitchen-sink approach of CRA either.

its definitely much faster for starting the dev server 🙂

can you try disabling the shadow dom? https://supertokens.com/docs/emailpassword/common-customizations/styling/shadow-dom

that did the trick indeed

happy to help 🙂 I think you have something installed that messes with emotion

wouldnt surprise me. i committed to building a React frontend for the client now I'm trying to speed run relearning it lol.

sure

in all the react examples provided, the route element is wrapped with the SessionAuth component

Sure. I'd recommend nested routing. How this works exactly depends on the router you use, but in general, you can have something like:

<Router>
  <Route path="/about" element={<div>....</div>} />
  <Route path="*" element={<SessionAuth>
      <Router> 
        <Route ... />
      </Router>
    </SessionAuth>} />
</Router>

okay that makes sense....sorry like I said I am a react nooblet

I'd have to think about this a bit more about how to add a catch-all in this case though

yeah i think you're right. i have seen other react auth frameworks provide something similar. although i understand the balance of trying to keep the framework flexible as well.

yup. the issue with that we would be the dependent on the exact router which is something we don't want to do.