efficient-indigoE
Refine•3y ago•
18 replies
efficient-indigo

Request for Assistance with useDataGrid

Hello,

I hope this message finds you well. I am reaching out because I am currently facing an issue with the useDataGridhook with DataGridPro in conjunction with other hooks, and I am in need of some guidance and assistance.

To provide some context, I have implemented pagination on the server side, and in order to obtain the total row count, I have been sending a response from the resource that includes an object structured as follows:
{
  data: [all the rows],
  total: totalRowCount
}


Upon receiving this response, I have been destructuring the 'total' and 'data' properties separately, using the following code:
const { data: traceLineData, total: totalTraceLines } = dataGridProps.rows as unknown as RowsData;


Subsequently, in my DataGridPro component, I have utilized the extracted data in the following manner:
<DataGridPro
  {...dataGridProps}
  pagination
  rows={traceLineData || []}
  filterModel={undefined}
  rowCount={rowCountState}
  pageSizeOptions={[25, 50, 100]}
  columns={columns}
  autoHeight
/>

While this approach has served me well so far, I have encountered a limitation with other hooks. Specifically, I am trying to utilize the useExport hook to enable exporting data from the DataGridPro component. However, despite my efforts, the useExport hook does not seem to work within this setup.

Therefore, I am seeking your guidance on alternative strategies to overcome this limitation while still being able to keep track of the total number of rows. One possibility I have considered is maintaining a separate state and creating a dedicated endpoint solely for retrieving the total count. However, this approach appears to be somewhat tedious. I would greatly appreciate it if you could suggest any alternative ideas or best practices that could help me resolve this issue more efficiently.
Was this page helpful?