Material Table

js

            <MaterialTable
              icons={tableIcons}
              options={{
                search: false,
              }}
              columns={columns}
              data={data}
              components={{
                Toolbar: props => (<></>),
              }}              
              options={{
                actionsColumnIndex: -1,        
              }}
                                    
              editable={{
                onRowAdd: newData =>
                  new Promise((resolve, reject) => {
                    setTimeout(() => {
                      setData([...data, newData]);
                      
                      resolve();
                    }, 1000)
                  }),
                onRowUpdate: (newData, oldData) =>
                  new Promise((resolve, reject) => {
                    setTimeout(() => {
                      const dataUpdate = [...data];
                      const index = oldData.tableData.id;
                      dataUpdate[index] = newData;
                      setData([...dataUpdate]);

                      resolve();
                    }, 1000)
                  }),
                onRowDelete: oldData =>
                  new Promise((resolve, reject) => {
                    setTimeout(() => {
                      const dataDelete = [...data];
                      const index = oldData.tableData.id;
                      dataDelete.splice(index, 1);
                      setData([...dataDelete]);
                      
                      resolve()
                    }, 1000)
                  }),
              }}
              components={{
                Action: props => (
                    <div style={{ display: 'fixed' }}>
                        <MTableAction {...props} />
                    </div>
                )
              }}
             
              localization={{
                pagination: {
                  labelDisplayedRows: '{from}-{to} de {count} resultados',
                  labelRowsSelect: 'resultados'
                },
                header: {
                  actions: ''
                },
                body: {
                  emptyDataSourceMessage: 'Nenhum resultado a ser exibido',
                  filterRow: {
                    filterTooltip: 'Filtrar'
                  },
                  editRow: {
                      deleteText: 'Você tem certeza que deseja deletar?',
                      cancelTooltip: 'Cancelar',
                      saveTooltip: 'Salvar'
                  }
                },
                toolbar: {
                  searchPlaceholder: 'Digite sua busca',
                }
            }}
        
            />