diff --git a/src/containers/Tag/Tag.tsx b/src/containers/Tag/Tag.tsx index c1c68c215..b655c0915 100644 --- a/src/containers/Tag/Tag.tsx +++ b/src/containers/Tag/Tag.tsx @@ -1,4 +1,4 @@ -import React, { useState, useEffect } from 'react'; +import React, { useState } from 'react'; import { Redirect } from 'react-router-dom'; import { Formik, Form, Field } from 'formik'; import { Button } from '../../components/UI/Form/Button/Button'; @@ -19,19 +19,37 @@ export interface TagProps { } export const Tag: React.SFC = (props) => { + const languages = useQuery(GET_LANGUAGES, { + onCompleted: (data) => { + setLanguageId(data.languages[0].id); + }, + }); const tagId = props.match.params.id ? props.match.params.id : false; - const { loading, error, data } = useQuery(GET_TAG, { + const { loading, error } = useQuery(GET_TAG, { variables: { id: tagId }, skip: !tagId, + onCompleted: (data) => { + if (tagId && data) { + tag = data.tag.tag; + setLabel(tag.label); + setDescription(tag.description); + setIsActive(tag.isActive); + setIsReserved(tag.isReserved); + setLanguageId(tag.language.id); + } + }, + }); + const [updateTag] = useMutation(UPDATE_TAG, { + onCompleted: () => { + setFormSubmitted(true); + }, }); - const [updateTag] = useMutation(UPDATE_TAG); - const languages = useQuery(GET_LANGUAGES); const [label, setLabel] = useState(''); const [description, setDescription] = useState(''); const [isActive, setIsActive] = useState(false); const [isReserved, setIsReserved] = useState(false); - const [languageId, setLanguageId] = useState(1); + const [languageId, setLanguageId] = useState(''); const [formSubmitted, setFormSubmitted] = useState(false); const [createTag] = useMutation(CREATE_TAG, { @@ -43,25 +61,17 @@ export const Tag: React.SFC = (props) => { data: { tags: tags.tags.concat(createTag.tag) }, }); }, + onCompleted: () => { + setFormSubmitted(true); + }, }); const client = useApolloClient(); let tag: any = null; - useEffect(() => { - if (tagId && data) { - tag = tagId ? data.tag.tag : null; - setLabel(tag.label); - setDescription(tag.description); - setIsActive(tag.isActive); - setIsReserved(tag.isReserved); - setLanguageId(tag.language.id); - } - }, [data]); - if (loading) return ; - if (error) return

Error

; + if (error) return

Error :(

; const saveHandler = (tag: any) => { const payload = { @@ -90,7 +100,6 @@ export const Tag: React.SFC = (props) => { message = 'Tag added successfully!'; } setNotification(client, message); - setFormSubmitted(true); }; const cancelHandler = () => { @@ -152,9 +161,10 @@ export const Tag: React.SFC = (props) => { {({ submitForm }) => (
- {formFields.map((field) => { + {formFields.map((field, index) => { return (