Adding a button to trigger a Vercel build using the deploy hook in Sanity Studio.

import * as React from "react";
import Button from "part:@sanity/components/buttons/default";

const labels = {
  LOADING: "Loading...",
  READY: "Publish all",
  DEPLOYING: "Deploying...",
};

/**
 * TODO: Build an integration with the API to get the actual deployment status
 */
export const PublishAllButton = React.forwardRef(() => {
  const [status, setStatus] = React.useState<Status>("LOADING");

  const deployAll = React.useCallback(async () => {
    const res = await fetch(process.env.SANITY_STUDIO_VERCEL_DEPLOY_HOOK, {
      method: "GET",
    });
    const json = await res.json();
    if (json.job.state === "PENDING") {
      setStatus("DEPLOYING");
      setTimeout(() => {
        setStatus("READY");
      }, 90000);
    }
  }, []);

  React.useEffect(() => {
    setStatus("READY");
  }, []);

  return (
    <Button disabled={status !== "READY"} onClick={() => deployAll()}>
      {labels[status] || "Publish all"}
    </Button>
  );
});

export default PublishAllButton;

type Status = "LOADING" | "READY" | "DEPLOYING";

import { IoIosWarning } from "react-icons/io";
import PublishAllButton from "../../src/components/PublishAllButton";

export default {
  name: 'dangerZone',
  title: 'Danger Zone',
  type: 'document',
  icon: IoIosWarning,
  fields: [
    {
      name: 'title',
      title: 'Title',
      type: 'string',
      hidden: true,
      initialValue: 'Danger Zone'
    },
    {
      name: 'publishAll',
      title: 'Publish all documents',
      type: 'string',
      inputComponent: PublishAllButton
    },
  ]
}