r/inertiajs

The current structure of the HTTP helper and form helper in Inertia.js suffers from unnecessary redundancy that compromises both code legibility and maintainability. It is fundamentally illogical that, after defining the state and intent of a request within the hook, developers are forced to repeat the URL and method at the moment of execution.

This approach is not merely verbose; it introduces avoidable points of failure where the definition and the call can diverge without any functional benefit.

The Current Problem: Redundant Definitions

The existing behaviour compels the developer to manage an overwhelming quantity of exposed methods when the destination and method should already be conceptually tied to the hook instance.

const { get, post, put, patch, delete: destroy, submit } = useHttp({ ... })

// and

const { submit, get, post, put, patch, delete: destroy } = useForm({ ... })

Currently, developers often pass the URL and method to the hook, only to then call a specific method (e.g., post) with the exact same URL repeated in the handler. This redundancy serves no architectural purpose:

import { useForm } from "@inertiajs/react";

const { data, setData, post, errors } = useForm(
  "post",
  "/users",
  {
    name: "",
    email: ""
  }
);

function submit(e) {
  e.preventDefault();
  // Why must we repeat the method and URL here if it was already defined in the hook?
  post("/users");
}

How It Should Be: Simplified Hook Composition

The ideal solution involves defining the URL and method directly within the hook itself, returning a single, simplified submit callback. This eliminates the need to pass repetitive parameters across event handlers and centralises configuration at the source.

import { useForm } from "@inertiajs/react";

// Clear definition of method and destination at the source
const { data, setData, submit, errors, processing } = useForm(
  "post",
  "/users",
  {
    name: "",
    email: "",
  },
);

// Clean execution without redundant arguments
function handleSubmit(e) {
  e.preventDefault();
  submit(); 
}

This adjustment would drastically reduce visual noise and align the library with modern hook composition best practices, where configuration precedes action. The API must evolve toward a more intuitive architecture.