diff --git a/src/components/Table/index.js b/src/components/Table/index.js
index 16e9c088..8b394d82 100644
--- a/src/components/Table/index.js
+++ b/src/components/Table/index.js
@@ -49,8 +49,10 @@ const Table = () => {
}
const difficultyMap = { Easy: 0, Medium: 0, Hard: 0 };
+ const totalDifficultyCount = { Easy: 0, Medium: 0, Hard: 0 };
for (let i = 0; i < data.length; i += 1) {
difficultyMap[data[i].difficulty] += checkedList[data[i].id];
+ totalDifficultyCount[data[i].difficulty] += 1;
}
const [difficultyCount, setDifficultyCount] = useState(difficultyMap);
@@ -67,9 +69,6 @@ const Table = () => {
window.localStorage.setItem('showPatterns', JSON.stringify(showPatterns));
}, [showPatterns]);
- /* To view the number of question solved by difficulty */
- console.log(difficultyCount);
-
const defaultColumn = React.useMemo(
() => ({
Filter: DefaultColumnFilter,
@@ -85,6 +84,33 @@ const Table = () => {
Header: 'Leetcode Patterns',
columns: [
{
+ Header: () => {
+ return (
+
+
+
+ {difficultyCount.Easy}/{totalDifficultyCount.Easy}
+
+
+
+
+ {difficultyCount.Medium}/{totalDifficultyCount.Medium}
+
+
+
+
+ {difficultyCount.Hard}/{totalDifficultyCount.Hard}
+
+
+
+ );
+ },
id: 'Checkbox',
Cell: cellInfo => {
return (
@@ -97,12 +123,11 @@ const Table = () => {
];
const additive = checked[cellInfo.row.original.id] ? 1 : -1;
- setDifficultyCount(prevState => ({
- ...prevState,
- [cellInfo.row.original.difficulty]:
- prevState[cellInfo.row.original.difficulty] + additive,
- }));
+ difficultyCount[
+ cellInfo.row.original.difficulty
+ ] += additive;
+ setDifficultyCount(difficultyCount);
setChecked([...checked]);
}}
/>
@@ -110,25 +135,23 @@ const Table = () => {
},
},
{
- id: 'Premium',
+ Header: 'Name',
+ accessor: 'name',
Cell: cellInfo => {
return (
{cellInfo.row.original.premium ? (
-
+ {' '}
) : (
''
)}
+ {cellInfo.row.original.name}
);
},
},
- {
- Header: 'Name',
- accessor: 'name',
- },
{
Header: 'URL',
accessor: 'url',