@plasmicpkgs/plasmic-sanity-io 1.0.92 → 1.0.94

package/dist/plasmic-sanity-io.esm.js

@@ -830,7 +830,12 @@ var sanityFetcherMeta = {
       type: "string",
       displayName: "GROQ",
       description: "Query in GROQ.",
-      defaultValueHint: "*[_type == 'movie']"
+      defaultValueHint: "*[_type == 'movie']",
+      // Hide this if there's no groq, AND there's docType, so we're in
+      // "docType" mode
+      hidden: function hidden(props) {
+        return !props.groq && !!props.docType;
+      }
     },
     docType: {
       type: "choice",
@@ -839,7 +844,11 @@ var sanityFetcherMeta = {
         return (_ctx$docTypes = ctx == null ? void 0 : ctx.docTypes) != null ? _ctx$docTypes : [];
       },
       displayName: "Document type",
-      description: "Document type to be queried (*[_type == DOC_TYPE] shortcut)."
+      description: "Document type to be queried (*[_type == DOC_TYPE] shortcut).",
+      // Hide this if groq is specified, as groq always takes precedence
+      hidden: function hidden(props) {
+        return !!props.groq;
+      }
     },
     filterField: {
       type: "choice",
@@ -849,34 +858,42 @@ var sanityFetcherMeta = {
         var _ctx$sanityFields;
         return (_ctx$sanityFields = ctx == null ? void 0 : ctx.sanityFields) != null ? _ctx$sanityFields : [];
       },
+      // Hide this if there's groq (so we're just using groq), or if there's
+      // no docType selected yet
       hidden: function hidden(props, ctx) {
-        return !props.docType && !props.groq;
+        return !!props.groq || !props.docType;
       }
     },
     filterParameter: {
       type: "choice",
-      displayName: "Filter Parameter",
-      description: "Filter Parameter filter by.Read more (https://www.sanity.io/docs/groq-operators#3b7211e976f6)",
+      displayName: "Filter Operation",
+      description: "Filter Option to filter by. Read more (https://www.sanity.io/docs/groq-operators#3b7211e976f6)",
       options: function options(props, ctx) {
         var _ctx$queryOptions;
         return (_ctx$queryOptions = ctx == null ? void 0 : ctx.queryOptions) != null ? _ctx$queryOptions : [];
       },
+      // Hide if in groq mode, or if no filter field is selected yet
       hidden: function hidden(props, ctx) {
-        return !props.filterField;
+        return !!props.groq || !props.filterField;
       }
     },
     filterValue: {
       type: "string",
       displayName: "Filter value",
       description: "Value to filter by, should be of filter field type",
+      // Hide if in groq mode, or if no filter field is selected yet
       hidden: function hidden(props, ctx) {
-        return !props.filterParameter;
+        return !!props.groq || !props.filterField;
       }
     },
     limit: {
       type: "string",
       displayName: "Limit",
-      description: "Limit"
+      description: "Limit",
+      // Hide if in groq mode
+      hidden: function hidden(props) {
+        return !!props.groq || !props.docType;
+      }
     },
     noAutoRepeat: {
       type: "boolean",
@@ -910,14 +927,20 @@ function SanityFetcher(_ref2) {
   var dateRegex = new RegExp(/^\d{4}-\d{2}-\d{2}$/);
   var creds = ensure(useContext(CredentialsContext));
   if (!creds.projectId || !projectIdRegex.test(creds.projectId)) {
-    return React.createElement("div", null, "Please specify a valid projectId, it can only contain only a-z, 0-9 and dashes.");
+    return React.createElement("div", {
+      className: className
+    }, "Please specify a valid projectId, it can only contain only a-z, 0-9 and dashes.");
   } else if (!creds.dataset || !datasetRegex.test(creds.dataset)) {
-    return React.createElement("div", null, "Please specify a valid dataset, they can only contain lowercase characters, numbers, underscores and dashes, and start with tilde, and be maximum 64 characters.");
+    return React.createElement("div", {
+      className: className
+    }, "Please specify a valid dataset, they can only contain lowercase characters, numbers, underscores and dashes, and start with tilde, and be maximum 64 characters.");
   } else if (creds.apiVersion) {
     if (creds.apiVersion !== "v1" && creds.apiVersion !== "1" && creds.apiVersion !== "X") {
       var date = new Date(creds.apiVersion);
       if (!(dateRegex.test(creds.apiVersion) && date instanceof Date && date.getTime() > 0)) {
-        return React.createElement("div", null, "Please specify a valid API version, expected `v1`, `1` or date in format `YYYY-MM-DD`.");
+        return React.createElement("div", {
+          className: className
+        }, "Please specify a valid API version, expected `v1`, `1` or date in format `YYYY-MM-DD`.");
       }
     }
   }
@@ -951,92 +974,88 @@ function SanityFetcher(_ref2) {
     }, _callee);
   })));
   var docTypes = (_allDataTypes$data = allDataTypes.data) != null ? _allDataTypes$data : false;
