sanity-plugin-workflow 1.0.0-beta.6 → 1.0.0-beta.8

package/lib/index.esm.js

@@ -680,25 +680,28 @@ function useWorkflowDocuments(schemaTypes) {
       _type
     } = document;
     const {
-      documentId
+      documentId,
+      _rev
     } = document._metadata || {};
-    await client.patch("workflow-metadata.".concat(documentId)).set({
+    await client.patch("workflow-metadata.".concat(documentId)).ifRevisionId(_rev).set({
       state: newStateId,
       orderRank: newOrder
-    }).commit().then(() => {
-      var _a;
-      return toast.push({
-        title: "Moved to \"".concat((_a = newState == null ? void 0 : newState.title) != null ? _a : newStateId, "\""),
+    }).commit().then(res => {
+      var _a, _b;
+      toast.push({
+        title: newState.id === document._metadata.state ? "Reordered in \"".concat((_a = newState == null ? void 0 : newState.title) != null ? _a : newStateId, "\"") : "Moved to \"".concat((_b = newState == null ? void 0 : newState.title) != null ? _b : newStateId, "\""),
         status: "success"
       });
+      return res;
     }).catch(err => {
       var _a;
       setLocalDocuments(currentLocalData);
-      return toast.push({
+      toast.push({
         title: "Failed to move to \"".concat((_a = newState == null ? void 0 : newState.title) != null ? _a : newStateId, "\""),
         description: err.message,
         status: "error"
       });
+      return null;
     });
     return {
       _id,
@@ -812,31 +815,44 @@ function CompleteButton(props) {
     apiVersion: API_VERSION
   });
   const toast = useToast();
-  const handleComplete = React.useCallback(id => {
+  const handleComplete = React.useCallback(event => {
+    const id = event.currentTarget.value;
+    if (!id) {
+      return;
+    }
     client.delete("workflow-metadata.".concat(id)).then(() => {
       toast.push({
         status: "success",
-        title: "Workflow completed",
-        description: id
+        title: "Workflow completed"
       });
     }).catch(() => {
       toast.push({
         status: "error",
-        title: "Could not complete Workflow",
-        description: id
+        title: "Could not complete Workflow"
       });
     });
   }, [client, toast]);
-  return /* @__PURE__ */jsx(Button, {
-    onClick: () => handleComplete(documentId),
-    text: "Complete",
-    icon: CheckmarkIcon,
-    tone: "positive",
-    mode: "ghost",
-    fontSize: 1,
-    padding: 2,
-    tabIndex: -1,
-    disabled
+  return /* @__PURE__ */jsx(Tooltip, {
+    portal: true,
+    content: /* @__PURE__ */jsx(Box, {
+      padding: 2,
+      children: /* @__PURE__ */jsx(Text, {
+        size: 1,
+        children: "Remove this document from Workflow"
+      })
+    }),
+    children: /* @__PURE__ */jsx(Button, {
+      value: documentId,
+      onClick: handleComplete,
+      text: "Complete",
+      icon: CheckmarkIcon,
+      tone: "positive",
+      mode: "ghost",
+      fontSize: 1,
+      padding: 2,
+      tabIndex: -1,
+      disabled
+    })
   });
 }
 function TimeAgo(_ref2) {
@@ -953,6 +969,7 @@ function DocumentCard(props) {
   var _a, _b;
   const {
     isDragDisabled,
+    isPatching,
     userRoleCanDrop,
     isDragging,
     item,
@@ -986,6 +1003,7 @@ function DocumentCard(props) {
     let tone = defaultCardTone;
     if (!userRoleCanDrop) return isDarkMode ? "default" : "transparent";
     if (!documentId) return tone;
+    if (isPatching) tone = isDarkMode ? "default" : "transparent";
     if (isDragging) tone = "positive";
     if ((state == null ? void 0 : state.requireValidation) && !isValidating && validation.length > 0) {
       if (validation.some(v => v.level === "error")) {
@@ -995,7 +1013,7 @@ function DocumentCard(props) {
       }
     }
     return tone;
-  }, [defaultCardTone, userRoleCanDrop, isDarkMode, documentId, isDragging, isValidating, validation, state == null ? void 0 : state.requireValidation]);
+  }, [defaultCardTone, userRoleCanDrop, isPatching, isDarkMode, documentId, isDragging, isValidating, validation, state == null ? void 0 : state.requireValidation]);
   useEffect(() => {
     if (!isValidating && validation.length > 0) {
       if (validation.some(v => v.level === "error")) {
@@ -1041,7 +1059,7 @@ function DocumentCard(props) {
               children: [/* @__PURE__ */jsx(Box, {
                 flex: 1,
                 children: /* @__PURE__ */jsx(Preview, {
-                  layout: "default",
+                  layout: "block",
                   value: item,
                   schemaType: schema.get(item._type)
                 })
@@ -1049,14 +1067,14 @@ function DocumentCard(props) {
                 style: {
                   flexShrink: 0
                 },
-                children: hasError || isDragDisabled ? null : /* @__PURE__ */jsx(DragHandleIcon, {})
+                children: hasError || isDragDisabled || isPatching ? null : /* @__PURE__ */jsx(DragHandleIcon, {})
               })]
             })
-          }), /* @__PURE__ */jsx(Card, {
+          }), /* @__PURE__ */jsxs(Card, {
             padding: 2,
             radius: 2,
             tone: "inherit",
-            children: /* @__PURE__ */jsxs(Flex, {
+            children: [/* @__PURE__ */jsxs(Flex, {
               align: "center",
               justify: "space-between",
               gap: 3,
@@ -1078,11 +1096,17 @@ function DocumentCard(props) {
                 id: item._id,
                 type: item._type,
                 disabled: !userRoleCanDrop
-              }), isLastState ? /* @__PURE__ */jsx(CompleteButton, {
+              }), isLastState && states.length <= 3 ? /* @__PURE__ */jsx(CompleteButton, {
                 documentId,
                 disabled: !userRoleCanDrop
               }) : null]
-            })
+            }), isLastState && states.length > 3 ? /* @__PURE__ */jsx(Stack, {
+              paddingTop: 2,
+              children: /* @__PURE__ */jsx(CompleteButton, {
+                documentId,
+                disabled: !userRoleCanDrop
+              })
+            }) : null]
           })]
         })
       })
@@ -1093,6 +1117,7 @@ function DocumentList(props) {
   const {
     data = [],
     invalidDocumentIds,
+    patchingIds,
     selectedSchemaTypes,
     selectedUserIds,
     state,
@@ -1141,7 +1166,7 @@ function DocumentList(props) {
       }
       const isInvalid = invalidDocumentIds.includes(documentId);
       const meInAssignees = (user == null ? void 0 : user.id) ? assignees == null ? void 0 : assignees.includes(user.id) : false;
-      const isDragDisabled = !userRoleCanDrop || isInvalid || !(state.requireAssignment ? state.requireAssignment && meInAssignees : true);
+      const isDragDisabled = patchingIds.includes(documentId) || !userRoleCanDrop || isInvalid || !(state.requireAssignment ? state.requireAssignment && meInAssignees : true);
       return /* @__PURE__ */jsx(Draggable, {
         draggableId: documentId,
         index: virtualItem.index,
@@ -1153,6 +1178,7 @@ function DocumentList(props) {
           children: /* @__PURE__ */jsx(DocumentCard, {
             userRoleCanDrop,
             isDragDisabled,
+            isPatching: patchingIds.includes(documentId),
             isDragging: draggableSnapshot.isDragging,
             item,
             toggleInvalidDocumentId,
@@ -1160,7 +1186,7 @@ function DocumentList(props) {
             states
           })
         })
-      }, documentId);
+      }, virtualItem.key);
     })
   });
 }
