diff --git a/src/App.js b/src/App.js index 4f0ca6c..def34a0 100644 --- a/src/App.js +++ b/src/App.js @@ -101,7 +101,7 @@ function App() { {/* */} {/* */} {/* */} - {/* */} + {/* */} {/* diff --git a/src/components/ReactTable5/BasicTable.js b/src/components/ReactTable5/BasicTable.js index e8cecf4..3bb9550 100644 --- a/src/components/ReactTable5/BasicTable.js +++ b/src/components/ReactTable5/BasicTable.js @@ -242,118 +242,139 @@ const BasicTable = ({ {/* table LIST */} {activeTab == 0 ? ( <> - - {thead && ( - - {headerGroups.map((headerGroup, index) => ( - - {headerGroup.headers.map((column) => ( - - ))} - - ))} - - )} - {/* filter row */} - {filtering && ( - - {headerGroups.map((headerGroup, index) => ( - - {headerGroup.headers.map((column) => ( - - ))} - - ))} - - )} - - {page.map((row, idx) => { - prepareRow(row); - return ( - - - {row.cells.map((cell, index) => { - // console.log(row.cells); - return ( - - ); - })} + {thead && ( + + {headerGroups.map((headerGroup, index) => ( + + {headerGroup.headers.map((column) => ( + + ))} + + ))} + + )} + {/* filter row */} + {filtering && ( + + {headerGroups.map((headerGroup, index) => ( + + {headerGroup.headers.map((column) => ( + + ))} - {row.isExpanded ? ( - - + )} + + {page.map((row, idx) => { + prepareRow(row); + return ( + + + {row.cells.map((cell, index) => { + // console.log(row.cells); + return ( + + ); + })} + + {row.isExpanded ? ( + + - - ) : null} - - ); - })} - -
- {column.render("Header")} - - {column.isSorted - ? column.isSortedDesc - ? " 🔽" - : " 🔼" - : ""} - -
- {column.canFilter ? column.render("Filter") : null} -
- {cell.render("Cell")} -
+ {column.render("Header")} + + {column.isSorted + ? column.isSortedDesc + ? " 🔽" + : " 🔼" + : ""} + +
+ {column.canFilter ? column.render("Filter") : null} +
- {/* {RenderRowSubComponent({ + ))} +
+ {cell.render("Cell")} +
+ {/* {RenderRowSubComponent({ row: row.original, columns, addTab, })} */} - {/* {RenderRowSubComponent({ row: row.values })} */} - - {/* {console.log(row.original)} */} -
+ {/* {RenderRowSubComponent({ row: row.values })} */} + + {/* {console.log(row.original)} */} + + + ) : null} + + ); + })} + + + )} + + {/* GRID LIST */} + {activeList === true && ( +
+ {data.map((item, index) => ( +
+ +

{item.fileName}

+ + {item.fileSize} + +
+ ))} +
+ )} {/* bottom table */} )} - {/* GRID LIST */} - {activeList === true && ( -
- {data.map((item, index) => ( -
- -

{item.fileName}

- - {item.fileSize} - -
- ))} -
- )} ); };