-  if (!groq && docType) {
-    groq = "*[_type=='" + docType + "'";
-  }
-  var cacheKey = JSON.stringify({
-    docType: docType,
-    filterField: filterField,
-    filterValue: filterValue,
-    filterParameter: filterParameter,
-    limit: limit,
-    groq: groq,
-    creds: creds
-  });
+  var hasFilter = !!docType && !!filterField && !!filterParameter && !!filterValue;
+  var generateUnfilteredGroq = function generateUnfilteredGroq() {
+    if (groq) {
+      console.log("ORIG GROQ", groq);
+      return groq;
+    } else if (docType) {
+      var query = "*[_type=='" + docType + "']";
+      if (hasFilter) {
+        // Ask for only a small sample, so we know how to generate the filter
+        query += "[0...10]";
+      } else if (limit) {
+        query += "[0..." + limit + "]";
+      }
+      console.log("UNFILTERED GROQ", query);
+      return query;
+    } else {
+      return null;
+    }
+  };
+  var unfilteredQuery = generateUnfilteredGroq();
   var sanity = makeSanityClient(creds);
-  var _usePlasmicQueryData = usePlasmicQueryData(docType && groq ? cacheKey : null, /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee2() {
-      var query, resp;
+  var _usePlasmicQueryData = usePlasmicQueryData(unfilteredQuery ? JSON.stringify({
+      fullQuery: unfilteredQuery,
+      creds: creds
+    }) : null, /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee2() {
       return runtime_1.wrap(function _callee2$(_context2) {
         while (1) {
           switch (_context2.prev = _context2.next) {
             case 0:
-              if (groq) {
-                _context2.next = 2;
-                break;
-              }
-              return _context2.abrupt("return", null);
-            case 2:
-              if (limit) {
-                query = groq + "][" + limit + "]";
-              } else {
-                query = groq + "]";
-              }
-              _context2.next = 5;
-              return sanity.fetch(query);
-            case 5:
-              resp = _context2.sent;
-              return _context2.abrupt("return", resp);
-            case 7:
+              return _context2.abrupt("return", sanity.fetch(unfilteredQuery));
+            case 1:
             case "end":
               return _context2.stop();
           }
         }
       }, _callee2);
     }))),