@@ -1278,7 +1304,7 @@ function Filters(props) {
             icon: ResetIcon
           }) : null]
         })
-      }), schemaTypes.length > 0 ? /* @__PURE__ */jsx(Flex, {
+      }), schemaTypes.length > 1 ? /* @__PURE__ */jsx(Flex, {
         align: "center",
         gap: 1,
         children: schemaTypes.map(typeName => {
@@ -1364,6 +1390,40 @@ function StateTitle(props) {
     })
   });
 }
+function generateMiddleValue(ranks) {
+  if (!ranks.some(rank => !rank)) {
+    return ranks;
+  }
+  const firstUndefined = ranks.findIndex(rank => !rank);
+  const firstDefinedAfter = ranks.findIndex((rank, index) => rank && index > firstUndefined);
+  const firstDefinedBefore = ranks.findLastIndex((rank, index) => rank && index < firstUndefined);
+  if (firstDefinedAfter === -1 || firstDefinedBefore === -1) {
+    throw new Error("Unable to generate middle value between indexes ".concat(firstDefinedBefore, " and ").concat(firstDefinedAfter));
+  }
+  const beforeRank = ranks[firstDefinedBefore];
+  const afterRank = ranks[firstDefinedAfter];
+  if (!beforeRank || typeof beforeRank === "undefined" || !afterRank || typeof afterRank === "undefined") {
+    throw new Error("Unable to generate middle value between indexes ".concat(firstDefinedBefore, " and ").concat(firstDefinedAfter));
+  }
+  const between = beforeRank.between(afterRank);
+  const middle = Math.floor((firstDefinedAfter + firstDefinedBefore) / 2);
+  if (ranks[middle]) {
+    throw new Error("Should not have overwritten value at index ".concat(middle));
+  }
+  ranks[middle] = between;
+  return ranks;
+}
+function generateMultipleOrderRanks(count, start, end) {
+  let ranks = [...Array(count)];
+  const rankStart = start != null ? start : LexoRank.min().genNext().genNext();
+  const rankEnd = end != null ? end : LexoRank.max().genPrev().genPrev();
+  ranks[0] = rankStart;
+  ranks[count - 1] = rankEnd;
+  for (let i = 0; i < count; i++) {
+    ranks = generateMiddleValue(ranks);
+  }
+  return ranks.sort((a, b) => a.toString().localeCompare(b.toString()));
+}
 const StyledFloatingCard = styled(Card)(() => css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    position: fixed;\n    bottom: 0;\n    left: 0;\n    z-index: 1000;\n  "]))));
 function FloatingCard(_ref3) {
   let {
@@ -1413,7 +1473,7 @@ function Verify(props) {
     const stateExists = states.find(s => s.id === state);
     return !stateExists && documentId ? [...acc, documentId] : acc;
   }, []) : [];
-  const documentsWithInvalidUserIds = (data == null ? void 0 : data.length) ? data.reduce((acc, cur) => {
+  const documentsWithInvalidUserIds = (data == null ? void 0 : data.length) && (userList == null ? void 0 : userList.length) ? data.reduce((acc, cur) => {
     var _a;
     const {
       documentId,
@@ -1488,19 +1548,42 @@ function Verify(props) {
     });
   }, [client, data, toast, userList]);
   const addOrderToDocuments = React.useCallback(async ids => {
-    var _a, _b;
     toast.push({
       title: "Adding ordering...",
       status: "info"
     });
-    const firstOrder = (_b = (_a = data[0]) == null ? void 0 : _a._metadata) == null ? void 0 : _b.orderRank;
-    let newLexo = firstOrder && data.length !== ids.length ? LexoRank.parse(firstOrder) : LexoRank.min();
+    const [firstOrder, secondOrder] = [...data].slice(0, 2).map(d => {
+      var _a;
+      return (_a = d._metadata) == null ? void 0 : _a.orderRank;
+    });
+    const minLexo = firstOrder ? LexoRank.parse(firstOrder) : void 0;
+    const maxLexo = secondOrder ? LexoRank.parse(secondOrder) : void 0;
+    const ranks = generateMultipleOrderRanks(ids.length, minLexo, maxLexo);
     const tx = client.transaction();
     for (let index = 0; index < ids.length; index += 1) {
-      newLexo = newLexo.genNext().genNext();
       tx.patch("workflow-metadata.".concat(ids[index]), {
         set: {
-          orderRank: newLexo.toString()
+          orderRank: ranks[index].toString()
+        }
+      });
+    }
+    await tx.commit();
+    toast.push({
+      title: "Added order to ".concat(ids.length === 1 ? "1 Document" : "".concat(ids.length, " Documents")),
+      status: "success"
+    });
+  }, [data, client, toast]);
+  const resetOrderOfAllDocuments = React.useCallback(async ids => {
+    toast.push({
+      title: "Adding ordering...",
+      status: "info"
+    });
+    const ranks = generateMultipleOrderRanks(ids.length);
+    const tx = client.transaction();
+    for (let index = 0; index < ids.length; index += 1) {
+      tx.patch("workflow-metadata.".concat(ids[index]), {
+        set: {
+          orderRank: ranks[index].toString()
         }
       });
     }
@@ -1531,24 +1614,39 @@ function Verify(props) {
   return /* @__PURE__ */jsxs(FloatingCard, {
     children: [documentsWithoutValidMetadataIds.length > 0 ? /* @__PURE__ */jsx(Button, {
       tone: "caution",
+      mode: "ghost",
       onClick: () => correctDocuments(documentsWithoutValidMetadataIds),
       text: documentsWithoutValidMetadataIds.length === 1 ? "Correct 1 Document State" : "Correct ".concat(documentsWithoutValidMetadataIds.length, " Document States")
     }) : null, documentsWithInvalidUserIds.length > 0 ? /* @__PURE__ */jsx(Button, {
       tone: "caution",
+      mode: "ghost",
       onClick: () => removeUsersFromDocuments(documentsWithInvalidUserIds),
       text: documentsWithInvalidUserIds.length === 1 ? "Remove Invalid Users from 1 Document" : "Remove Invalid Users from ".concat(documentsWithInvalidUserIds.length, " Documents")
     }) : null, documentsWithoutOrderIds.length > 0 ? /* @__PURE__ */jsx(Button, {
       tone: "caution",
+      mode: "ghost",
       onClick: () => addOrderToDocuments(documentsWithoutOrderIds),
       text: documentsWithoutOrderIds.length === 1 ? "Set Order for 1 Document" : "Set Order for ".concat(documentsWithoutOrderIds.length, " Documents")
-    }) : null, documentsWithDuplicatedOrderIds.length > 0 ? /* @__PURE__ */jsx(Button, {
-      tone: "caution",
-      onClick: () => addOrderToDocuments(documentsWithDuplicatedOrderIds),
-      text: documentsWithDuplicatedOrderIds.length === 1 ? "Set Unique Order for 1 Document" : "Set Unique Order for ".concat(documentsWithDuplicatedOrderIds.length, " Documents")
+    }) : null, documentsWithDuplicatedOrderIds.length > 0 ? /* @__PURE__ */jsxs(Fragment, {
+      children: [/* @__PURE__ */jsx(Button, {
+        tone: "caution",
+        mode: "ghost",
+        onClick: () => addOrderToDocuments(documentsWithDuplicatedOrderIds),
+        text: documentsWithDuplicatedOrderIds.length === 1 ? "Set Unique Order for 1 Document" : "Set Unique Order for ".concat(documentsWithDuplicatedOrderIds.length, " Documents")
+      }), /* @__PURE__ */jsx(Button, {
+        tone: "caution",
+        mode: "ghost",
+        onClick: () => resetOrderOfAllDocuments(data.map(doc => {
+          var _a;
+          return String((_a = doc._metadata) == null ? void 0 : _a.documentId);
+        })),
+        text: data.length === 1 ? "Reset Order for 1 Document" : "Reset Order for all ".concat(data.length, " Documents")
+      })]
     }) : null, orphanedMetadataDocumentIds.length > 0 ? /* @__PURE__ */jsx(Button, {
       text: "Cleanup orphaned metadata",
       onClick: handleOrphans,
-      tone: "caution"
+      tone: "caution",
+      mode: "ghost"
     }) : null]
   });
 }
@@ -1560,6 +1658,7 @@ function WorkflowTool(props) {
   } = (_b = (_a = props == null ? void 0 : props.tool) == null ? void 0 : _a.options) != null ? _b : {};
   const isDarkMode = useTheme().sanity.color.dark;
   const defaultCardTone = isDarkMode ? "default" : "transparent";
+  const toast = useToast();
   const userList = useProjectUsers({
     apiVersion: API_VERSION
   });
@@ -1569,6 +1668,7 @@ function WorkflowTool(props) {
     workflowData,
     operations
   } = useWorkflowDocuments(schemaTypes);
+  const [patchingIds, setPatchingIds] = React.useState([]);
   const {
     data,
     loading,
@@ -1633,26 +1733,65 @@ function WorkflowTool(props) {
       return;
     }
     const destinationStateItems = [...filterItemsAndSort(data, destination.droppableId, [], null)];
+    const destinationStateIndex = states.findIndex(s => s.id === destination.droppableId);
+    const globalStateMinimumRank = data[0]._metadata.orderRank;
+    const globalStateMaximumRank = data[data.length - 1]._metadata.orderRank;
     let newOrder;
     if (!destinationStateItems.length) {
-      newOrder = LexoRank.min().toString();
+      if (destinationStateIndex === 0) {
+        newOrder = LexoRank.min().toString();
+      } else {
+        newOrder = LexoRank.parse(globalStateMinimumRank).between(LexoRank.min()).toString();
+      }
     } else if (destination.index === 0) {
       const firstItemOrderRank = (_b2 = (_a2 = [...destinationStateItems].shift()) == null ? void 0 : _a2._metadata) == null ? void 0 : _b2.orderRank;
-      newOrder = firstItemOrderRank && typeof firstItemOrderRank === "string" ? LexoRank.parse(firstItemOrderRank).genPrev().toString() : LexoRank.min().toString();
+      if (firstItemOrderRank && typeof firstItemOrderRank === "string") {
+        newOrder = LexoRank.parse(firstItemOrderRank).genPrev().toString();
+      } else if (destinationStateIndex === 0) {
+        newOrder = LexoRank.min().toString();
+      } else {
+        newOrder = LexoRank.parse(globalStateMinimumRank).between(LexoRank.min()).toString();
+      }
     } else if (destination.index + 1 === destinationStateItems.length) {
       const lastItemOrderRank = (_d = (_c2 = [...destinationStateItems].pop()) == null ? void 0 : _c2._metadata) == null ? void 0 : _d.orderRank;
-      newOrder = lastItemOrderRank && typeof lastItemOrderRank === "string" ? LexoRank.parse(lastItemOrderRank).genNext().toString() : LexoRank.min().toString();
+      if (lastItemOrderRank && typeof lastItemOrderRank === "string") {
+        newOrder = LexoRank.parse(lastItemOrderRank).genNext().toString();
+      } else if (destinationStateIndex === states.length - 1) {
+        newOrder = LexoRank.max().toString();
+      } else {
+        newOrder = LexoRank.parse(globalStateMaximumRank).between(LexoRank.min()).toString();
+      }
     } else {
       const itemBefore = destinationStateItems[destination.index - 1];
       const itemBeforeRank = (_e = itemBefore == null ? void 0 : itemBefore._metadata) == null ? void 0 : _e.orderRank;
-      const itemBeforeRankParsed = itemBeforeRank ? LexoRank.parse(itemBeforeRank) : LexoRank.min();
+      let itemBeforeRankParsed;
+      if (itemBeforeRank) {
+        itemBeforeRankParsed = LexoRank.parse(itemBeforeRank);
+      } else if (destinationStateIndex === 0) {
+        itemBeforeRankParsed = LexoRank.min();
+      } else {
+        itemBeforeRankParsed = LexoRank.parse(globalStateMinimumRank);
+      }
       const itemAfter = destinationStateItems[destination.index];
       const itemAfterRank = (_f = itemAfter == null ? void 0 : itemAfter._metadata) == null ? void 0 : _f.orderRank;
-      const itemAfterRankParsed = itemAfterRank ? LexoRank.parse(itemAfterRank) : LexoRank.max();
+      let itemAfterRankParsed;
+      if (itemAfterRank) {
+        itemAfterRankParsed = LexoRank.parse(itemAfterRank);
+      } else if (destinationStateIndex === states.length - 1) {
+        itemAfterRankParsed = LexoRank.max();
+      } else {
+        itemAfterRankParsed = LexoRank.parse(globalStateMaximumRank);
+      }
       newOrder = itemBeforeRankParsed.between(itemAfterRankParsed).toString();
     }
-    move(draggableId, destination, states, newOrder);
-  }, [data, move, states]);
+    setPatchingIds([...patchingIds, draggableId]);
+    toast.push({
+      status: "info",
+      title: "Updating document state..."
+    });
+    await move(draggableId, destination, states, newOrder);
+    setPatchingIds(ids => ids.filter(id => id !== draggableId));
+  }, [data, patchingIds, toast, move, states]);
   const uniqueAssignedUsers = React.useMemo(() => {
     const uniqueUserIds = data.reduce((acc, item) => {
       var _a2;
@@ -1679,6 +1818,30 @@ function WorkflowTool(props) {
   const toggleInvalidDocumentId = React.useCallback((docId, action) => {
     setInvalidDocumentIds(prev => action === "ADD" ? [...prev, docId] : prev.filter(id => id !== docId));
   }, []);
+  const Clone = React.useCallback((provided, snapshot, rubric) => {
+    const item = data.find(doc => {
+      var _a2;
+      return ((_a2 = doc == null ? void 0 : doc._metadata) == null ? void 0 : _a2.documentId) === rubric.draggableId;
+    });
+    return /* @__PURE__ */jsx("div", {
+      ...provided.draggableProps,
+      ...provided.dragHandleProps,
+      ref: provided.innerRef,
+      children: item ? /* @__PURE__ */jsx(DocumentCard, {
+        isDragDisabled: false,
+        isPatching: false,
+        userRoleCanDrop: true,
+        isDragging: snapshot.isDragging,
+        item,
+        states,
+        toggleInvalidDocumentId,
+        userList
+      }) : /* @__PURE__ */jsx(Feedback, {
+        title: "Item not found",
+        tone: "caution"
+      })
+    });
+  }, [data, states, toggleInvalidDocumentId, userList]);
   if (!(states == null ? void 0 : states.length)) {
     return /* @__PURE__ */jsx(Container, {
       width: 1,
@@ -1745,29 +1908,7 @@ function WorkflowTool(props) {
                   droppableId: state.id,
                   isDropDisabled,
                   mode: "virtual",
-                  renderClone: (provided, snapshot, rubric) => {
-                    const item = data.find(doc => {
-                      var _a3;
-                      return ((_a3 = doc == null ? void 0 : doc._metadata) == null ? void 0 : _a3.documentId) === rubric.draggableId;
-                    });
-                    return /* @__PURE__ */jsx("div", {
-                      ...provided.draggableProps,
-                      ...provided.dragHandleProps,
-                      ref: provided.innerRef,
-                      children: item ? /* @__PURE__ */jsx(DocumentCard, {
-                        isDragDisabled: false,
-                        userRoleCanDrop,
-                        isDragging: snapshot.isDragging,
-                        item,
-                        states,
-                        toggleInvalidDocumentId,
-                        userList
-                      }) : /* @__PURE__ */jsx(Feedback, {
-                        title: "Item not found",
-                        tone: "caution"
-                      })
-                    });
-                  },
+                  renderClone: Clone,
                   children: (provided, snapshot) => /* @__PURE__ */jsxs(Card, {
                     ref: provided.innerRef,
                     tone: snapshot.isDraggingOver ? "primary" : defaultCardTone,
@@ -1783,6 +1924,7 @@ function WorkflowTool(props) {
                     }) : null, /* @__PURE__ */jsx(DocumentList, {
                       data,
                       invalidDocumentIds,
+                      patchingIds,
                       selectedSchemaTypes,
                       selectedUserIds,
                       state,