fohrloop / dash-uploader

The alternative upload component for python Dash applications.
MIT License
144 stars 30 forks source link

Multiple files can be uploaded even with "max_files=1". #12

Closed fohrloop closed 4 years ago

fohrloop commented 4 years ago

Thanks for this awesome uploader project @np-8 .

Also, I've noticed that in addition to the behavior of callback above, it seems that even if du.Upload(max_files=1), I can still upload multiple files. And with the custom setting of width, the percentage progress would be displayed in the wrong place. Here is my example app.py file:

# Run this app with `python app.py` and
# visit http://127.0.0.1:8088/ in your web browser.
import os
from pathlib import Path

import dash
import dash_html_components as html
import dash_uploader as du
from dash.dependencies import Output, Input, State

UPLOAD_FOLDER = os.path.join(os.path.dirname(__file__), "uploads")

app = dash.Dash(
    __name__
)
server = app.server

# configure dash-uploader
du.configure_upload(app, UPLOAD_FOLDER)

def get_upload_component(component_id):
    return du.Upload(
        id=component_id,
        text='Drag and Drop or Select Files',
        text_completed='Ready! ',
        max_file_size=2048,  # 2048 Mb
        max_files=1  # even with 1 max file can still upload multiple
    )

def get_app_layout():
    return html.Div(children=[
        html.H1(
            children='Upload',
            style={
                'textAlign': 'center',
            }
        ),
        html.Div(
            [
                get_upload_component(component_id='dash-uploader'),
                html.Div(id='callback-output'),
            ],
            style={  # wrapper div style
                'textAlign': 'center',
                'width': '600px',
                'display': 'block'
            }
        )
    ], style={'margin': '10px'})

app.layout = get_app_layout

@app.callback(
    Output('callback-output', 'children'),
    [Input('dash-uploader', 'isCompleted')],
    [State('dash-uploader', 'fileNames'),
     State('dash-uploader', 'upload_id')],
)
def get_a_list(is_completed, filenames, upload_id):
    if not is_completed:
        return html.Div(hidden=True)
    out = []
    if filenames is not None:
        if upload_id:
            root_folder = Path(UPLOAD_FOLDER) / upload_id
        else:
            root_folder = Path(UPLOAD_FOLDER)

        for filename in filenames:
            file = root_folder / filename
            out.append(file)
        return html.Ul([html.Li(str(x)) for x in out])

    return html.Div("No Files Uploaded Yet!")

if __name__ == '__main__':
    app.run_server(host='0.0.0.0', port=8088, debug=True)

Originally posted by @20joseph10 in https://github.com/np-8/dash-uploader/issues/5#issuecomment-688547170

fohrloop commented 4 years ago

@20joseph10 Thank you for your bug report!

I created a new issue on this since it's different symptom. Could you confirm your dash-uploader version?

zz-x404 commented 4 years ago

@np-8 Hey there thanks for moving this! The version I'm using is 0.3.1

fohrloop commented 4 years ago

Thanks @20joseph10 , this was actually easy fix. The fix is available at version >= 0.4.1