Datatable sort bug

I have a datatable in two different applications that sort where the first row returns the lowest value and then the second+ rows return the (properly sorted) highest values in sorted order. Any ideas why the first row returns against the sort?


import dash
from dash.dependencies import Input, Output, State
import dash_core_components as dcc
import dash_html_components as html
import dash_table as dte
import plotly.graph_objs as go

#datatable layout code:

 dte.DataTable( #main_graph'
                                id='datatable',
                                data = ig_data.to_dict('records'),
                                columns = [{'id': c, 'name': c} for c in ig_data.columns], 
                                page_current=0,
                                page_size=PAGE_SIZE,
                                page_action='custom',
                            
                                sort_action='custom',
                                sort_mode='single',
                                sort_by=[],
                                style_header = {'fontWeight':'bold'},
                                style_cell = {'textAlign': 'left'},
                                style_table = {'maxHeight':'50'},
                                export_format = 'csv',
                                export_headers = 'names',
                                ),

#datatable callback:
# DATATABLE
    
@app.callback(
    Output('datatable', 'data'),
    [Input('fnames', 'value'),
     Input('unames', 'value'),
     Input('titems', 'value'),
     Input('citems', 'value'),
     Input('daterange', 'start_date'),
     Input('daterange','end_date'),
     Input('datatable', "page_current"),
     Input('datatable', "page_size"),
     Input('datatable', 'sort_by')])
def update_table(f, u, t, c, start,end, page_current, page_size, sort_by):

    #filter_dataframe
    dff = filter_dataframe(f, u, t, c, start, end)
    
    #groupby/aggregate
    groups = ['U','T', 'Quarter', 'Year']
    aggs = {'Top Response':'sum','Answered':'sum'}
    
    dte_data = dff.groupby(by=groups, as_index=False).agg(aggs)
    dte_data['Top %'] = dte_data['Top']/dte_data['Answered']
    data = dte_data.sort_values(by='Top %',ascending=False)
    data = percentage_transform(data, 'Top %')
    data['Top %'] = data['Top %'].astype(str)
    data['Top %'] = data['Top %'] + '%'

    if len(sort_by):
        dfff = data.sort_values(
            sort_by[0]['column_id'],
            ascending=sort_by[0]['direction'] == 'asc',
            inplace=False
        )
    else:
        # No sort is applied
        dfff = data

    return dfff.iloc[
        page_current*page_size:(page_current+ 1)*page_size
    ].to_dict('records')
    #data = data.to_json('data.json')
    #return data

screenshot:


note: code and screenshot partially redacted for HIPAA compliance.

three reasons why you should buy plotly pro: support open source, get great support, host your plots and dashboards online