Added base structure of tasks manager

.eslintcache

@@ -0,0 +1 @@
+[{"D:\\Tests\\it2g\\src\\index.js":"1","D:\\Tests\\it2g\\src\\reportWebVitals.js":"2","D:\\Tests\\it2g\\src\\App.js":"3","D:\\Tests\\it2g\\src\\components\\Filter.jsx":"4","D:\\Tests\\it2g\\src\\store\\store.js":"5","D:\\Tests\\it2g\\src\\store\\param.js":"6","D:\\Tests\\it2g\\src\\components\\VisibleItemsList.jsx":"7","D:\\Tests\\it2g\\src\\components\\TaskPage.jsx":"8","D:\\Tests\\it2g\\src\\store\\tasks.js":"9","D:\\Tests\\it2g\\src\\components\\CreateForm.jsx":"10"},{"size":469,"mtime":1607881879820,"results":"11","hashOfConfig":"12"},{"size":362,"mtime":499162500000,"results":"13","hashOfConfig":"12"},{"size":670,"mtime":1607887683816,"results":"14","hashOfConfig":"12"},{"size":977,"mtime":1607881416147,"results":"15","hashOfConfig":"12"},{"size":470,"mtime":1607887388730,"results":"16","hashOfConfig":"12"},{"size":349,"mtime":1607873286955,"results":"17","hashOfConfig":"12"},{"size":2822,"mtime":1607892038703,"results":"18","hashOfConfig":"12"},{"size":652,"mtime":1607887357813,"results":"19","hashOfConfig":"12"},{"size":1978,"mtime":1607892097039,"results":"20","hashOfConfig":"12"},{"size":1276,"mtime":1607887629631,"results":"21","hashOfConfig":"12"},{"filePath":"22","messages":"23","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"24"},"6jg6r",{"filePath":"25","messages":"26","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"24"},{"filePath":"27","messages":"28","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"24"},{"filePath":"29","messages":"30","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"24"},{"filePath":"31","messages":"32","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"24"},{"filePath":"33","messages":"34","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"24"},{"filePath":"35","messages":"36","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"37","usedDeprecatedRules":"24"},{"filePath":"38","messages":"39","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"40"},{"filePath":"41","messages":"42","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"24"},{"filePath":"43","messages":"44","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"24"},"D:\\Tests\\it2g\\src\\index.js",[],["45","46"],"D:\\Tests\\it2g\\src\\reportWebVitals.js",[],"D:\\Tests\\it2g\\src\\App.js",[],"D:\\Tests\\it2g\\src\\components\\Filter.jsx",[],"D:\\Tests\\it2g\\src\\store\\store.js",[],"D:\\Tests\\it2g\\src\\store\\param.js",[],"D:\\Tests\\it2g\\src\\components\\VisibleItemsList.jsx",["47"],"import React, { useEffect, useState } from \"react\";\r\nimport { useSelector, useDispatch } from \"react-redux\";\r\nimport { getTasks, requestTasks, deleteTask, updateTask } from \"../store/tasks\";\r\nimport FadeLoader from \"react-spinners/FadeLoader\";\r\nimport { Container, Row, Col } from \"bootstrap-4-react\";\r\nimport { Route, Switch, Redirect, Link } from \"react-router-dom\";\r\nimport TaskPage from \"./TaskPage\";\r\nimport { getParam } from \"../store/param\";\r\n\r\nconst VisibleTodoList = () => {\r\n  const dispatch = useDispatch();\r\n  const [isLoading, setIsLoading] = useState(false);\r\n  const tasks = useSelector(getTasks);\r\n  const { filter } = useSelector(getParam);\r\n\r\n  let filteredTasks = tasks.items;\r\n\r\n  const loadTasks = async () => {\r\n    setIsLoading(true);\r\n    await dispatch(requestTasks);\r\n    setIsLoading(false);\r\n  };\r\n\r\n  useEffect(() => {\r\n    loadTasks();\r\n  }, []);\r\n\r\n  const handleClick = (id) => {\r\n    dispatch(deleteTask(id));\r\n  };\r\n\r\n  const handleClickCompleted = (id, completed) => {\r\n    dispatch(updateTask(id, !completed));\r\n  };\r\n\r\n  if (filter === \"All\") filteredTasks = tasks.items;\r\n  else\r\n    filteredTasks = tasks.items.filter((item) =>\r\n      filter === \"Active\" ? !item.completed : item.completed\r\n    );\r\n\r\n  if (!filteredTasks)\r\n    return (\r\n      <div className=\"data-loading container\">\r\n        <span>Данные загружаются</span>\r\n        <FadeLoader loading={isLoading} />\r\n      </div>\r\n    );\r\n\r\n  return (\r\n    <div className=\"main__visible-tasks-list\">\r\n      <Switch>\r\n        <Route exact path=\"/\" component=\"App\">\r\n          <Container>\r\n            {filteredTasks\r\n              .map((task, index) => (\r\n                <Row\r\n                  key={index}\r\n                  style={{\r\n                    textDecoration: task.completed ? \"line-through\" : \"none\",\r\n                  }}\r\n                >\r\n                  <Col\r\n                    className=\"tasks-list__title\"\r\n                    onClick={() =>\r\n                      handleClickCompleted(task.id, task.completed)\r\n                    }\r\n                  >\r\n                    {task.title}\r\n                  </Col>\r\n                  <Col col=\"2\">\r\n                    <Link to={`/tasks/${task.id}`}>More details...</Link>\r\n                  </Col>\r\n                  <Col\r\n                    col=\"2\"\r\n                    className=\"tasks-list__delete\"\r\n                    onClick={() => handleClick(task.id)}\r\n                  >\r\n                    Delete\r\n                  </Col>\r\n                </Row>\r\n              ))\r\n              .reverse()}\r\n          </Container>\r\n        </Route>\r\n        <Route path=\"/tasks/:id\">\r\n          <TaskPage />\r\n        </Route>\r\n        <Redirect from=\"/\" to=\"/\" />\r\n      </Switch>\r\n    </div>\r\n  );\r\n};\r\n\r\nexport default VisibleTodoList;\r\n","D:\\Tests\\it2g\\src\\components\\TaskPage.jsx",[],["48","49"],"D:\\Tests\\it2g\\src\\store\\tasks.js",[],"D:\\Tests\\it2g\\src\\components\\CreateForm.jsx",[],{"ruleId":"50","replacedBy":"51"},{"ruleId":"52","replacedBy":"53"},{"ruleId":"54","severity":1,"message":"55","line":26,"column":6,"nodeType":"56","endLine":26,"endColumn":8,"suggestions":"57"},{"ruleId":"50","replacedBy":"58"},{"ruleId":"52","replacedBy":"59"},"no-native-reassign",["60"],"no-negated-in-lhs",["61"],"react-hooks/exhaustive-deps","React Hook useEffect has a missing dependency: 'loadTasks'. Either include it or remove the dependency array.","ArrayExpression",["62"],["60"],["61"],"no-global-assign","no-unsafe-negation",{"desc":"63","fix":"64"},"Update the dependencies array to be: [loadTasks]",{"range":"65","text":"66"},[872,874],"[loadTasks]"]

.gitignore

@@ -0,0 +1,23 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*

README.md

@@ -0,0 +1,11 @@
+# This is a test task for creating a list of tasks.
+
+You can:
+
+- add a task
+- delete task
+- mark the completion of the task (the task will be crossed out)
+- view a detailed description of the task
+- filter tasks ("show all", "active", "completed")
+
+This page is integrated with API based on https://www.mockapi.io/