-    response = _usePlasmicQueryData.data;
-  var _usePlasmicQueryData2 = usePlasmicQueryData(groq && filterField && filterValue && filterParameter && response ? cacheKey + "/filtered" : null, /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee3() {
-      var query, matched, resp;
+    unfilteredData = _usePlasmicQueryData.data;
+  var generateFilteredQuery = function generateFilteredQuery() {
+    if (!hasFilter || !unfilteredData) {
+      return null;
+    }
+    var fieldValues = Object.values(unfilteredData).flatMap(function (model) {
+      return Array.isArray(model) ? model : [model];
+    }).map(function (item) {
+      var field = Object.entries(item).find(function (el) {
+        return el[0] === filterField;
+      });
+      return field == null ? void 0 : field[1];
+    });
+    var query = "*[_type=='" + docType + "'";
+    if (fieldValues.some(function (v) {
+      return typeof v === "string";
+    })) {
+      query = query + " && " + filterField + " " + filterParameter + " \"" + filterValue + "\"";
+    } else {
+      query = query + " && " + filterField + " " + filterParameter + " " + filterValue;
+    }
+    if (limit) {
+      query = query + "][0..." + limit + "]";
+    } else {
+      query = query + "]";
+    }
+    console.log("FILTERED GROQ", query);
+    return query;
+  };
+  var filteredQuery = generateFilteredQuery();
+  var _usePlasmicQueryData2 = usePlasmicQueryData(filteredQuery ? JSON.stringify({
+      filteredQuery: filteredQuery,
+      creds: creds
+    }) : null, /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/runtime_1.mark(function _callee3() {
+      var resp;
       return runtime_1.wrap(function _callee3$(_context3) {
         while (1) {
           switch (_context3.prev = _context3.next) {
             case 0:
-              if (!(!docType && !filterField && !filterValue && !filterParameter && !response)) {
-                _context3.next = 2;
-                break;
-              }
-              return _context3.abrupt("return", null);
+              _context3.next = 2;
+              return sanity.fetch(filteredQuery);
             case 2:
-              if (response) {
-                _context3.next = 4;
-                break;
-              }
-              return _context3.abrupt("return", null);
-            case 4:
-              matched = Object.values(response).flatMap(function (model) {
-                return Array.isArray(model) ? model : [model];
-              }).map(function (item) {
-                var fields = Object.entries(item).find(function (el) {
-                  return el[0] === filterField;
-                });
-                return fields;
-              });
-              Object.values(matched).map(function (model) {
-                return Array.isArray(model) ? model : [model];
-              }).map(function (item) {
-                if (typeof item[1] === "number" && typeof item[1] !== "object") {
-                  query = groq + " && " + filterField + " " + filterParameter + " " + filterValue + "]";
-                } else if (typeof item[1] !== "number" && typeof item[1] !== "object" && typeof item[1] === "string") {
-                  query = groq + " && " + filterField + " " + filterParameter + " \"" + filterValue + "\"]";
-                } else {
-                  query = groq + " && " + filterField + " " + filterParameter + " " + filterValue + "]";
-                }
-              });
-              _context3.next = 8;
-              return sanity.fetch(query);
-            case 8:
               resp = _context3.sent;
               return _context3.abrupt("return", resp);
-            case 10:
+            case 4:
             case "end":
               return _context3.stop();
           }
@@ -1045,15 +1064,24 @@ function SanityFetcher(_ref2) {
     }))),
     filteredData = _usePlasmicQueryData2.data;
   if (!docTypes) {
-    return React.createElement("div", null, "Please configure the Sanity provider with a valid projectId, dataset, and token (if necessary). Don't forget to add 'https://host.plasmicdev.com' as an authorized host on the CORS origins section of your project.");
+    return React.createElement("div", {
+      className: className
+    }, "Please configure the Sanity provider with a valid projectId, dataset, and token (if necessary). Don't forget to add 'https://host.plasmicdev.com' as an authorized host on the CORS origins section of your project.");
   }
   setControlContextData == null ? void 0 : setControlContextData({
     docTypes: docTypes
   });
-  if (!response) {
-    return React.createElement("div", null, "Please specify a valid GROQ query or select a Document type.");
+  if (!groq && !docType) {
+    return React.createElement("div", {
+      className: className
+    }, "Please specify a valid GROQ query or select a Document type.");
   }
-  var sanityFields = response.map(function (item) {
+  if (!unfilteredData) {
+    return React.createElement("div", {
+      className: className
+    }, "Loading...");
+  }
+  var sanityFields = unfilteredData.map(function (item) {
     var fields = Object.keys(item).filter(function (field) {
       var value = get(item, field);
       return typeof value !== "object" && value._type !== "image" && typeof value === "number" || typeof value === "string" && !value.match(/^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}Z$/);
@@ -1061,7 +1089,7 @@ function SanityFetcher(_ref2) {
     return fields;
   });
   var operators;
-  var matchedFields = Object.values(response).flatMap(function (model) {
+  var matchedFields = Object.values(unfilteredData).flatMap(function (model) {
     return Array.isArray(model) ? model : [model];
   }).map(function (item) {
     var fields = Object.entries(item).find(function (el) {
@@ -1077,10 +1105,10 @@ function SanityFetcher(_ref2) {
     } else if (typeof item[1] !== "number" && typeof item[1] !== "object" && typeof item[1] === "string") {
       operators = [{
         value: "==",
-        label: "Equality"
+        label: "Equals"
       }, {
         value: "!=",
-        label: "Inequality"
+        label: "Not equals"
       }];
     }
   });
@@ -1089,65 +1117,48 @@ function SanityFetcher(_ref2) {
     docTypes: docTypes,
     sanityFields: sanityFields[0]
   });
-  if (filterField && !filterParameter && !filterValue) {
-    return React.createElement("div", null, "Please specify a Filter Parameter and a Filter Value");
-  }
-  if (filterField && filterParameter && !filterValue) {
-    return React.createElement("div", null, "Please specify a Filter Value");
-  }
-  if (!filterField && !filterParameter && filterValue) {
-    return React.createElement("div", null, "Please specify a Filter Field and a Filter Parameter");
+  if (hasFilter) {
+    if (!filterParameter) {
+      return React.createElement("div", {
+        className: className
+      }, "Please specify a filter operation");
+    }
+    if (!filterValue) {
+      return React.createElement("div", {
+        className: className
+      }, "Please specify a filter value");
+    }
   }
-  if (!filterField && filterParameter && !filterValue) {
-    return React.createElement("div", null, "Please specify a Filter Field and a Filter Value");
+  if (hasFilter && !filteredData) {
+    return React.createElement("div", {
+      className: className
+    }, "Loading...");
   }
-  var repElements;
+  var resultData = hasFilter ? filteredData : unfilteredData;
   var imageBuilder = imageUrlBuilder(sanity);
-  if (filteredData) {
-    if (filteredData.length === 0) {
-      return React.createElement("div", null, "No published types found");
-    }
-    repElements = filteredData.map(function (item, index) {
-      Object.keys(item).forEach(function (field) {
-        if (item[field]._type === "image") {
-          item[field].imgUrl = imageBuilder.image(item[field]).ignoreImageParams().toString();
-        }
-      });
-      return React.createElement(DataProvider, {
-        key: item._id,
-        name: "sanityItem",
-        data: item,
-        hidden: true
-      }, React.createElement(DataProvider, {
-        name: makeDataProviderName(docType),
-        data: item
-      }, repeatedElement(index, children)));
-    });
-  } else {
-    repElements = noAutoRepeat ? children : response.map(function (item, index) {
-      Object.keys(item).forEach(function (field) {
-        if (item[field]._type === "image") {
-          item[field].imgUrl = imageBuilder.image(item[field]).ignoreImageParams().toString();
-        }
-      });
-      return docType ? React.createElement(DataProvider, {
-        key: item._id,
-        name: "sanityItem",
-        data: item,
-        hidden: true
-      }, React.createElement(DataProvider, {
-        name: makeDataProviderName(docType),
-        data: item
-      }, repeatedElement(index, children))) : React.createElement(DataProvider, {
-        key: item._id,
-        name: "sanityItem",
-        data: item
-      }, repeatedElement(index, children));
+  var repElements = noAutoRepeat ? children : resultData.map(function (item, index) {
+    Object.keys(item).forEach(function (field) {
+      if (item[field]._type === "image") {
+        item[field].imgUrl = imageBuilder.image(item[field]).ignoreImageParams().toString();
+      }
     });
-  }
+    return docType ? React.createElement(DataProvider, {
+      key: item._id,
+      name: "sanityItem",
+      data: item,
+      hidden: true
+    }, React.createElement(DataProvider, {
+      name: makeDataProviderName(docType),
+      data: item
+    }, repeatedElement(index, children))) : React.createElement(DataProvider, {
+      key: item._id,
+      name: "sanityItem",
+      data: item
+    }, repeatedElement(index, children));
+  });
   return React.createElement(DataProvider, {
     name: "sanityItems",
-    data: response
+    data: resultData
   }, noLayout ? React.createElement(React.Fragment, null, " ", repElements, " ") : React.createElement("div", {
     className: className
   }, " ", repElements, " "));