Use reflex for Python full-stack #83

Closed
opened 2026-02-15 19:15:44 -05:00 by yindo · 7 comments
Owner

Originally created by @marcusschiesser on GitHub (Oct 14, 2024).

Originally assigned to: @marcusschiesser on GitHub.

Originally created by @marcusschiesser on GitHub (Oct 14, 2024). Originally assigned to: @marcusschiesser on GitHub.
yindo closed this issue 2026-02-15 19:15:44 -05:00
Author
Owner

@marcusschiesser commented on GitHub (Oct 15, 2024):

could be based on https://github.com/reflex-dev/reflex-examples/pull/269

@marcusschiesser commented on GitHub (Oct 15, 2024): could be based on https://github.com/reflex-dev/reflex-examples/pull/269
Author
Owner

@elviskahoro commented on GitHub (Oct 16, 2024):

@marcusschiesser this might be better:
https://github.com/reflex-dev/reflex-llamaindex-template

Still have a bunch of features I want to add to the chat app

@elviskahoro commented on GitHub (Oct 16, 2024): @marcusschiesser this might be better: https://github.com/reflex-dev/reflex-llamaindex-template Still have a bunch of features I want to add to the chat app
Author
Owner

@marcusschiesser commented on GitHub (Oct 17, 2024):

@elviskahoro thanks for the input! Our goal is to have the Reflex template as similar to the NextJS template as possible, so we will first extract some UI components from the NextJS template: https://github.com/run-llama/create-llama/issues/382

Then, we can use them in our upcoming Reflex template. So, the structure of our Reflex template will be based on your code, but we will use the chat components of https://github.com/run-llama/create-llama/issues/382.

You might even consider using them yourself, as they have a lot of features, e.g. widgets for LLM tools, image and document uploads and viewers, etc.

@marcusschiesser commented on GitHub (Oct 17, 2024): @elviskahoro thanks for the input! Our goal is to have the Reflex template as similar to the NextJS template as possible, so we will first extract some UI components from the NextJS template: https://github.com/run-llama/create-llama/issues/382 Then, we can use them in our upcoming Reflex template. So, the structure of our Reflex template will be based on your code, but we will use the chat components of https://github.com/run-llama/create-llama/issues/382. You might even consider using them yourself, as they have a lot of features, e.g. widgets for LLM tools, image and document uploads and viewers, etc.
Author
Owner

@marcusschiesser commented on GitHub (Oct 29, 2024):

@elviskahoro I tried using our chat-ui components in your chat example (just the chat messages for the start), see https://github.com/reflex-dev/reflex-examples/pull/278

I am not sure how to use object parameters in rx.Component, so I guess, that's why I am running in this error below. Would be great if you can have a look.

