@sanity/hierarchical-document-list 0.1.0 → 0.1.1

package/README.md

@@ -1,6 +1,10 @@
 # sanity-plugin-hierarchical-document-list
 
-Plugin for editing hierarchical references in the [Sanity studio](https://www.sanity.io/docs/sanity-studio).
+Plugin for visually organizing documents as hierarchies in the [Sanity studio](https://www.sanity.io/docs/sanity-studio). Applications include:
+
+- Tables of content - such as a book's sections and chapters
+- Navigational structure & menus - a website mega-menu with multiple levels, for example
+- Taxonomy inheritance - "_Carbs_ is a parent of _Legumes_ which is a parent of _Beans_"
 
 ![Screenshot of the plugin](/screenshot-1.jpg)
 
@@ -15,9 +19,9 @@ If you're looking for a way to order documents on a flat list, refer to [@sanity
 sanity install @sanity/hierarchical-document-list
 ```
 
-With the plugin installed, you'll add the following to your Desk Structure:
+Once you've installed the plugin the next step is to add one or more hierarchy documents to your Structure Builder.
 
-💡 _If you don't have a custom desk structure, refer to the [Structure Builder docs](https://www.sanity.io/docs/overview-structure-builder) to learn how to do so._
+💡 _To learn about custom desk structures, refer to the [Structure Builder docs](https://www.sanity.io/docs/overview-structure-builder)._
 
 ```js
 // deskStructure.js
@@ -52,13 +56,15 @@ export default () => {
 
 ## How it works
 
-The hierarchical data is stored in the document specified by the `documentId` of your choosing. As compared to storing `parent` fields in each individual document in the hierarchy, this makes it easier to implement different hierarchies for the same content according to the context, and also simplifies querying the full structure - as you'll see in [Querying data](#querying-data) below.
+The hierarchical data is stored in a centralized document with the `documentId` of your choosing. As compared to storing parent/child relationships in each individual document in the hierarchy, this makes it easier to implement different hierarchies for the same content according to the context.
+
+This approach also simplifies querying the full structure - as you'll see in [querying data](#querying-data) below.
 
-Keep in mind that **this document is live-edited**, meaning it has no draft and every change by editors will directly affect its published version.
+Keep in mind that this specified **document is live-edited**, meaning it has no draft and every change by editors will directly affect its published version.
 
-Instead of manually adding items one-by-one, the plugin will create a [GROQ](https://www.sanity.io/docs/overview-groq) query that matches all documents with a `_type` in `referenceTo`, that also match the optional `referenceOptions.filter`. From these documents, editors are able to drag, nest and re-order them at will from the "Items not added" list.
+Instead of requiring editors to manually add items one-by-one, the plugin will create a [GROQ](https://www.sanity.io/docs/overview-groq) query that matches all documents with a `_type` in the `referenceTo` option you specify, that also match the optional `referenceOptions.filter`. From these documents, editors are able to drag, nest and re-order them at will from the "Add more items" list.
 
-If a document in the tree doesn't match the filters set, it'll still exist in the tree. This can happen if the document has a new, unfitting value, the configuration changed or it was deleted. Although the tree will still be publishable, editors will get a warning and won't be able to drag these entries around.
+If a document in the tree doesn't match the filters set, it'll keep existing in the data. This can happen if the document has a new, unfitting value, the configuration changed or it was deleted. Although the tree will still be publishable, editors will get a warning and won't be able to drag these faulty entries around.
 
 ## Querying data
 
@@ -170,6 +176,37 @@ const hierarchyDocument = await client.fetch(`*[_id == "book-v3-review-a"][0]{
   }
 }`)
 const tree = flatDataToTree(data.tree)
+
+/* Results in a recursively nested structure. Using the example data above:
+{
+  "_key": "741b9edde2ba",
+  "_type": "hierarchy.node",
+  "value": {
+    "reference": {
+      "_ref": "75c47994-e6bb-487a-b8c9-b283f2436031",
+      "_type": "reference",
+      "_weak": true
+    },
+    "docType": "docs.article"
+  },
+  "parent": null,
+  "children": [
+    {
+      "_key": "f92eaeec96f7",
+      "_type": "hierarchy.node",
+      "value": {
+        "reference": {
+          "_ref": "7ad60a02-5d6e-47d8-92e2-6724cc130058",
+          "_type": "reference",
+          "_weak": true
+        },
+        "docType": "site.post"
+      },
+      "parent": "741b9edde2ba"
+    }
+  ]
+}
+*/
 ```
 
 After the transformation above, nodes with nested entries will include a `children` array. This data structure is recursive.

package/lib/components/TreeEditorErrorBoundary.d.ts

@@ -1,17 +1,3 @@
 import React from 'react';
-interface ErrorInfo {
-    title: string;
-    description?: string;
-}
-declare class TreeEditorErrorBoundary extends React.Component<any, {
-    error?: ErrorInfo;
-}> {
-    constructor(props: any);
-    static getDerivedStateFromError(error: unknown): {
-        error: undefined;
-    } | {
-        error: ErrorInfo;
-    };
-    render(): JSX.Element;
-}
+declare const TreeEditorErrorBoundary: React.FC;
 export default TreeEditorErrorBoundary;

package/lib/components/TreeEditorErrorBoundary.js

@@ -1,29 +1,26 @@
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
     };
-})();
+    return __assign.apply(this, arguments);
+};
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useToast } from '@sanity/ui';
+import { ErrorBoundary, useToast } from '@sanity/ui';
 import React from 'react';
+var DISPLAY_ERROR = false;
 var ErrorToast = function (_a) {
     var error = _a.error;
     var push = useToast().push;
     React.useEffect(function () {
-        if (error === null || error === void 0 ? void 0 : error.title) {
+        if ((error === null || error === void 0 ? void 0 : error.error) && DISPLAY_ERROR) {
             push({
-                title: error.title,
-                description: error.description,
+                title: error.error.name,
+                description: error.error.message,
                 closable: true,
                 status: 'error',
                 id: 'hierarchical-error'
@@ -32,38 +29,10 @@ var ErrorToast = function (_a) {
     }, [error]);
     return null;
 };
-var TreeEditorErrorBoundary = /** @class */ (function (_super) {
-    __extends(TreeEditorErrorBoundary, _super);
-    function TreeEditorErrorBoundary(props) {
-        var _this = _super.call(this, props) || this;
-        _this.state = { error: undefined };
-        return _this;
-    }
-    Object.defineProperty(TreeEditorErrorBoundary, "getDerivedStateFromError", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function (error) {
-            if (!error) {
-                return {
-                    error: undefined
-                };
-            }
-            return {
-                error: {
-                    title: 'Something went wrong'
-                }
-            };
-        }
-    });
-    Object.defineProperty(TreeEditorErrorBoundary.prototype, "render", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            return (_jsxs(React.Fragment, { children: [_jsx(ErrorToast, { error: this.state.error }, void 0), this.props.children] }, void 0));
-        }
-    });
-    return TreeEditorErrorBoundary;
-}(React.Component));
+var TreeEditorErrorBoundary = function (props) {
+    var _a = React.useState(undefined), exception = _a[0], setException = _a[1];
+    return (_jsxs(ErrorBoundary, __assign({ onCatch: function (newException) {
+            setException(newException);
+        } }, { children: [_jsx(ErrorToast, { error: exception }, void 0), props.children] }), void 0));
+};
 export default TreeEditorErrorBoundary;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sanity/hierarchical-document-list",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "author": "Sanity <hello@sanity.io>",
   "license": "MIT",
   "main": "lib/index.js",