How to make a graphql entry in a psql database

I am trying to figure out how to make a graphql entry in a psql database.

I am stuck and am not getting any feedback from console logs at any point in my attempt. I'm stuck for what to try next (or where to look for a tutorial showing how this step is supposed to work).

I have a table in my prisma schema called 'issue'. I am trying to create an 'issue' entry.

I have made a form with:

import * as React from "react"
import { Box, Center, Heading, Button,  } from "@chakra-ui/react"
import { Select, OptionBase, GroupBase } from "chakra-react-select";
import { groupedIssueCategories } from "../components/issue/categories"
import { gql } from "@apollo/client"
import Head from 'next/head'
import { IssueInput, useAllIssuesQuery, useCreateIssueMutation } from "lib/graphql"

import * as c from "@chakra-ui/react"
import { Input } from "components/Input"
// import { Select } from "components/Select"

import { HomeLayout } from "components/HomeLayout"
import { Limiter } from "components/Limiter"
import { Form } from "components/Form"
import Yup from "lib/yup"
import { useForm } from "lib/hooks/useForm"
import { useMe } from "lib/hooks/useMe"
import { useToast } from "lib/hooks/useToast"

interface GroupedRiskOption extends OptionBase {
    label: string
    value: string
}

const _ = gql`
    mutation CreateIssue($data: IssueInput!) {
        createIssue(data: $data) {
        id 
        title 
        issueCategory
        description
        userId
        }
    }
    query AllIssues {
        allIssues {
            id 
            title 
            issueId
            description
            userId
        }
    }

`


export default function Issue() {
    const toast = useToast()
    const { me, loading: meLoading } = useMe()
    const [createIssue] = useCreateIssueMutation()
    const { data:  issues, refetch } = useAllIssuesQuery()
    const IssueSchema = Yup.object().shape({
        title: Yup.string().required("Title is required"),
        issueCategory: Yup.string().required("Category is required"),
        description: Yup.string().required("Description is required"),
    })

    const form = useForm({ schema: IssueSchema })

    const onSubmit = (data: IssueInput) => {
        console.log(data)
        return form.handler(() => createIssue({ variables: { data: { ...data, userId: me?.id || ""} } }), {
            onSuccess: async () => {
                toast({
                    title: "Issue created",
                    description: "Your issue has been created",
                    status: "success",
                })
                refetch()
                form.reset()
                },
            })
        }



if (meLoading) 
    return (
        <c.Center>
            <c.Spinner />
        </c.Center>
    )

    if (!me) return null 

    return (
        <Box>
            <Head>
            <title>Create Issue</title>
            </Head>

            <Limiter pt={20} minH="calc(100vh - 65px)">
                <Center flexDir="column">
                    <Heading as="h1" size="3xl" fontWeight="extrabold" px="3rem" lineHeight="1.2" letterSpacing="tight" color="brand.orange">
                        Create Issue
                    </Heading>
                    <Form onSubmit={onSubmit} {...form}>
                        <c.Stack spacing={2}>
                            <c.Heading>Issues</c.Heading>
                            <Input autoFocus name="title" label="Title" placeholder="Eg: climate change" />
                            <Input  name="description" label="Description" placeholder="Eg: Issues relating to climate change" />

                            <Select<GroupedRiskOption, true, GroupBase<GroupedRiskOption>>
                                // isMulti
                                name="issueCategory"
                                options={groupedIssueCategories}
                                placeholder="Select issue categories"
                                closeMenuOnSelect={false}
                            />

                            
                            <Button 
                                color="brand.orange"
                                type="submit"
                                isFullWidth
                                isDisabled={form.formState.isSubmitting || 
!form.formState.isDirty}
                                isLoading={form.formState.isSubmitting}
                            >
                                Create Issue
                            </Button>
                            <c.List>
                                {/* {issues.allIssues.map((issue) => (
                                    <c.ListItem key={issue.id}>
                                        {issue.title}
                                        {issue.issueCategory}
                                        {issue.description}
                                    </c.ListItem>
                                ))} */}
                            </c.List>
                        </c.Stack>
                    </Form>    
                </Center>
            </Limiter>
        </Box>
    )
}

Issue.getLayout = (page: React.ReactNode) => <HomeLayout>{page}</HomeLayout>

I have a create issue mutation in my lib/graphql:

export function useCreateIssueMutation(baseOptions?: Apollo.MutationHookOptions<CreateIssueMutation, CreateIssueMutationVariables>) {
        const options = {...defaultOptions, ...baseOptions}
        return Apollo.useMutation<CreateIssueMutation, CreateIssueMutationVariables>(CreateIssueDocument, options);
      }
export type CreateIssueMutationHookResult = ReturnType<typeof useCreateIssueMutation>;
export type CreateIssueMutationResult = Apollo.MutationResult<CreateIssueMutation>;
export type CreateIssueMutationOptions = Apollo.BaseMutationOptions<CreateIssueMutation, CreateIssueMutationVariables>;

When I click submit, nothing happens in the console. I can't log the data, and I can't see any errors, either in the terminal or in the console.

Can anyone give me a steer on where to look for insights as to what is going wrong. There is no data in the database, the onSuccess step doesn't get performed.