How to fetch multiple rows from fire store and display in Data Table --FLUTTER

I have a collection on firestore named "CASHOUT" having fields Random1,2 and 3.

which I am able to fetch and display successfuly in Data table widget

But when I created another document with same fiels

**It throws me an error of

rows.cells.length != columns.length

**

What I'm doing wrong?? Here is the code

            StreamBuilder(
              stream: _firestore.collection('CASHOUT').snapshots(),
              builder: (BuildContext context,
                  AsyncSnapshot<QuerySnapshot> snapshot) {
                if (snapshot.hasError) {
                  return const Text('Something went wrong');
                }

                if (snapshot.connectionState == ConnectionState.waiting) {
                  return const Text("Loading");
                }

                if (snapshot.hasData) {
                  List<DataCell> displayedDataCell = [];

                  for (var item in snapshot.data!.docs) {
                    displayedDataCell.add(
                      DataCell(
                        Text(
                          item['RANDOM1'].toString(),
                        ),
                      ),
                    );
                    displayedDataCell.add(
                      DataCell(
                        Text(
                          item['RANDOM2'].toString(),
                        ),
                      ),
                    );
                    displayedDataCell.add(
                      DataCell(
                        Text(
                          item['RANDOM3'].toString(),
                        ),
                      ),
                    );
                  }

                  return FittedBox(
                    child: DataTable(
                      columns: const <DataColumn>[
                        DataColumn(
                          label: Text(
                            'Date',
                          ),
                        ),
                        DataColumn(
                          label: Text(
                            'Amount',
                          ),
                        ),
                        DataColumn(
                          label: Text(
                            'Optional Detail',
                          ),
                        ),
                      ],
                      rows: <DataRow>[
                        DataRow(cells: displayedDataCell),
                      ],
                    ),
                  );
                }
                return const CircularProgressIndicator();
              },
            ),

You are getting this error because you are creating one DataRow with 6 items in it's cell and instead you have to create 2 DataRow with 3 cells.

rows: <DataRow>[
  for (int i = 0; i < displayedDataCell.length; i += 3)
    DataRow(cells: [displayedDataCell[i], displayedDataCell[i + 1], displayedDataCell[i + 2]])
],