@liiift-studio/deploy-vercel-from-sanity 1.1.0 → 1.2.0

package/README.md

@@ -3,7 +3,7 @@
 **Trigger and monitor Vercel deployments directly from [Sanity Studio](https://www.sanity.io) — no context switching required.**
 
 [![npm version](https://img.shields.io/npm/v/@liiift-studio/deploy-vercel-from-sanity)](https://www.npmjs.com/package/@liiift-studio/deploy-vercel-from-sanity)
-[![Sanity v3–v6](https://img.shields.io/badge/sanity-v3%20%E2%80%93%20v6-f03e2f)](https://www.sanity.io)
+[![Sanity v3.30–v6](https://img.shields.io/badge/sanity-v3.30%20%E2%80%93%20v6-f03e2f)](https://www.sanity.io)
 [![License: MIT](https://img.shields.io/badge/license-MIT-blue)](./LICENSE)
 
 ![The Deploy tool inside Sanity Studio — Production and Preview targets each showing a live status badge, branch, commit SHA, deploy author, and a one-click Deploy button](https://raw.githubusercontent.com/Liiift-Studio/Deploy-Vercel-from-Sanity/main/docs/screenshot.png?v=1)
@@ -23,8 +23,8 @@
 - **Deployment history** per target
 - **"Open in Vercel"** link to your project dashboard
 - **Multiple targets** — configure Production, Preview, and any number of custom environments
-- **Shared API token** — set it once; all authenticated studio users with editor access or above can deploy
-- **Responsive grid layout** — 2 columns on desktop, 1 on mobile
+- **Shared API token** — set it once; readable by anyone who can read the dataset (see [Security](#security))
+- **Responsive grid layout** — cards reflow to fill the available width, one column on narrow viewports
 
 ---
 
@@ -97,7 +97,7 @@ EOF
 |---|---|---|---|
 | `name` | `string` | `'vercel-deploy'` | Tool slug in the Studio sidebar |
 | `title` | `string` | `'Deploy'` | Tool label in the Studio sidebar |
-| `icon` | `ComponentType` | `RocketIcon` | Custom sidebar icon |
+| `icon` | `ComponentType` | `RocketIcon` | Accepted and stored on the tool descriptor. Note that no Studio version from v3 to v6 currently renders `tool.icon`, so this has no visible effect today. |
 
 ---
 
@@ -105,6 +105,8 @@ EOF
 
 By default the Deploy tab is visible to all authenticated users. To hide it from viewers:
 
+> Filter on the tool name you actually configured. The snippet below uses the default `vercel-deploy`; if you passed a custom `name`, match that instead or the filter silently does nothing.
+
 ```ts
 // sanity.config.ts
 tools: (prev, { currentUser }) => {
@@ -154,19 +156,19 @@ flowchart LR
 
 ## Troubleshooting
 
-### "Token is invalid or expired"
+### "Vercel API 401 — token is invalid or expired"
 
 Your Vercel API token has been revoked or expired. Go to **Vercel → Settings → Tokens**, create a new token with **Full Account** scope, and reconnect it in the Deploy tab (top-right → *Token connected* button).
 
-### "Token lacks the required permissions"
+### "Vercel API 403 — token lacks the required permissions"
 
 The token exists but was created with insufficient scope. Vercel tokens need **Full Account** scope to read deployments. Delete the token and create a new one with the correct scope.
 
-### "Resource not found — check the deploy hook URL and team ID"
+### "Vercel API 404 — resource not found. Check the deploy hook URL and team ID."
 
 Either the deploy hook URL is incorrect, or the project belongs to a Vercel team and the **Team ID** field is missing from the deploy target. Find your Team ID at **Vercel → Settings → General → Team ID** (starts with `team_`) and add it to the deploy target via the edit menu.
 
-### "Rate limit reached"
+### "Vercel API 429 — rate limit reached"
 
 The plugin is making too many API calls at once (common when many targets are all actively building). Wait a few seconds — polling will resume automatically.
 
@@ -186,11 +188,11 @@ If "No stderr or stdout was captured" appears, the build may have failed before
 
 ## Security
 
-**API token storage** — The Vercel API token is stored in a `config.vercelDeploy` Sanity document, readable by all authenticated studio users. Note that a **Full Account** scoped token can read and write your entire Vercel account, so anyone with studio access can read a credential that grants broad Vercel access — treat the token accordingly. Audit who has access to your Sanity project at sanity.io → Project → Members. If your studio includes untrusted editors, consider a server-side proxy that holds the token and exposes only a scoped deploy endpoint.
+**API token storage** — The Vercel API token is stored in cleartext in a `config.vercelDeploy` document of type `vercelDeploy.config`. Sanity has no per-document access control at this tier, so **the token is readable by anyone who can read the dataset** — and if the dataset is public, which is the usual setup for a statically generated front-end, that includes unauthenticated requests to the public GROQ API. A `viewer`-role member who cannot write a single document can also read it. Note that a **Full Account** scoped token can read and write your entire Vercel account, so anyone with studio access can read a credential that grants broad Vercel access — treat the token accordingly. The document type is registered with the plugin, so it is visible in Structure and can be deleted from the Studio to revoke the stored token. Audit who has access to your Sanity project at sanity.io → Project → Members, and do not store a Full Account token in a public dataset. If your studio includes untrusted editors, consider a server-side proxy that holds the token and exposes only a scoped deploy endpoint.
 
 **Deploy hook URL validation** — `triggerDeploy` validates that the hook URL matches `api.vercel.com/v1/integrations/deploy/` before making the request, preventing SSRF from a tampered document.
 
-**External links** — All external links use `target="_blank" rel="noreferrer"` and are validated through `safeHref()` before rendering, blocking `javascript:` injection from a compromised API response.
+**External links** — All external links use `target="_blank" rel="noreferrer"` and every `href` is validated before rendering: `safeHref()` rejects any non-http(s) scheme, and deployment hostnames from the API go through `deploymentHref()`, which rejects anything that is not a bare host. Both block `javascript:` injection and host substitution from a compromised API response.
 
 **GROQ queries** — All GROQ queries in this plugin are static strings — no user input is interpolated.
 
@@ -198,23 +200,35 @@ If "No stderr or stdout was captured" appears, the build may have failed before
 
 ## Requirements
 
-- Sanity Studio v3, v4, v5, or v6
-- React 18 or 19
+- Sanity Studio v3.30 or newer, through v6
+- React 18 or 19 (Studio v5 and v6 require React 19)
+- Node 20.19+ or 22.12+
 - A Vercel account with at least one project and a deploy hook configured
 
-Zero runtime dependencies — `react`, `sanity`, `@sanity/ui` and `@sanity/icons` are peer dependencies provided by your Studio; the plugin ships nothing else.
+Zero runtime dependencies — `react`, `react-dom`, `sanity`, `@sanity/ui` and `@sanity/icons` are peer dependencies provided by your Studio; the plugin ships nothing else.
+
+> **Why v3.30 and not v3.0?** `sanity@3.0` pulls `@sanity/ui` v1, and this plugin needs v2 or newer. `@sanity/ui` reaches 2.x at `sanity@3.30.0`.
 
 ### Studio compatibility
 
 A single build supports the whole range. `@sanity/icons` v5 and `@sanity/ui` v4
-both moved components out of their barrel files, so the plugin resolves them at
-runtime rather than importing names that only exist on one major:
+both moved components out of their barrel files, so the plugin resolves every
+`@sanity/ui` and `@sanity/icons` value from the installed package at runtime
+rather than importing names that exist on only one major.
+
+Behaviour depends on the resolved packages, not on the Studio version — a
+lockfile that hoists a different major changes which row applies:
 
-| Studio | `@sanity/icons` | `@sanity/ui` | Notes |
+| `@sanity/ui` | `@sanity/icons` | Typical Studio | Behaviour |
 | --- | --- | --- | --- |
-| v3 – v6.3 | 3.x | 2.x / 3.x | Fully Studio-native |
-| v6.4 – v6.9 | 5.x | 3.x | Icons resolved via `<Icon symbol>` |
-| v6.10+ | 5.x | 4.x | Tooltips, overflow menu, log blocks and toasts use built-in fallbacks, since `@sanity/ui` v4 serves those from subpaths that do not exist on earlier majors |
+| 2.x | 2.x / 3.x | v3.30 – v3.x | Fully Studio-native |
+| 3.x | 3.x | v4 – v6.3 | Fully Studio-native |
+| 3.x | 5.x | v6.4 – v6.9 | Icons resolved via `<Icon symbol>` |
+| 4.x | 5.x | v6.10+ | Tooltips, overflow menu, log blocks and toasts use built-in equivalents, since `@sanity/ui` v4 serves those from subpaths that do not exist on earlier majors |
+
+The built-in equivalents are functional rather than pixel-identical to Studio's
+own: the overflow menu implements the WAI-ARIA menu button pattern locally, and
+toasts render in a live region anchored to the bottom-right of the tool.
 
 ---
 

package/dist/index.d.mts

@@ -1,5 +1,5 @@
 import * as sanity from 'sanity';
-import { ComponentType, SVGProps } from 'react';
+import * as react from 'react';
 
 type VercelDeployState = 'QUEUED' | 'INITIALIZING' | 'BUILDING' | 'READY' | 'ERROR' | 'CANCELED' | 'LOADING';
 /** A vercel_deploy document stored in the Sanity dataset */
@@ -52,16 +52,11 @@ interface VercelDeployPluginConfig {
     icon?: React.ComponentType;
 }
 
-/** Props every Sanity icon accepts — it renders a plain sized SVG. */
-type IconProps = SVGProps<SVGSVGElement>;
-/** An icon component, whichever shape the installed @sanity/icons exposes it in. */
-type IconComponent = ComponentType<IconProps>;
-
 declare const vercelDeploySchema: {
     name: "vercel_deploy";
     title: string;
     type: "document";
-    icon: IconComponent;
+    icon: react.ForwardRefExoticComponent<Omit<react.SVGProps<SVGSVGElement>, "ref"> & react.RefAttributes<SVGSVGElement>>;
     fields: (({
         name: "name";
         title: string;
@@ -95,7 +90,42 @@ declare const vercelDeploySchema: {
 };
 
 /**
- * Sanity Studio v5 plugin — trigger and monitor Vercel deployments.
+ * Registers the document the plugin stores its Vercel token in.
+ *
+ * The document was previously written without a registered type, which made it
+ * invisible to Structure, absent from schema extraction, and impossible to
+ * inspect or revoke from inside the Studio. Registering it does not change where
+ * the token lives — see the security note in the README about dataset read
+ * access — but it does make the credential visible and removable.
+ */
+declare const vercelConfigSchema: {
+    name: "vercelDeploy.config";
+    title: string;
+    type: "document";
+    fields: {
+        name: "accessToken";
+        title: string;
+        type: "string";
+        description: string;
+    }[];
+    preview: {
+        select: {
+            token: string;
+        };
+        prepare: ({ token }: {
+            token?: string;
+        }) => {
+            title: string;
+            subtitle: string;
+        };
+    };
+};
+
+/**
+ * Sanity Studio plugin — trigger and monitor Vercel deployments.
+ *
+ * Supports Studio v3.30 through v6 from a single build; see the compatibility
+ * table in the README for how @sanity/ui and @sanity/icons are resolved.
  *
  * @example
  * // sanity.config.ts
@@ -111,4 +141,4 @@ declare const vercelDeploySchema: {
  */
 declare const vercelDeploy: sanity.Plugin<void | VercelDeployPluginConfig>;
 
-export { type DeployTarget, type VercelDeployPluginConfig, type VercelDeployState, type VercelDeployment, vercelDeploy, vercelDeploySchema };
+export { type DeployTarget, type VercelDeployPluginConfig, type VercelDeployState, type VercelDeployment, vercelConfigSchema, vercelDeploy, vercelDeploySchema };

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import * as sanity from 'sanity';
-import { ComponentType, SVGProps } from 'react';
+import * as react from 'react';
 
 type VercelDeployState = 'QUEUED' | 'INITIALIZING' | 'BUILDING' | 'READY' | 'ERROR' | 'CANCELED' | 'LOADING';
 /** A vercel_deploy document stored in the Sanity dataset */
@@ -52,16 +52,11 @@ interface VercelDeployPluginConfig {
     icon?: React.ComponentType;
 }
 
-/** Props every Sanity icon accepts — it renders a plain sized SVG. */
-type IconProps = SVGProps<SVGSVGElement>;
-/** An icon component, whichever shape the installed @sanity/icons exposes it in. */
-type IconComponent = ComponentType<IconProps>;
-
 declare const vercelDeploySchema: {
     name: "vercel_deploy";
     title: string;
     type: "document";
-    icon: IconComponent;
+    icon: react.ForwardRefExoticComponent<Omit<react.SVGProps<SVGSVGElement>, "ref"> & react.RefAttributes<SVGSVGElement>>;
     fields: (({
         name: "name";
         title: string;
@@ -95,7 +90,42 @@ declare const vercelDeploySchema: {
 };
 
 /**
- * Sanity Studio v5 plugin — trigger and monitor Vercel deployments.
+ * Registers the document the plugin stores its Vercel token in.
+ *
+ * The document was previously written without a registered type, which made it
+ * invisible to Structure, absent from schema extraction, and impossible to
+ * inspect or revoke from inside the Studio. Registering it does not change where
+ * the token lives — see the security note in the README about dataset read
+ * access — but it does make the credential visible and removable.
+ */
+declare const vercelConfigSchema: {
+    name: "vercelDeploy.config";
+    title: string;
+    type: "document";
+    fields: {
+        name: "accessToken";
+        title: string;
+        type: "string";
+        description: string;
+    }[];
+    preview: {
+        select: {
+            token: string;
+        };
+        prepare: ({ token }: {
+            token?: string;
+        }) => {
+            title: string;
+            subtitle: string;
+        };
+    };
+};
+
+/**
+ * Sanity Studio plugin — trigger and monitor Vercel deployments.
+ *
+ * Supports Studio v3.30 through v6 from a single build; see the compatibility
+ * table in the README for how @sanity/ui and @sanity/icons are resolved.
  *
  * @example
  * // sanity.config.ts
@@ -111,4 +141,4 @@ declare const vercelDeploySchema: {
  */
 declare const vercelDeploy: sanity.Plugin<void | VercelDeployPluginConfig>;
 
-export { type DeployTarget, type VercelDeployPluginConfig, type VercelDeployState, type VercelDeployment, vercelDeploy, vercelDeploySchema };
+export { type DeployTarget, type VercelDeployPluginConfig, type VercelDeployState, type VercelDeployment, vercelConfigSchema, vercelDeploy, vercelDeploySchema };