How to use a React hook instead of a Component in Reflex #2621
scottpersinger
started this conversation in
General
Replies: 1 comment
-
Is that example code supposed to be inside a component? At any rate, override class GoogleLoginButton(rx.chakra.Button):
@classmethod
def create(cls, **props):
return super().create("Sign in with Google 🚀", **props)
def _get_imports(self) -> rx.utils.imports.ImportDict:
return rx.utils.imports.merge_imports(
super()._get_imports(),
{
"@react-oauth/google": {rx.utils.imports.ImportVar(tag="useGoogleLogin")}
},
)
def _get_hooks(self) -> str | None:
return """
const login = useGoogleLogin({
onSuccess: codeResponse => %s(codeResponse),
flow: 'auth-code',
});""" % self.event_triggers["on_success"]
def _render(self):
"""Remove the onSuccess prop so that it doesn't try to render to the DOM."""
tag = super()._render()
tag.remove_props("onSuccess")
tag.add_props(on_click="() => login()")
return tag
def get_event_triggers(self):
return {"on_success": lambda data: [data]} The problem is that this doesn't work inside an |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
It seems that the @react-oauth/google supports the Google Authorization code flow but only via a React hook, it's not built into the component. So the example in JS says:
I am wondering if it's possible to use this style in Reflex, as the examples all point to wrapping a full Component:
Beta Was this translation helpful? Give feedback.
All reactions