From c1b186927c58eb80c7974d4db063dca8cd8c5112 Mon Sep 17 00:00:00 2001 From: mahdi Date: Mon, 7 Feb 2022 10:58:40 +0330 Subject: [PATCH] update --- src/components/ReactTable3/BasicTable.js | 2 +- src/components/ReactTable3/FilteringTable.js | 99 ---------------- src/components/ReactTable3/PaginationTable.js | 107 ------------------ src/components/ReactTable3/SortingTable.js | 88 -------------- src/components/ReactTable3/index.js | 29 +---- 5 files changed, 7 insertions(+), 318 deletions(-) delete mode 100644 src/components/ReactTable3/FilteringTable.js delete mode 100644 src/components/ReactTable3/PaginationTable.js delete mode 100644 src/components/ReactTable3/SortingTable.js diff --git a/src/components/ReactTable3/BasicTable.js b/src/components/ReactTable3/BasicTable.js index 9ffc978..4285040 100644 --- a/src/components/ReactTable3/BasicTable.js +++ b/src/components/ReactTable3/BasicTable.js @@ -86,7 +86,7 @@ const BasicTable = () => { }; const { globalFilter, pageIndex, pageSize } = state; - const firstPageRows = rows.slice(0, 10); + // const firstPageRows = rows.slice(0, 10); return ( <> diff --git a/src/components/ReactTable3/FilteringTable.js b/src/components/ReactTable3/FilteringTable.js deleted file mode 100644 index ee56610..0000000 --- a/src/components/ReactTable3/FilteringTable.js +++ /dev/null @@ -1,99 +0,0 @@ -// not using - -import React, {useMemo} from 'react'; -import {useTable, useSortBy, useGlobalFilter} from 'react-table'; -import {COLUMNS} from './columns'; -import MOCK_DATA from './MOCK_DATA.json'; - - -const FilteringTable = () => { - - - const columns = React.useMemo(() => COLUMNS, []) - const data = useMemo(() => MOCK_DATA,[]) - - const { - getTableProps, - getTableBodyProps, - headerGroups, - footerGroups, - rows, - prepareRow, - state, - setGlobalFilter, - } = useTable({ - columns, - data, - }, - useSortBy, - useGlobalFilter - ) - - - const { globalFilter } = state - - return ( - - <> - - - - - - - {headerGroups.map((headerGroup) => ( - - {headerGroup.headers.map((column) => ( - - ))} - - ))} - - - - {rows.map((row) => { - prepareRow(row) - return( - - {row.cells.map((cell) => { - return - })} - - ) - })} - - - - { - footerGroups.map(footerGroup => ( - - { - footerGroup.headers.map(column => ( - - )) - } - - )) - } - - -
- {column.render('Header')} - - {column.isSorted ? (column.isSortedDesc ? ' 🔽' : ' 🔼') : ''} - -
- {cell.render('Cell')} -
- { - column.render('Footer') - } -
- - - - ) - -}; - -export default FilteringTable; diff --git a/src/components/ReactTable3/PaginationTable.js b/src/components/ReactTable3/PaginationTable.js deleted file mode 100644 index 31c50fb..0000000 --- a/src/components/ReactTable3/PaginationTable.js +++ /dev/null @@ -1,107 +0,0 @@ -// not using - -import React, {useMemo} from 'react'; - -import {useTable, useSortBy, useGlobalFilter, useFilters} from 'react-table'; - -import {COLUMNS} from './columns'; - -import {GlobalFilter} from './GlobalFilter'; - -import MOCK_DATA from './MOCK_DATA.json'; - -const PaginationTable = () => { - - - const columns = React.useMemo(() => COLUMNS, []) - const data = useMemo(() => MOCK_DATA,[]) - - const { - getTableProps, - getTableBodyProps, - headerGroups, - footerGroups, - rows, - prepareRow, - state, - setGlobalFilter, - } = useTable({ - columns, - data, - }, - useFilters, - useGlobalFilter, - useSortBy, - ) - - - const { globalFilter } = state - - return ( - - <> - - - - - - - {headerGroups.map((headerGroup) => ( - - {headerGroup.headers.map((column) => ( - - ))} - - ))} - - - - {rows.map((row) => { - prepareRow(row) - return( - - {row.cells.map((cell) => { - return - })} - - ) - })} - - - 2 ? 'hidden' : 'block'}`} > - { - footerGroups.map(footerGroup => ( - - { - footerGroup.headers.map(column => ( - - )) - } - - )) - } - - -
- {column.render('Header')} - - {column.isSorted ? (column.isSortedDesc ? ' 🔽' : ' 🔼') : ''} - - {/*
- {column.canFilter ? column.render('Filter') : null } -
*/} -
- {cell.render('Cell')} -
- { - column.render('Footer') - } -
- - - - ) - -}; - -export default PaginationTable; diff --git a/src/components/ReactTable3/SortingTable.js b/src/components/ReactTable3/SortingTable.js deleted file mode 100644 index 6d712bc..0000000 --- a/src/components/ReactTable3/SortingTable.js +++ /dev/null @@ -1,88 +0,0 @@ -// not using - - -import React, {useMemo} from 'react'; -import {useTable, useSortBy} from 'react-table'; -import {COLUMNS} from './columns'; -import MOCK_DATA from './MOCK_DATA.json'; - - -const SortingTable = () => { - - - const columns = React.useMemo(() => COLUMNS, []) - const data = useMemo(() => MOCK_DATA,[]) - - const { - getTableProps, - getTableBodyProps, - headerGroups, - footerGroups, - rows, - prepareRow, - } = useTable({ - columns, - data, - }, - useSortBy - ) - - - return ( - - - - - {headerGroups.map((headerGroup) => ( - - {headerGroup.headers.map((column) => ( - - ))} - - ))} - - - - {rows.map((row) => { - prepareRow(row) - return( - - {row.cells.map((cell) => { - return - })} - - ) - })} - - - - { - footerGroups.map(footerGroup => ( - - { - footerGroup.headers.map(column => ( - - )) - } - - )) - } - - -
- {column.render('Header')} - - {column.isSorted ? (column.isSortedDesc ? ' 🔽' : ' 🔼') : ''} - -
- {cell.render('Cell')} -
- { - column.render('Footer') - } -
- ) - -}; - -export default SortingTable; diff --git a/src/components/ReactTable3/index.js b/src/components/ReactTable3/index.js index 1207b32..1de6ba5 100644 --- a/src/components/ReactTable3/index.js +++ b/src/components/ReactTable3/index.js @@ -1,30 +1,13 @@ -import React from 'react'; -import BasicTable from './BasicTable'; +import React from "react"; +import BasicTable from "./BasicTable"; const ReactTable3 = () => { return ( -
-
-
-
-
-
- - - -
-
-
-
-
+
+ + mahdi
- -) + ); }; export default ReactTable3; - - - - -