React hooksでGraphQLのvariablesを更新したい

Question

前提

今GraphQLの勉強の一環でGitHub GraphQL APIから値を取得しています。
apolloを使用していますが、その際にuseQuery()のvariablesの値を<button onClick={}>で更新を試みているのですが、うまくいきません

該当のソースコード

import React, { Component, useState } from 'react';
import { ApolloProvider, useQuery } from '@apollo/react-hooks';
import client from './client';
import {SEARCH_REPOSITORIES} from './graphql'

const PER_PAGE = 5
const DEFAULT_STATE = {
  first: PER_PAGE,
  after: null,
  last: null,
  before: null,
  query: "フロントエンドエンジニア",
}

const QueryView = ({ queryVariables }) => {
  const [stateNext, setGoNext] = useState(queryVariables);
  const { loading, error, data } = useQuery(SEARCH_REPOSITORIES, {
    variables: stateNext
  });

  if (loading) return <p>Loading...</p>;
  if (error) return <p>Error : {error.message}</p>;
  const search = data.search
  const repositoryCount = search.repositoryCount
  const repositoryUnit = repositoryCount === 1 ? 'Repository' : 'Repositories'
  const title = `GitHub Repositories Search Result - ${repositoryCount} ${repositoryUnit}`
  console.log(stateNext)
  return (
    <div>
      <h1>{title}</h1>
      <ul>
        {
          search.edges.map(edge => {
            const node = edge.node
            return (
              <li key={node.id}>
                <a href={node.url} target="_blank" rel="noopener noreferrer">{node.name}</a>
              </li>
            )
          })
        }
      </ul>
      {
        search.pageInfo.hasNextPage === true ?

          <button onClick={
            setGoNext(
              {
                ...stateNext,
                first: PER_PAGE,
                after: search.pageInfo.endCursor,
                last: null,
                before: null
              }
            )}>Next</button>
          :
          null
      }
    </div>
  )
}
class App extends Component {
  constructor(props) {
    super(props)
    this.state = DEFAULT_STATE

    this.handleChange = this.handleChange.bind(this)
    this.handleSubmit = this.handleSubmit.bind(this)
  }
  handleChange(event) {
    this.setState( {
      ...DEFAULT_STATE,
      query: event.target.value
    })
  }
  handleSubmit(event) {
    event.preventDefault();
  }
  render() {
    const { query, first, last, before, after } = this.state
    return (
      <ApolloProvider client={client} >
        <h2>Hello, GraphQL</h2>
        <QueryView queryVariables={{ query, first, last, before, after }} />
        <form onSubmit={this.handleSubmit}>
          <input type="text" value={query} onChange={this.handleChange} />
        </form>
      </ApolloProvider>
    )
  }
};

export default App;

実現したいこと

stateNextのafterの値を更新したいです。
いま更新はできているのですが、下記のように<button>をクリックせず更新されてしまいまいた。
この場合何が問題になりますでしょうか？

App.js:27 {query: "フロントエンドエンジニア", first: 5, last: null, before: null, after: null}
App.js:27 {query: "フロントエンドエンジニア", first: 5, last: null, before: null, after: "Y3Vyc29yOjU="}
App.js:27 {query: "フロントエンドエンジニア", first: 5, last: null, before: null, after: "Y3Vyc29yOjEw"}
App.js:27 {query: "フロントエンドエンジニア", first: 5, last: null, before: null, after: "Y3Vyc29yOjE1"}
App.js:27 {query: "フロントエンドエンジニア", first: 5, last: null, before: null, after: "Y3Vyc29yOjIw"}
App.js:27 {query: "フロントエンドエンジニア", first: 5, last: null, before: null, after: "Y3Vyc29yOjI1"}

補足情報（FW/ツールのバージョンなど）

package.jsonはこちらになります。

  "dependencies": {
    "@apollo/react-hooks": "^3.1.3",
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.3.2",
    "@testing-library/user-event": "^7.1.2",
    "apollo-boost": "^0.4.7",
    "graphql": "^14.6.0",
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "react-scripts": "3.4.0"
  },

Answer 1

単純にonClickの引数を関数にすればよかった

          <button onClick={
            setGoNext(
              {
                ...stateNext,
                first: PER_PAGE,
                after: search.pageInfo.endCursor,
                last: null,
                before: null
              }
            )}>
↓
          <button onClick={
            setGoNext(() =>
              {
                ...stateNext,
                first: PER_PAGE,
                after: search.pageInfo.endCursor,
                last: null,
                before: null
              }
            )}>