diff --git a/client/src/apollo/mutations/categories/createCategory.js b/client/src/apollo/mutations/categories/createCategory.js
index 6ccffd6..3b580d6 100644
--- a/client/src/apollo/mutations/categories/createCategory.js
+++ b/client/src/apollo/mutations/categories/createCategory.js
@@ -4,6 +4,7 @@ const CREATE_CATEGORY = gql`
mutation createCategory($title: String!) {
createCategory(title: $title) {
id
+ title
}
}
`
diff --git a/client/src/apollo/mutations/categories/deleteCategoty.js b/client/src/apollo/mutations/categories/deleteCategoty.js
new file mode 100644
index 0000000..c1413f1
--- /dev/null
+++ b/client/src/apollo/mutations/categories/deleteCategoty.js
@@ -0,0 +1,11 @@
+import gql from 'graphql-tag'
+
+const DELETE_CATEGORY = gql`
+ mutation deleteCategory($id: ID!) {
+ deleteCategory(id: $id) {
+ id
+ title
+ }
+ }
+`
+export default DELETE_CATEGORY
\ No newline at end of file
diff --git a/client/src/apollo/mutations/categories/updateCategory.js b/client/src/apollo/mutations/categories/updateCategory.js
index e69de29..75cf88b 100644
--- a/client/src/apollo/mutations/categories/updateCategory.js
+++ b/client/src/apollo/mutations/categories/updateCategory.js
@@ -0,0 +1,11 @@
+import gql from 'graphql-tag'
+
+const UPDATE_CATEGORY = gql`
+ mutation updateCategory($id: ID! $title: String!) {
+ updateCategory(id: $id title: $title) {
+ id
+ title
+ }
+ }
+`
+export default UPDATE_CATEGORY
\ No newline at end of file
diff --git a/client/src/components/Dialogs/Category/DeleteCategoryDialog.js b/client/src/components/Dialogs/Category/DeleteCategoryDialog.js
index a603eee..5bdb3a3 100644
--- a/client/src/components/Dialogs/Category/DeleteCategoryDialog.js
+++ b/client/src/components/Dialogs/Category/DeleteCategoryDialog.js
@@ -1,15 +1,43 @@
import React from 'react';
+import { useHistory } from "react-router-dom";
import useStyles from '../styles'
import WarningIcon from '@material-ui/icons/Warning';
import { useParams } from 'react-router-dom'
import { Button, Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle } from '@material-ui/core'
+import { useMutation } from '@apollo/react-hooks'
+
+import GET_CATEGORIES from '../../../apollo/queries/categories/categories'
+import DELETE_CATEGORY from '../../../apollo/mutations/categories/deleteCategoty'
const DeleteCategoryDialog = ({ isOpenDialog, handleCloseDialog }) => {
const classes = useStyles()
+ const history = useHistory();
const { id } = useParams()
+
+ const [deleteCategory] = useMutation(DELETE_CATEGORY, {
+ update(cache, { data: { deleteCategory } }) {
+ const { categories } = cache.readQuery({ query: GET_CATEGORIES })
+ console.log(categories, deleteCategory)
+ cache.writeQuery({
+ query: GET_CATEGORIES,
+ data: { categories: categories.filter(category => category.id !== deleteCategory.id) }
+ });
+ }
+ })
+
const handleClickDelete = () => {
- console.log('Request on delete category:', id)
- handleCloseDialog()
+ try {
+ deleteCategory({
+ variables: {
+ id
+ }
+ })
+ handleCloseDialog()
+ history.push("/");
+ } catch (error) {
+ console.log(error)
+ }
+
}
return (
diff --git a/client/src/components/Modals/Category/CreateCategoryModal.js b/client/src/components/Modals/Category/CreateCategoryModal.js
index a68bb2b..d04549c 100644
--- a/client/src/components/Modals/Category/CreateCategoryModal.js
+++ b/client/src/components/Modals/Category/CreateCategoryModal.js
@@ -5,12 +5,21 @@ import { useMutation } from '@apollo/react-hooks'
import CategoryIcon from '@material-ui/icons/Category';
import CREATE_CATEGORY from '../../../apollo/mutations/categories/createCategory'
+import GET_CATEGORIES from '../../../apollo/queries/categories/categories';
const CreateCategoryModal = ({ isModalOpen, handleCloseModal }) => {
const classes = useStyles()
- // create catehory mutation
- const [updateTodo] = useMutation(CREATE_CATEGORY)
+ // create category mutation
+ const [createCategory] = useMutation(CREATE_CATEGORY, {
+ update(cache, { data: { createCategory } }) {
+ const { categories } = cache.readQuery({ query: GET_CATEGORIES })
+ cache.writeQuery({
+ query: GET_CATEGORIES,
+ data: { categories: categories.concat([createCategory]) }
+ });
+ }
+ })
const [fieldsData, setFieldsData] = React.useState({
title: '',
@@ -20,7 +29,7 @@ const CreateCategoryModal = ({ isModalOpen, handleCloseModal }) => {
try {
e.preventDefault()
const elements = e.target.elements
- updateTodo({
+ createCategory({
variables: {
title: elements.title.value
}
diff --git a/client/src/components/Modals/Category/UpdateCategoryModal.js b/client/src/components/Modals/Category/UpdateCategoryModal.js
index a54bd96..1713de7 100644
--- a/client/src/components/Modals/Category/UpdateCategoryModal.js
+++ b/client/src/components/Modals/Category/UpdateCategoryModal.js
@@ -1,20 +1,31 @@
import React from 'react';
import useStyles from '../styles'
import { Dialog, DialogContent, DialogTitle, DialogActions, Button, TextField } from '@material-ui/core'
+import { useMutation } from '@apollo/react-hooks'
import EditIcon from '@material-ui/icons/Edit'
+import UPDATE_CATEGORY from '../../../apollo/mutations/categories/updateCategory'
const UpdateCategoryModal = ({ isModalOpen, handleCloseModal, selectedCategory, setSelectedCategory }) => {
const classes = useStyles()
+
+ // update category mutation
+ const [updateCategory] = useMutation(UPDATE_CATEGORY)
+
const handleFormSubmit = e => {
- e.preventDefault()
- const elements = e.target.elements
- const data = {
- id: selectedCategory.id,
- title: elements.title.value
+ try {
+ e.preventDefault()
+ const elements = e.target.elements
+ updateCategory({
+ variables: {
+ id: selectedCategory.id,
+ title: elements.title.value
+ }
+ })
+ handleCloseModal()
+ } catch (error) {
+ console.log(error)
}
- handleCloseModal()
- console.log('Request on update category:', data)
}
const handleFieldChange = e => {
diff --git a/client/src/containers/CategoryContainer/CategoryContainer.js b/client/src/containers/CategoryContainer/CategoryContainer.js
index ccd2467..6825e6e 100644
--- a/client/src/containers/CategoryContainer/CategoryContainer.js
+++ b/client/src/containers/CategoryContainer/CategoryContainer.js
@@ -30,7 +30,6 @@ const Category = () => {
{({ loading, error, data }) => {
if (loading) return
if (error) return `Error! ${error.message}`;
- if (data.category.todos <= 0) return 'В этой категории задач пока что нету'
return (
<>
@@ -43,8 +42,7 @@ const Category = () => {
Сортируйте свои повседневные дела используя категории.
- {/* Здесь берем значение slug из query и передаем полученные данные в prop data !!!! */}
-
+ {data.category.todos <= 0 ? В этой категории задач пока что нету : }
>
)