Traceback (most recent call last):
  File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/bin/reflex", line 8, in <module>
    sys.exit(cli())
             ^^^^^
  File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/typer/main.py", line 338, in __call__
    raise e
  File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/typer/main.py", line 321, in __call__
    return get_command(self)(*args, **kwargs)
           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/click/core.py", line 1157, in __call__
    return self.main(*args, **kwargs)
           ^^^^^^^^^^^^^^^^^^^^^^^^^^
  File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/typer/core.py", line 728, in main
    return _main(
           ^^^^^^
  File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/typer/core.py", line 197, in _main
    rv = self.invoke(ctx)
         ^^^^^^^^^^^^^^^^
  File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/click/core.py", line 1688, in invoke
    return _process_result(sub_ctx.command.invoke(sub_ctx))
                           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/click/core.py", line 1434, in invoke
    return ctx.invoke(self.callback, **ctx.params)
           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/click/core.py", line 783, in invoke
    return __callback(*args, **kwargs)
           ^^^^^^^^^^^^^^^^^^^^^^^^^^^
  File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/typer/main.py", line 703, in wrapper
    return callback(**use_params)
           ^^^^^^^^^^^^^^^^^^^^^^
  File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/reflex/reflex.py", line 295, in run
    _run(env, frontend, backend, frontend_port, backend_port, backend_host, loglevel)
  File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/reflex/reflex.py", line 210, in _run
    prerequisites.get_compiled_app()
  File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/reflex/utils/prerequisites.py", line 312, in get_compiled_app
    app_module = get_app(reload=reload)
                 ^^^^^^^^^^^^^^^^^^^^^^
  File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/reflex/utils/prerequisites.py", line 285, in get_app
    app = __import__(module, fromlist=(constants.CompileVars.APP,))
          ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  File "/Users/marcus/code/llamaindex/reflex-examples/chat_v2/chat_v2/chat_v2.py", line 12, in <module>
    component=chat_page(
              ^^^^^^^^^^
  File "/Users/marcus/code/llamaindex/reflex-examples/chat_v2/chat_v2/page_chat/chat_page.py", line 49, in chat_page
    return _chat_box(
           ^^^^^^^^^^
  File "/Users/marcus/code/llamaindex/reflex-examples/chat_v2/chat_v2/page_chat/chat_page.py", line 25, in _chat_box
    chat_body(
  File "/Users/marcus/code/llamaindex/reflex-examples/chat_v2/chat_v2/page_chat/chat_body.py", line 120, in chat_body
    rx.foreach(
  File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/reflex/components/core/foreach.py", line 75, in create
    component.children = [component._render().render_component()]
                          ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/reflex/components/tags/iter_tag.py", line 135, in render_component
    component = self.render_fn(arg)
                ^^^^^^^^^^^^^^^^^^^
  File "/Users/marcus/code/llamaindex/reflex-examples/chat_v2/chat_v2/page_chat/chat_body.py", line 101, in render_chat_interaction
    message=Message(
            ^^^^^^^^
  File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/pydantic/v1/main.py", line 341, in __init__
    raise validation_error
pydantic.v1.error_wrappers.ValidationError: 1 validation error for Message
content
  str type expected (type=type_error.str)
@marcusschiesser commented on GitHub (Oct 29, 2024): @elviskahoro I tried using our chat-ui components in your chat example (just the chat messages for the start), see https://github.com/reflex-dev/reflex-examples/pull/278 I am not sure how to use object parameters in `rx.Component`, so I guess, that's why I am running in this error below. Would be great if you can have a look. ``` Traceback (most recent call last): File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/bin/reflex", line 8, in <module> sys.exit(cli()) ^^^^^ File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/typer/main.py", line 338, in __call__ raise e File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/typer/main.py", line 321, in __call__ return get_command(self)(*args, **kwargs) ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/click/core.py", line 1157, in __call__ return self.main(*args, **kwargs) ^^^^^^^^^^^^^^^^^^^^^^^^^^ File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/typer/core.py", line 728, in main return _main( ^^^^^^ File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/typer/core.py", line 197, in _main rv = self.invoke(ctx) ^^^^^^^^^^^^^^^^ File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/click/core.py", line 1688, in invoke return _process_result(sub_ctx.command.invoke(sub_ctx)) ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/click/core.py", line 1434, in invoke return ctx.invoke(self.callback, **ctx.params) ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/click/core.py", line 783, in invoke return __callback(*args, **kwargs) ^^^^^^^^^^^^^^^^^^^^^^^^^^^ File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/typer/main.py", line 703, in wrapper return callback(**use_params) ^^^^^^^^^^^^^^^^^^^^^^ File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/reflex/reflex.py", line 295, in run _run(env, frontend, backend, frontend_port, backend_port, backend_host, loglevel) File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/reflex/reflex.py", line 210, in _run prerequisites.get_compiled_app() File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/reflex/utils/prerequisites.py", line 312, in get_compiled_app app_module = get_app(reload=reload) ^^^^^^^^^^^^^^^^^^^^^^ File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/reflex/utils/prerequisites.py", line 285, in get_app app = __import__(module, fromlist=(constants.CompileVars.APP,)) ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ File "/Users/marcus/code/llamaindex/reflex-examples/chat_v2/chat_v2/chat_v2.py", line 12, in <module> component=chat_page( ^^^^^^^^^^ File "/Users/marcus/code/llamaindex/reflex-examples/chat_v2/chat_v2/page_chat/chat_page.py", line 49, in chat_page return _chat_box( ^^^^^^^^^^ File "/Users/marcus/code/llamaindex/reflex-examples/chat_v2/chat_v2/page_chat/chat_page.py", line 25, in _chat_box chat_body( File "/Users/marcus/code/llamaindex/reflex-examples/chat_v2/chat_v2/page_chat/chat_body.py", line 120, in chat_body rx.foreach( File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/reflex/components/core/foreach.py", line 75, in create component.children = [component._render().render_component()] ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/reflex/components/tags/iter_tag.py", line 135, in render_component component = self.render_fn(arg) ^^^^^^^^^^^^^^^^^^^ File "/Users/marcus/code/llamaindex/reflex-examples/chat_v2/chat_v2/page_chat/chat_body.py", line 101, in render_chat_interaction message=Message( ^^^^^^^^ File "/Users/marcus/Library/Caches/pypoetry/virtualenvs/chat-v2-xv2YwYLc-py3.12/lib/python3.12/site-packages/pydantic/v1/main.py", line 341, in __init__ raise validation_error pydantic.v1.error_wrappers.ValidationError: 1 validation error for Message content str type expected (type=type_error.str) ```
Author
Owner

@marcusschiesser commented on GitHub (Oct 30, 2024):

This issue is solved (it was just caused by pydantic validation).

Then I ran into the issue that my component is importing CSS, so I temporarily removed the CSS in this PR for chat-ui: https://github.com/run-llama/chat-ui/pull/8

When I now use @elviskahoro's chat app (with this updated code: https://github.com/reflex-dev/reflex-examples/pull/278/files) and use bun link to link the local code from my PR: https://github.com/run-llama/chat-ui/pull/8 into Reflex's .web directory

Then the app is rendered:
Image

but if i enter some text the rendering of the chat-ui component is triggered and I am getting this error:
Image

This doesn't happen in pure React: If you use the ChatMessage standalone a ChatMessageProvider is wrapped, see https://github.com/run-llama/chat-ui/blob/2e7a19e216aa0cccc734c414551e244fba2e1373/packages/chat-ui/src/chat/chat-message.tsx#L53

The first error in the console log is actually:

chat-message.js:11 Warning: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app
See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.

My best guess is that we're having two react versions - chat-ui has react as peerDepedency

Maybe bun link is not working correctly?

@marcusschiesser commented on GitHub (Oct 30, 2024): This issue is solved (it was just caused by pydantic validation). Then I ran into the issue that my component is importing CSS, so I temporarily removed the CSS in this PR for chat-ui: https://github.com/run-llama/chat-ui/pull/8 When I now use @elviskahoro's chat app (with this updated code: https://github.com/reflex-dev/reflex-examples/pull/278/files) and use `bun link` to link the local code from my PR: https://github.com/run-llama/chat-ui/pull/8 into Reflex's `.web` directory Then the app is rendered: ![Image](https://github.com/user-attachments/assets/e674704b-6bca-4069-9e8a-8d1c821a832a) but if i enter some text the rendering of the `chat-ui` component is triggered and I am getting this error: ![Image](https://github.com/user-attachments/assets/1476274d-e31a-4c3c-9306-8edd7c5a6046) This doesn't happen in pure React: If you use the `ChatMessage` standalone a `ChatMessageProvider` is wrapped, see https://github.com/run-llama/chat-ui/blob/2e7a19e216aa0cccc734c414551e244fba2e1373/packages/chat-ui/src/chat/chat-message.tsx#L53 The first error in the console log is actually: ``` chat-message.js:11 Warning: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons: 1. You might have mismatching versions of React and the renderer (such as React DOM) 2. You might be breaking the Rules of Hooks 3. You might have more than one copy of React in the same app See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem. ``` My best guess is that we're having two react versions - `chat-ui` has `react` as `peerDepedency` Maybe `bun link` is not working correctly?
Author
Owner

@marcusschiesser commented on GitHub (Nov 4, 2024):

Blocked by the following error using chat-ui 0.0.5:

Image

@marcusschiesser commented on GitHub (Nov 4, 2024): Blocked by the following error using `chat-ui` 0.0.5: ![Image](https://github.com/user-attachments/assets/0175a422-3324-4cea-9ed3-1586df9183d0)
Author
Owner

@marcusschiesser commented on GitHub (Nov 17, 2024):

chat-ui is now working with Reflex, but we will use the approach in #421 instead for greater flexibility

@marcusschiesser commented on GitHub (Nov 17, 2024): chat-ui is now working with Reflex, but we will use the approach in #421 instead for greater flexibility
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: run-llama/create-llama#83