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

[BUG] dash_mantine_components can't be found in dash 2.16.0 #2778

Closed
huong-li-nguyen opened this issue Mar 4, 2024 · 6 comments
Closed

[BUG] dash_mantine_components can't be found in dash 2.16.0 #2778

huong-li-nguyen opened this issue Mar 4, 2024 · 6 comments

Comments

@huong-li-nguyen
Copy link

huong-li-nguyen commented Mar 4, 2024

Describe your context
When running a dash app with the latest dash version, we're currently getting these console errors (see screenshot) and the app doesn't seem to render anymore.

dash                           2.16.0
dash_ag_grid                   31.0.1
dash-bootstrap-components      1.5.0
dash-core-components           2.0.0
dash-daq                       0.5.0
dash-html-components           2.0.0
dash-mantine-components        0.12.1
dash-table                     5.0.0
dash-testing-stub              0.0.2

Not sure if it's a bug on dash side or on the dash_mantine_library, so let me know if I should post the issue on the dash_mantine_library instead!

Thank you! Any help appreciated 🙏

Describe the bug

With the latest dash version our app seems to break. Seems like the dependencies can't be loaded in (see screenshot of the output)

Expected behavior

App running as normally (works with older dash versions)

Screenshots
Output when running the app in debug mode now:

Screenshot 2024-03-04 at 12 12 15

@celia-lm
Copy link

celia-lm commented Mar 4, 2024

Hi @huong-li-nguyen this MRE works for me, can you test it in your environment?

from dash import Dash, dcc, html, Input, Output, callback
import dash_mantine_components as dmc

app = Dash(__name__)
server = app.server  # expose server variable for Procfile

app.layout = dmc.MantineProvider([
    dmc.Button('Click me!', id='button'),
    html.Div('The button has not been clicked yet', id='out')
])

@callback(
    Output('out', 'children'),
    Input('button', 'n_clicks'),
    prevent_initial_call=True
    )
def update_graph(n_clicks):
    return f"Button has been clicked {n_clicks} times"

if __name__ == '__main__':
    app.run(debug=True)

requirements.txt

dash                    2.16.0
dash_ag_grid            31.0.1
dash-core-components    2.0.0
dash-design-kit         1.9.0
dash-html-components    2.0.0
dash-mantine-components 0.12.1
dash-table              5.0.0

I'm going to test progressively adding the other libraries in your requirements.txt.

@huong-li-nguyen
Copy link
Author

huong-li-nguyen commented Mar 4, 2024

Hey @celia-lm - thanks for your swift reply!

It does work without any issues, so it must be something with our environment then 🤔 Thanks for checking though - much appreciated!

We'll try to investigate on our side then. By any chance - do you have a clue from the error message what the potential issue could be?

@T4rk1n
Copy link
Contributor

T4rk1n commented Mar 4, 2024

Could we get the full stacktrace from the browser.

How is the first dmc component inserted in the layout?

@huong-li-nguyen
Copy link
Author

That seems to be the full trace:

error.js:16 Error: dash_mantine_components was not found.
    at Object.resolve (registry.js:15:15)
    at validateProp (dependencies.js:491:34)
    at validateMap (dependencies.js:567:21)
    at validateCallbacksToLayout (dependencies.js:579:5)
    at index.js:32:34
    at index.js:16:1
    at APIController.react.js:216:17
    at batchedUpdates$1 (react-dom@16.v2_16_0m1709562287.14.0.js:21991:14)
    at storeEffect (APIController.react.js:161:10)
    at commitHookEffectListMount (react-dom@16.v2_16_0m1709562287.14.0.js:19866:28)
error @ error.js:16

The first mantine component is added like this - however, I think it's on our side as the below code works fine in a pure Dash app 🤔

html.Div(
            dmc.Switch(
                id="theme_selector",
                checked=True,
                persistence=True,
                persistence_type="session",
                className="toggle-switch",
            ),
            id="settings",
        )

@antonymilne
Copy link

antonymilne commented Mar 4, 2024

I think this should be a MRE. Basically you need to use Dash pages to see the bug I think:

from dash import Dash, dcc, html, Input, Output, callback
import dash_bootstrap_components as dbc

app = Dash(__name__, use_pages=True, pages_folder="")
server = app.server  # expose server variable for Procfile

def layout():
    return html.Div([
    dbc.Button('Click me!', id='button'),
    html.Div('The button has not been clicked yet', id='out')
])

# Error also exists for clientside callbacks
@callback(
    Output('out', 'children'),
    Input('button', 'n_clicks'),
    prevent_initial_call=True
    )
def update_graph(n_clicks):
    return f"Button has been clicked {n_clicks} times"

dash.register_page("page", path="/", layout=layout())

app.layout = dash.page_container

if __name__ == '__main__':
    app.run(debug=True)

As you can see, it's not specific to dash mantine since the above uses dash_boostrap_components and gives the same error, and we have also seen it for AG Grid. dash.html and dash.dcc seem to work ok though.

@huong-li-nguyen
Copy link
Author

Just checked and it got fixed with dash==2.16.1 for us! Thank you @T4rk1n for fixing it so quickly - really appreciate it! 🚀

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

Successfully merging a pull request may close this issue.

4 participants