dmc.Button in loading state without background callbacks?

Hey @dansah, interesting question!

Since dash allows duplicate outputs from version 2.9.0, you could do something like that:

import time

import dash
import dash_mantine_components as dmc
from dash import Input, Output, html, dcc
from dash_iconify import DashIconify

app = dash.Dash(
    __name__,
)

app.layout = html.Div([
    dmc.Button(
        "Connect to Database",
        id='btn',
        leftIcon=[DashIconify(icon="fluent:database-plug-connected-20-filled")],
    ),
    dcc.Store(id='store')
])


@app.callback(
    Output('btn', 'leftIcon', allow_duplicate=True),
    Input('btn', 'n_clicks'),
    prevent_initial_call=True
)
def update(_):
    return dcc.Loading()


@app.callback(
    Output('store', 'data'),
    Output('btn', 'leftIcon'),
    Input('btn', 'leftIcon'),
    prevent_initial_call=True
)
def update(_):
    time.sleep(3)
    return {}, [DashIconify(icon="fluent:database-plug-connected-20-filled")]


if __name__ == "__main__":
    app.run_server(debug=True)

btn

mred dupout

3 Likes