@sanity/client 6.22.3-canary.0 → 6.22.3

package/README.md

@@ -28,7 +28,7 @@ export const client = createClient({
   dataset: 'your-dataset-name',
   useCdn: true, // set to `false` to bypass the edge cache
   apiVersion: '2023-05-03', // use current date (YYYY-MM-DD) to target the latest API version
-  // token: process.env.SANITY_SECRET_TOKEN // Only if you want to update content with the client
+  // token: process.env.SANITY_SECRET_TOKEN // Needed for certain operations like updating content or accessing previewDrafts perspective
 })
 
 // uses GROQ to query content: https://www.sanity.io/docs/groq
@@ -884,6 +884,48 @@ client.getDocuments(ids).then((docs) => {
 })
 ```
 
+### Listening to live content updates
+
+> [!NOTE]
+>
+> Live Content is experimental and requires your client config to be set up with `apiVersion: 'vX'`.
+
+```ts
+// Subscribe to live updates
+const subscription = client.live.events().subscribe((event) => {
+  // Check if incoming tags match saved sync tags
+  if (event.type === 'message' && event.tags.some((tag) => syncTags.includes(tag))) {
+    // Refetch with ID to get latest data
+    render(event.id)
+  }
+  if (event.type === 'restart') {
+    // A restart event is sent when the `lastLiveEventId` we've been given earlier is no longer usable
+    render()
+  }
+})
+// Later, unsubscribe when no longer needed (such as on unmount)
+// subscription.unsubscribe()
+```
+
+`client.live.events(options)`
+
+Listen to live content updates. Returns an RxJS Observable. When calling `.subscribe()` on the returned observable, a subscription is returned, which can be used to unsubscribe from the events later on by calling `subscription.unsubscribe()`.
+
+The `options` object can contain the following properties:
+
+- `includeDrafts (boolean)` - Whether to include draft documents in the events. Default is false. Note: This is an experimental API and may change or be removed.
+- `tag (string)` - Optional request tag for the listener. Use to identify the request in logs.
+
+The method will emit different types of events:
+
+- `message`: Regular event messages.
+- `restart`: Emitted when the event stream restarts.
+- `reconnect`: Emitted when the client reconnects to the event stream.
+- `welcome`: Emitted when the client successfully connects to the event stream.
+
+To listen to updates in draft content, set `includeDrafts` to `true`
+and configure the client with a token or `withCredentials: true`. The token should have the lowest possible access role.
+
 ### Creating documents
 
 ```js

package/dist/index.browser.cjs

@@ -76,6 +76,19 @@ function httpErrorMessage(res) {
 function stringifyBody(body, res) {
   return (res.headers["content-type"] || "").toLowerCase().indexOf("application/json") !== -1 ? JSON.stringify(body, null, 2) : body;
 }
+class CorsOriginError extends Error {
+  projectId;
+  addOriginUrl;
+  constructor({ projectId: projectId2 }) {
+    super("CorsOriginError"), this.name = "CorsOriginError", this.projectId = projectId2;
+    const url = new URL(`https://sanity.io/manage/project/${projectId2}/api`);
+    if (typeof location < "u") {
+      const { origin } = location;
+      url.searchParams.set("cors", "add"), url.searchParams.set("origin", origin), this.addOriginUrl = url, this.message = `The current origin is not allowed to connect to the Live Content API. Add it here: ${url}`;
+    } else
+      this.message = `The current origin is not allowed to connect to the Live Content API. Change your configuration here: ${url}`;
+  }
+}
 const httpError = {
   onResponse: (res) => {
     if (res.statusCode >= 500)
@@ -949,6 +962,7 @@ class LiveClient {
     tag: _tag
   } = {}) {
     const {
+      projectId: projectId2,
       apiVersion: _apiVersion,
       token,
       withCredentials,
@@ -999,6 +1013,17 @@ class LiveClient {
         const EventSourceImplementation = typeof EventSource > "u" || esOptions.headers || esOptions.withCredentials ? (await import("@sanity/eventsource")).default : EventSource;
         if (unsubscribed)
           return;
+        try {
+          if (await fetch(url, {
+            method: "OPTIONS",
+            mode: "cors",
+            credentials: esOptions.withCredentials ? "include" : "omit",
+            headers: esOptions.headers
+          }), unsubscribed)
+            return;
+        } catch {
+          throw new CorsOriginError({ projectId: projectId2 });
+        }
         const evs = new EventSourceImplementation(url.toString(), esOptions);
         evs.addEventListener("error", onError);
         for (const type of listenFor)
@@ -1560,6 +1585,7 @@ Object.defineProperty(exports, "unstable__environment", {
 exports.BasePatch = BasePatch;
 exports.BaseTransaction = BaseTransaction;
 exports.ClientError = ClientError;
+exports.CorsOriginError = CorsOriginError;
 exports.ObservablePatch = ObservablePatch;
 exports.ObservableSanityClient = ObservableSanityClient;
 exports.ObservableTransaction = ObservableTransaction;