#7 Make graphql calls more type-safe

redaktions-app/src/components/SignIn.tsx

@@ -42,7 +42,7 @@ const useStyles = makeStyles((theme) => ({
 export default function SignIn() {
   const [email, setEmail] = useState("");
   const [password, setPassword] = useState("");
-  const [login, {loading, error, data}] = useMutation(loginMutation);
+  const [login, {loading, error, data}] = useMutation<LoginMutationResponse, LoginMutationVariables>(loginMutation);
   const history = useHistory();
   const classes = useStyles();
 
@@ -140,6 +140,17 @@ const loginMutation = gql`
     }
   }`
 
+interface LoginMutationVariables {
+  email: string,
+  password: string
+}
+
+export interface LoginMutationResponse {
+  authenticate: {
+    jwtToken: string | null
+  }
+}
+
 
 
 

redaktions-app/src/components/SignUp.tsx

@@ -45,7 +45,9 @@ export default function SignUp() {
   const [password, setPassword] = useState("");
   const [firstName, setFirstName] = useState("");
   const [lastName, setLastName] = useState("");
-  const [createAccount, {loading, error, data}] = useMutation(registerMutation);
+  const [createAccount, {loading, error, data}] = useMutation<RegisterMutationResponse, RegisterMutationVariables>(
+    registerMutation
+  );
   const classes = useStyles();
 
   const onSubmit = (event: React.FormEvent<HTMLFormElement>) => {
@@ -131,7 +133,6 @@ export default function SignUp() {
             error
               ? <p className={classes.error}> `Error while trying to create a new account: ${error.message}`}</p>
               : data && data.registerPerson.person.nodeId
-              // todo: #7 cache update
               ? <p className={classes.success}>`Created new account successfully.
                 <Link to={"/login"}>Return to login page</Link></p>
               : null
@@ -154,13 +155,26 @@ export default function SignUp() {
 
 const registerMutation = gql`
   mutation CreateAccount($firstName: String!, $lastName: String!, $email: String!, $password: String!) {
-    __typename
     registerPerson(input: {firstName: $firstName, lastName: $lastName, email: $email, password: $password}) {
       person {
-        createdAt
         nodeId
       }
     }
   }
 `
 
+interface RegisterMutationVariables {
+  firstName: string,
+  lastName: string,
+  email: string,
+  password: string,
+}
+
+interface RegisterMutationResponse {
+  registerPerson: {
+    person: {
+      nodeId: string
+    }
+  }
+}
+