@payloadcms/ui 3.23.0-canary.f63b80a → 3.23.0

package/dist/elements/WhereBuilder/index.js

@@ -1,14 +1,14 @@
 'use client';
 
-import { c as _c } from "react/compiler-runtime";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getTranslation } from '@payloadcms/translations';
-import React, { useEffect, useState } from 'react';
+import React, { useMemo } from 'react';
 import { useListQuery } from '../../providers/ListQuery/index.js';
 import { useTranslation } from '../../providers/Translation/index.js';
 import { Button } from '../Button/index.js';
 import { Condition } from './Condition/index.js';
-import { reduceClientFields } from './reduceClientFields.js';
+import fieldTypes from './field-types.js';
+import { reduceFields } from './reduceFields.js';
 import { transformWhereQuery } from './transformWhereQuery.js';
 import validateWhereQuery from './validateWhereQuery.js';
 import './index.scss';
@@ -18,7 +18,6 @@ const baseClass = 'where-builder';
  * It is part of the {@link ListControls} component which is used to render the controls (search, filter, where).
  */
 export const WhereBuilder = props => {
-  const $ = _c(30);
   const {
     collectionPluralLabel,
     fields,
@@ -28,276 +27,186 @@ export const WhereBuilder = props => {
     i18n,
     t
   } = useTranslation();
-  let t0;
-  if ($[0] !== fields || $[1] !== i18n) {
-    t0 = () => reduceClientFields({
-      fields,
-      i18n
-    });
-    $[0] = fields;
-    $[1] = i18n;
-    $[2] = t0;
-  } else {
-    t0 = $[2];
-  }
-  const [options, setOptions] = useState(t0);
-  let t1;
-  let t2;
-  if ($[3] !== fields || $[4] !== i18n) {
-    t1 = () => {
-      setOptions(reduceClientFields({
-        fields,
-        i18n
-      }));
-    };
-    t2 = [fields, i18n];
-    $[3] = fields;
-    $[4] = i18n;
-    $[5] = t1;
-    $[6] = t2;
-  } else {
-    t1 = $[5];
-    t2 = $[6];
-  }
-  useEffect(t1, t2);
+  const reducedFields = useMemo(() => reduceFields({
+    fields,
+    i18n
+  }), [fields, i18n]);
   const {
     handleWhereChange,
     query
   } = useListQuery();
   const [shouldUpdateQuery, setShouldUpdateQuery] = React.useState(false);
-  let t3;
-  if ($[7] !== query.where) {
-    t3 = () => {
-      const whereFromSearch = query.where;
-      if (whereFromSearch) {
-        if (validateWhereQuery(whereFromSearch)) {
-          return whereFromSearch.or;
-        }
-        const transformedWhere = transformWhereQuery(whereFromSearch);
-        if (validateWhereQuery(transformedWhere)) {
-          return transformedWhere.or;
-        }
-        console.warn(`Invalid where query in URL: ${JSON.stringify(whereFromSearch)}`);
+  const [conditions, setConditions] = React.useState(() => {
+    const whereFromSearch = query.where;
+    if (whereFromSearch) {
+      if (validateWhereQuery(whereFromSearch)) {
+        return whereFromSearch.or;
       }
-      return [];
-    };
-    $[7] = query.where;
-    $[8] = t3;
-  } else {
-    t3 = $[8];
-  }
-  const [conditions, setConditions] = React.useState(t3);
-  let t4;
-  if ($[9] !== conditions) {
-    t4 = t5 => {
-      const {
-        andIndex,
-        fieldName,
-        orIndex,
-        relation
-      } = t5;
-      const newConditions = [...conditions];
-      if (relation === "and") {
-        newConditions[orIndex].and.splice(andIndex, 0, {
-          [fieldName]: {}
-        });
-      } else {
-        newConditions.push({
-          and: [{
-            [fieldName]: {}
-          }]
-        });
+      // Transform the where query to be in the right format. This will transform something simple like [text][equals]=example%20post to the right format
+      const transformedWhere = transformWhereQuery(whereFromSearch);
+      if (validateWhereQuery(transformedWhere)) {
+        return transformedWhere.or;
       }
-      setConditions(newConditions);
-    };
-    $[9] = conditions;
-    $[10] = t4;
-  } else {
-    t4 = $[10];
-  }
-  const addCondition = t4;
-  let t5;
-  if ($[11] !== conditions) {
-    t5 = t6 => {
-      const {
-        andIndex: andIndex_0,
-        fieldName: fieldName_0,
-        operator,
-        orIndex: orIndex_0,
-        value: valueArg
-      } = t6;
-      const existingRowCondition = conditions[orIndex_0].and[andIndex_0];
-      if (typeof existingRowCondition === "object" && fieldName_0 && operator) {
-        const value = valueArg ?? (operator ? existingRowCondition[operator] : "");
-        const newRowCondition = {
-          [fieldName_0]: operator ? {
-            [operator]: value
-          } : {}
-        };
-        if (JSON.stringify(existingRowCondition) !== JSON.stringify(newRowCondition)) {
-          const newConditions_0 = [...conditions];
-          newConditions_0[orIndex_0].and[andIndex_0] = newRowCondition;
-          setConditions(newConditions_0);
-          if (![null, undefined].includes(value)) {
-            setShouldUpdateQuery(true);
+      console.warn(`Invalid where query in URL: ${JSON.stringify(whereFromSearch)}`) // eslint-disable-line no-console
+      ;
+    }
+    return [];
+  });
+  const addCondition = React.useCallback(({
+    andIndex,
+    field,
+    orIndex,
+    relation
+  }) => {
+    const newConditions = [...conditions];
+    const defaultOperator = fieldTypes[field.field.type].operators[0].value;
+    if (relation === 'and') {
+      newConditions[orIndex].and.splice(andIndex, 0, {
+        [field.value]: {
+          [defaultOperator]: undefined
+        }
+      });
+    } else {
+      newConditions.push({
+        and: [{
+          [field.value]: {
+            [defaultOperator]: undefined
           }
+        }]
+      });
+    }
+    setConditions(newConditions);
+  }, [conditions]);
+  const updateCondition = React.useCallback(({
+    andIndex: andIndex_0,
+    field: field_0,
+    operator: incomingOperator,
+    orIndex: orIndex_0,
+    value: valueArg
+  }) => {
+    const existingRowCondition = conditions[orIndex_0].and[andIndex_0];
+    const defaults = fieldTypes[field_0.field.type];
+    const operator = incomingOperator || defaults.operators[0].value;
+    if (typeof existingRowCondition === 'object' && field_0.value) {
+      const value = valueArg ?? existingRowCondition?.[operator];
+      const newRowCondition = {
+        [field_0.value]: {
+          [operator]: value
         }
-      }
-    };
-    $[11] = conditions;
-    $[12] = t5;
-  } else {
-    t5 = $[12];
-  }
-  const updateCondition = t5;
-  let t6;
-  if ($[13] !== conditions) {
-    t6 = t7 => {
-      const {
-        andIndex: andIndex_1,
-        orIndex: orIndex_1
-      } = t7;
-      const newConditions_1 = [...conditions];
-      newConditions_1[orIndex_1].and.splice(andIndex_1, 1);
-      if (newConditions_1[orIndex_1].and.length === 0) {
-        newConditions_1.splice(orIndex_1, 1);
-      }
-      setConditions(newConditions_1);
+      };
+      const newConditions_0 = [...conditions];
+      newConditions_0[orIndex_0].and[andIndex_0] = newRowCondition;
+      setConditions(newConditions_0);
       setShouldUpdateQuery(true);
-    };
-    $[13] = conditions;
-    $[14] = t6;
-  } else {
-    t6 = $[14];
-  }
-  const removeCondition = t6;
-  let t7;
-  let t8;
-  if ($[15] !== conditions || $[16] !== handleWhereChange || $[17] !== shouldUpdateQuery) {
-    t7 = () => {
-      if (shouldUpdateQuery) {
-        const handleChange = async function handleChange() {
-          await handleWhereChange({
-            or: conditions
-          });
-          setShouldUpdateQuery(false);
-        };
-        handleChange();
+    }
+  }, [conditions]);
+  const removeCondition = React.useCallback(({
+    andIndex: andIndex_1,
+    orIndex: orIndex_1
+  }) => {
+    const newConditions_1 = [...conditions];
+    newConditions_1[orIndex_1].and.splice(andIndex_1, 1);
+    if (newConditions_1[orIndex_1].and.length === 0) {
+      newConditions_1.splice(orIndex_1, 1);
+    }
+    setConditions(newConditions_1);
+    setShouldUpdateQuery(true);
+  }, [conditions]);
+  React.useEffect(() => {
+    if (shouldUpdateQuery) {
+      async function handleChange() {
+        await handleWhereChange({
+          or: conditions
+        });
+        setShouldUpdateQuery(false);
       }
-    };
-    t8 = [conditions, handleWhereChange, shouldUpdateQuery];
-    $[15] = conditions;
-    $[16] = handleWhereChange;
-    $[17] = shouldUpdateQuery;
-    $[18] = t7;
-    $[19] = t8;
-  } else {
-    t7 = $[18];
-    t8 = $[19];
-  }
-  React.useEffect(t7, t8);
-  let t9;
-  if ($[20] !== addCondition || $[21] !== collectionPluralLabel || $[22] !== conditions || $[23] !== i18n || $[24] !== options || $[25] !== removeCondition || $[26] !== renderedFilters || $[27] !== t || $[28] !== updateCondition) {
-    t9 = _jsxs("div", {
-      className: baseClass,
-      children: [conditions.length > 0 && _jsxs(React.Fragment, {
-        children: [_jsx("div", {
-          className: `${baseClass}__label`,
-          children: t("general:filterWhere", {
-            label: getTranslation(collectionPluralLabel, i18n)
-          })
-        }), _jsx("ul", {
-          className: `${baseClass}__or-filters`,
-          children: conditions.map((or, orIndex_2) => {
-            const compoundOrKey = `${orIndex_2}_${Array.isArray(or?.and) ? or.and.length : ""}`;
-            return _jsxs("li", {
-              children: [orIndex_2 !== 0 && _jsx("div", {
-                className: `${baseClass}__label`,
-                children: t("general:or")
-              }), _jsx("ul", {
-                className: `${baseClass}__and-filters`,
-                children: Array.isArray(or?.and) && or.and.map((_, andIndex_2) => {
-                  const initialFieldName = Object.keys(conditions[orIndex_2].and[andIndex_2])[0];
-                  const initialOperator = Object.keys(conditions[orIndex_2].and[andIndex_2]?.[initialFieldName] || {})?.[0] || undefined;
-                  const initialValue = conditions[orIndex_2].and[andIndex_2]?.[initialFieldName]?.[initialOperator] || undefined;
-                  return _jsxs("li", {
-                    children: [andIndex_2 !== 0 && _jsx("div", {
-                      className: `${baseClass}__label`,
-                      children: t("general:and")
-                    }), _jsx(Condition, {
-                      addCondition,
-                      andIndex: andIndex_2,
-                      fieldName: initialFieldName,
-                      initialValue,
-                      operator: initialOperator,
-                      options,
-                      orIndex: orIndex_2,
-                      removeCondition,
-                      RenderedFilter: renderedFilters?.get(initialFieldName),
-                      updateCondition
-                    })]
-                  }, andIndex_2);
-                })
-              })]
-            }, compoundOrKey);
-          })
-        }), _jsx(Button, {
-          buttonStyle: "icon-label",
-          className: `${baseClass}__add-or`,
-          icon: "plus",
-          iconPosition: "left",
-          iconStyle: "with-border",
-          onClick: () => {
+      void handleChange();
+    }
+  }, [conditions, handleWhereChange, shouldUpdateQuery]);
+  return /*#__PURE__*/_jsxs("div", {
+    className: baseClass,
+    children: [conditions.length > 0 && /*#__PURE__*/_jsxs(React.Fragment, {
+      children: [/*#__PURE__*/_jsx("div", {
+        className: `${baseClass}__label`,
+        children: t('general:filterWhere', {
+          label: getTranslation(collectionPluralLabel, i18n)
+        })
+      }), /*#__PURE__*/_jsx("ul", {
+        className: `${baseClass}__or-filters`,
+        children: conditions.map((or, orIndex_2) => {
+          const compoundOrKey = `${orIndex_2}_${Array.isArray(or?.and) ? or.and.length : ''}`;
+          return /*#__PURE__*/_jsxs("li", {
+            children: [orIndex_2 !== 0 && /*#__PURE__*/_jsx("div", {
+              className: `${baseClass}__label`,
+              children: t('general:or')
+            }), /*#__PURE__*/_jsx("ul", {
+              className: `${baseClass}__and-filters`,
+              children: Array.isArray(or?.and) && or.and.map((_, andIndex_2) => {
+                const condition = conditions[orIndex_2].and[andIndex_2];
+                const fieldName = Object.keys(condition)[0];
+                const operator_0 = Object.keys(condition?.[fieldName] || {})?.[0] || undefined;
+                const value_0 = condition?.[fieldName]?.[operator_0] || undefined;
+                return /*#__PURE__*/_jsxs("li", {
+                  children: [andIndex_2 !== 0 && /*#__PURE__*/_jsx("div", {
+                    className: `${baseClass}__label`,
+                    children: t('general:and')
+                  }), /*#__PURE__*/_jsx(Condition, {
+                    addCondition: addCondition,
+                    andIndex: andIndex_2,
+                    fieldName: fieldName,
+                    operator: operator_0,
+                    orIndex: orIndex_2,
+                    reducedFields: reducedFields,
+                    removeCondition: removeCondition,
+                    RenderedFilter: renderedFilters?.get(fieldName),
+                    updateCondition: updateCondition,
+                    value: value_0
+                  })]
+                }, andIndex_2);
+              })
+            })]
+          }, compoundOrKey);
+        })
+      }), /*#__PURE__*/_jsx(Button, {
+        buttonStyle: "icon-label",
+        className: `${baseClass}__add-or`,
+        icon: "plus",
+        iconPosition: "left",
+        iconStyle: "with-border",
+        onClick: () => {
+          addCondition({
+            andIndex: 0,
+            field: reducedFields[0],
+            orIndex: conditions.length,
+            relation: 'or'
+          });
+        },
+        children: t('general:or')
+      })]
+    }), conditions.length === 0 && /*#__PURE__*/_jsxs("div", {
+      className: `${baseClass}__no-filters`,
+      children: [/*#__PURE__*/_jsx("div", {
+        className: `${baseClass}__label`,
+        children: t('general:noFiltersSet')
+      }), /*#__PURE__*/_jsx(Button, {
+        buttonStyle: "icon-label",
+        className: `${baseClass}__add-first-filter`,
+        icon: "plus",
+        iconPosition: "left",
+        iconStyle: "with-border",
+        onClick: () => {
+          if (reducedFields.length > 0) {
             addCondition({
               andIndex: 0,
-              fieldName: options[0].value,
+              field: reducedFields.find(field_1 => !field_1.field.admin?.disableListFilter),
               orIndex: conditions.length,
-              relation: "or"
+              relation: 'or'
             });
-          },
-          children: t("general:or")
-        })]
-      }), conditions.length === 0 && _jsxs("div", {
-        className: `${baseClass}__no-filters`,
-        children: [_jsx("div", {
-          className: `${baseClass}__label`,
-          children: t("general:noFiltersSet")
-        }), _jsx(Button, {
-          buttonStyle: "icon-label",
-          className: `${baseClass}__add-first-filter`,
-          icon: "plus",
-          iconPosition: "left",
-          iconStyle: "with-border",
-          onClick: () => {
-            if (options.length > 0) {
-              addCondition({
-                andIndex: 0,
-                fieldName: options.find(_temp).value,
-                orIndex: conditions.length,
-                relation: "or"
-              });
-            }
-          },
-          children: t("general:addFilter")
-        })]
+          }
+        },
+        children: t('general:addFilter')
       })]
-    });
-    $[20] = addCondition;
-    $[21] = collectionPluralLabel;
-    $[22] = conditions;
-    $[23] = i18n;
-    $[24] = options;
-    $[25] = removeCondition;
-    $[26] = renderedFilters;
-    $[27] = t;
-    $[28] = updateCondition;
-    $[29] = t9;
-  } else {
-    t9 = $[29];
-  }
-  return t9;
+    })]
+  });
 };
-function _temp(field) {
-  return !field.field.admin?.disableListFilter;
-}
 //# sourceMappingURL=index.js.map

package/dist/elements/WhereBuilder/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["c","_c","getTranslation","React","useEffect","useState","useListQuery","useTranslation","Button","Condition","reduceClientFields","transformWhereQuery","validateWhereQuery","baseClass","WhereBuilder","props","$","collectionPluralLabel","fields","renderedFilters","i18n","t","t0","options","setOptions","t1","t2","handleWhereChange","query","shouldUpdateQuery","setShouldUpdateQuery","t3","where","whereFromSearch","or","transformedWhere","console","warn","JSON","stringify","conditions","setConditions","t4","t5","andIndex","fieldName","orIndex","relation","newConditions","and","splice","push","addCondition","t6","andIndex_0","fieldName_0","operator","orIndex_0","value","valueArg","existingRowCondition","newRowCondition","newConditions_0","undefined","includes","updateCondition","t7","andIndex_1","orIndex_1","newConditions_1","length","removeCondition","t8","handleChange","t9","_jsxs","className","children","Fragment","_jsx","label","map","orIndex_2","compoundOrKey","Array","isArray","_","andIndex_2","initialFieldName","Object","keys","initialOperator","initialValue","RenderedFilter","get","buttonStyle","icon","iconPosition","iconStyle","onClick","find","_temp","field","admin","disableListFilter"],"sources":["../../../src/elements/WhereBuilder/index.tsx"],"sourcesContent":["'use client'\nimport type { Operator } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { useEffect, useState } from 'react'\n\nimport type { WhereBuilderProps } from './types.js'\n\nimport { useListQuery } from '../../providers/ListQuery/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Button } from '../Button/index.js'\nimport { Condition } from './Condition/index.js'\nimport { reduceClientFields } from './reduceClientFields.js'\nimport { transformWhereQuery } from './transformWhereQuery.js'\nimport validateWhereQuery from './validateWhereQuery.js'\nimport './index.scss'\n\nconst baseClass = 'where-builder'\n\nexport { WhereBuilderProps }\n\n/**\n * The WhereBuilder component is used to render the filter controls for a collection's list view.\n * It is part of the {@link ListControls} component which is used to render the controls (search, filter, where).\n */\nexport const WhereBuilder: React.FC<WhereBuilderProps> = (props) => {\n  const { collectionPluralLabel, fields, renderedFilters } = props\n  const { i18n, t } = useTranslation()\n\n  const [options, setOptions] = useState(() => reduceClientFields({ fields, i18n }))\n\n  useEffect(() => {\n    setOptions(reduceClientFields({ fields, i18n }))\n  }, [fields, i18n])\n\n  const { handleWhereChange, query } = useListQuery()\n  const [shouldUpdateQuery, setShouldUpdateQuery] = React.useState(false)\n\n  // This handles initializing the where conditions from the search query (URL). That way, if you pass in\n  // query params to the URL, the where conditions will be initialized from those and displayed in the UI.\n  // Example: /admin/collections/posts?where[or][0][and][0][text][equals]=example%20post\n  /*\n    stored conditions look like this:\n    [\n      _or_ & _and_ queries have the same shape:\n      {\n        and: [{\n          category: {\n            equals: 'category-a'\n          }\n        }]\n      },\n\n      {\n        and:[{\n          category: {\n            equals: 'category-b'\n          },\n          text: {\n            not_equals: 'oranges'\n          },\n        }]\n      }\n    ]\n  */\n\n  const [conditions, setConditions] = React.useState(() => {\n    const whereFromSearch = query.where\n\n    if (whereFromSearch) {\n      if (validateWhereQuery(whereFromSearch)) {\n        return whereFromSearch.or\n      }\n      // Transform the where query to be in the right format. This will transform something simple like [text][equals]=example%20post to the right format\n      const transformedWhere = transformWhereQuery(whereFromSearch)\n\n      if (validateWhereQuery(transformedWhere)) {\n        return transformedWhere.or\n      }\n\n      console.warn(`Invalid where query in URL: ${JSON.stringify(whereFromSearch)}`) // eslint-disable-line no-console\n    }\n\n    return []\n  })\n\n  const addCondition = React.useCallback(\n    ({ andIndex, fieldName, orIndex, relation }) => {\n      const newConditions = [...conditions]\n      if (relation === 'and') {\n        newConditions[orIndex].and.splice(andIndex, 0, { [fieldName]: {} })\n      } else {\n        newConditions.push({\n          and: [\n            {\n              [fieldName]: {},\n            },\n          ],\n        })\n      }\n      setConditions(newConditions)\n    },\n    [conditions],\n  )\n\n  const updateCondition = React.useCallback(\n    ({ andIndex, fieldName, operator, orIndex, value: valueArg }) => {\n      const existingRowCondition = conditions[orIndex].and[andIndex]\n      if (typeof existingRowCondition === 'object' && fieldName && operator) {\n        const value = valueArg ?? (operator ? existingRowCondition[operator] : '')\n        const newRowCondition = {\n          [fieldName]: operator ? { [operator]: value } : {},\n        }\n\n        if (JSON.stringify(existingRowCondition) !== JSON.stringify(newRowCondition)) {\n          const newConditions = [...conditions]\n          newConditions[orIndex].and[andIndex] = newRowCondition\n          setConditions(newConditions)\n          if (![null, undefined].includes(value)) {\n            // only update query when field/operator/value are filled out\n            setShouldUpdateQuery(true)\n          }\n        }\n      }\n    },\n    [conditions],\n  )\n\n  const removeCondition = React.useCallback(\n    ({ andIndex, orIndex }) => {\n      const newConditions = [...conditions]\n      newConditions[orIndex].and.splice(andIndex, 1)\n      if (newConditions[orIndex].and.length === 0) {\n        newConditions.splice(orIndex, 1)\n      }\n      setConditions(newConditions)\n      setShouldUpdateQuery(true)\n    },\n    [conditions],\n  )\n\n  React.useEffect(() => {\n    if (shouldUpdateQuery) {\n      async function handleChange() {\n        await handleWhereChange({ or: conditions })\n        setShouldUpdateQuery(false)\n      }\n      void handleChange()\n    }\n  }, [conditions, handleWhereChange, shouldUpdateQuery])\n\n  return (\n    <div className={baseClass}>\n      {conditions.length > 0 && (\n        <React.Fragment>\n          <div className={`${baseClass}__label`}>\n            {t('general:filterWhere', { label: getTranslation(collectionPluralLabel, i18n) })}\n          </div>\n          <ul className={`${baseClass}__or-filters`}>\n            {conditions.map((or, orIndex) => {\n              const compoundOrKey = `${orIndex}_${Array.isArray(or?.and) ? or.and.length : ''}`\n\n              return (\n                <li key={compoundOrKey}>\n                  {orIndex !== 0 && <div className={`${baseClass}__label`}>{t('general:or')}</div>}\n                  <ul className={`${baseClass}__and-filters`}>\n                    {Array.isArray(or?.and) &&\n                      or.and.map((_, andIndex) => {\n                        const initialFieldName = Object.keys(conditions[orIndex].and[andIndex])[0]\n                        const initialOperator =\n                          (Object.keys(\n                            conditions[orIndex].and[andIndex]?.[initialFieldName] || {},\n                          )?.[0] as Operator) || undefined\n                        const initialValue =\n                          conditions[orIndex].and[andIndex]?.[initialFieldName]?.[\n                            initialOperator\n                          ] || undefined\n\n                        return (\n                          <li key={andIndex}>\n                            {andIndex !== 0 && (\n                              <div className={`${baseClass}__label`}>{t('general:and')}</div>\n                            )}\n                            <Condition\n                              addCondition={addCondition}\n                              andIndex={andIndex}\n                              fieldName={initialFieldName}\n                              initialValue={initialValue}\n                              operator={initialOperator}\n                              options={options}\n                              orIndex={orIndex}\n                              removeCondition={removeCondition}\n                              RenderedFilter={renderedFilters?.get(initialFieldName)}\n                              updateCondition={updateCondition}\n                            />\n                          </li>\n                        )\n                      })}\n                  </ul>\n                </li>\n              )\n            })}\n          </ul>\n          <Button\n            buttonStyle=\"icon-label\"\n            className={`${baseClass}__add-or`}\n            icon=\"plus\"\n            iconPosition=\"left\"\n            iconStyle=\"with-border\"\n            onClick={() => {\n              addCondition({\n                andIndex: 0,\n                fieldName: options[0].value,\n                orIndex: conditions.length,\n                relation: 'or',\n              })\n            }}\n          >\n            {t('general:or')}\n          </Button>\n        </React.Fragment>\n      )}\n      {conditions.length === 0 && (\n        <div className={`${baseClass}__no-filters`}>\n          <div className={`${baseClass}__label`}>{t('general:noFiltersSet')}</div>\n          <Button\n            buttonStyle=\"icon-label\"\n            className={`${baseClass}__add-first-filter`}\n            icon=\"plus\"\n            iconPosition=\"left\"\n            iconStyle=\"with-border\"\n            onClick={() => {\n              if (options.length > 0) {\n                addCondition({\n                  andIndex: 0,\n                  fieldName: options.find((field) => !field.field.admin?.disableListFilter).value,\n                  orIndex: conditions.length,\n                  relation: 'or',\n                })\n              }\n            }}\n          >\n            {t('general:addFilter')}\n          </Button>\n        </div>\n      )}\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"index.js","names":["getTranslation","React","useMemo","useListQuery","useTranslation","Button","Condition","fieldTypes","reduceFields","transformWhereQuery","validateWhereQuery","baseClass","WhereBuilder","props","collectionPluralLabel","fields","renderedFilters","i18n","t","reducedFields","handleWhereChange","query","shouldUpdateQuery","setShouldUpdateQuery","useState","conditions","setConditions","whereFromSearch","where","or","transformedWhere","console","warn","JSON","stringify","addCondition","useCallback","andIndex","field","orIndex","relation","newConditions","defaultOperator","type","operators","value","and","splice","undefined","push","updateCondition","operator","incomingOperator","valueArg","existingRowCondition","defaults","newRowCondition","removeCondition","length","useEffect","handleChange","_jsxs","className","Fragment","_jsx","label","map","compoundOrKey","Array","isArray","_","condition","fieldName","Object","keys","RenderedFilter","get","buttonStyle","icon","iconPosition","iconStyle","onClick","find","admin","disableListFilter"],"sources":["../../../src/elements/WhereBuilder/index.tsx"],"sourcesContent":["'use client'\nimport type { Operator, Where } from 'payload'\n\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { useMemo } from 'react'\n\nimport type { AddCondition, UpdateCondition, WhereBuilderProps } from './types.js'\n\nimport { useListQuery } from '../../providers/ListQuery/index.js'\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { Button } from '../Button/index.js'\nimport { Condition } from './Condition/index.js'\nimport fieldTypes from './field-types.js'\nimport { reduceFields } from './reduceFields.js'\nimport { transformWhereQuery } from './transformWhereQuery.js'\nimport validateWhereQuery from './validateWhereQuery.js'\nimport './index.scss'\n\nconst baseClass = 'where-builder'\n\nexport { WhereBuilderProps }\n\n/**\n * The WhereBuilder component is used to render the filter controls for a collection's list view.\n * It is part of the {@link ListControls} component which is used to render the controls (search, filter, where).\n */\nexport const WhereBuilder: React.FC<WhereBuilderProps> = (props) => {\n  const { collectionPluralLabel, fields, renderedFilters } = props\n  const { i18n, t } = useTranslation()\n\n  const reducedFields = useMemo(() => reduceFields({ fields, i18n }), [fields, i18n])\n\n  const { handleWhereChange, query } = useListQuery()\n  const [shouldUpdateQuery, setShouldUpdateQuery] = React.useState(false)\n\n  const [conditions, setConditions] = React.useState<Where[]>(() => {\n    const whereFromSearch = query.where\n\n    if (whereFromSearch) {\n      if (validateWhereQuery(whereFromSearch)) {\n        return whereFromSearch.or\n      }\n\n      // Transform the where query to be in the right format. This will transform something simple like [text][equals]=example%20post to the right format\n      const transformedWhere = transformWhereQuery(whereFromSearch)\n\n      if (validateWhereQuery(transformedWhere)) {\n        return transformedWhere.or\n      }\n\n      console.warn(`Invalid where query in URL: ${JSON.stringify(whereFromSearch)}`) // eslint-disable-line no-console\n    }\n\n    return []\n  })\n\n  const addCondition: AddCondition = React.useCallback(\n    ({ andIndex, field, orIndex, relation }) => {\n      const newConditions = [...conditions]\n\n      const defaultOperator = fieldTypes[field.field.type].operators[0].value\n\n      if (relation === 'and') {\n        newConditions[orIndex].and.splice(andIndex, 0, {\n          [field.value]: {\n            [defaultOperator]: undefined,\n          },\n        })\n      } else {\n        newConditions.push({\n          and: [\n            {\n              [field.value]: {\n                [defaultOperator]: undefined,\n              },\n            },\n          ],\n        })\n      }\n\n      setConditions(newConditions)\n    },\n    [conditions],\n  )\n\n  const updateCondition: UpdateCondition = React.useCallback(\n    ({ andIndex, field, operator: incomingOperator, orIndex, value: valueArg }) => {\n      const existingRowCondition = conditions[orIndex].and[andIndex]\n\n      const defaults = fieldTypes[field.field.type]\n      const operator = incomingOperator || defaults.operators[0].value\n\n      if (typeof existingRowCondition === 'object' && field.value) {\n        const value = valueArg ?? existingRowCondition?.[operator]\n\n        const newRowCondition = {\n          [field.value]: { [operator]: value },\n        }\n\n        const newConditions = [...conditions]\n        newConditions[orIndex].and[andIndex] = newRowCondition\n\n        setConditions(newConditions)\n        setShouldUpdateQuery(true)\n      }\n    },\n    [conditions],\n  )\n\n  const removeCondition = React.useCallback(\n    ({ andIndex, orIndex }) => {\n      const newConditions = [...conditions]\n      newConditions[orIndex].and.splice(andIndex, 1)\n\n      if (newConditions[orIndex].and.length === 0) {\n        newConditions.splice(orIndex, 1)\n      }\n\n      setConditions(newConditions)\n      setShouldUpdateQuery(true)\n    },\n    [conditions],\n  )\n\n  React.useEffect(() => {\n    if (shouldUpdateQuery) {\n      async function handleChange() {\n        await handleWhereChange({ or: conditions })\n        setShouldUpdateQuery(false)\n      }\n      void handleChange()\n    }\n  }, [conditions, handleWhereChange, shouldUpdateQuery])\n\n  return (\n    <div className={baseClass}>\n      {conditions.length > 0 && (\n        <React.Fragment>\n          <div className={`${baseClass}__label`}>\n            {t('general:filterWhere', { label: getTranslation(collectionPluralLabel, i18n) })}\n          </div>\n          <ul className={`${baseClass}__or-filters`}>\n            {conditions.map((or, orIndex) => {\n              const compoundOrKey = `${orIndex}_${Array.isArray(or?.and) ? or.and.length : ''}`\n\n              return (\n                <li key={compoundOrKey}>\n                  {orIndex !== 0 && <div className={`${baseClass}__label`}>{t('general:or')}</div>}\n                  <ul className={`${baseClass}__and-filters`}>\n                    {Array.isArray(or?.and) &&\n                      or.and.map((_, andIndex) => {\n                        const condition = conditions[orIndex].and[andIndex]\n                        const fieldName = Object.keys(condition)[0]\n\n                        const operator =\n                          (Object.keys(condition?.[fieldName] || {})?.[0] as Operator) || undefined\n\n                        const value = condition?.[fieldName]?.[operator] || undefined\n\n                        return (\n                          <li key={andIndex}>\n                            {andIndex !== 0 && (\n                              <div className={`${baseClass}__label`}>{t('general:and')}</div>\n                            )}\n                            <Condition\n                              addCondition={addCondition}\n                              andIndex={andIndex}\n                              fieldName={fieldName}\n                              operator={operator}\n                              orIndex={orIndex}\n                              reducedFields={reducedFields}\n                              removeCondition={removeCondition}\n                              RenderedFilter={renderedFilters?.get(fieldName)}\n                              updateCondition={updateCondition}\n                              value={value}\n                            />\n                          </li>\n                        )\n                      })}\n                  </ul>\n                </li>\n              )\n            })}\n          </ul>\n          <Button\n            buttonStyle=\"icon-label\"\n            className={`${baseClass}__add-or`}\n            icon=\"plus\"\n            iconPosition=\"left\"\n            iconStyle=\"with-border\"\n            onClick={() => {\n              addCondition({\n                andIndex: 0,\n                field: reducedFields[0],\n                orIndex: conditions.length,\n                relation: 'or',\n              })\n            }}\n          >\n            {t('general:or')}\n          </Button>\n        </React.Fragment>\n      )}\n      {conditions.length === 0 && (\n        <div className={`${baseClass}__no-filters`}>\n          <div className={`${baseClass}__label`}>{t('general:noFiltersSet')}</div>\n          <Button\n            buttonStyle=\"icon-label\"\n            className={`${baseClass}__add-first-filter`}\n            icon=\"plus\"\n            iconPosition=\"left\"\n            iconStyle=\"with-border\"\n            onClick={() => {\n              if (reducedFields.length > 0) {\n                addCondition({\n                  andIndex: 0,\n                  field: reducedFields.find((field) => !field.field.admin?.disableListFilter),\n                  orIndex: conditions.length,\n                  relation: 'or',\n                })\n              }\n            }}\n          >\n            {t('general:addFilter')}\n          </Button>\n        </div>\n      )}\n    </div>\n  )\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/elements/WhereBuilder/{reduceClientFields.d.ts → reduceFields.d.ts}

@@ -1,7 +1,7 @@
 import type { I18nClient } from '@payloadcms/translations';
 import type { ClientField } from 'payload';
-import type { FieldCondition } from './types.js';
-export type ReduceClientFieldsArgs = {
+import type { ReducedField } from './types.js';
+type ReduceFieldOptionsArgs = {
     fields: ClientField[];
     i18n: I18nClient;
     labelPrefix?: string;
@@ -11,5 +11,6 @@ export type ReduceClientFieldsArgs = {
  * Reduces a field map to a flat array of fields with labels and values.
  * Used in the WhereBuilder component to render the fields in the dropdown.
  */
-export declare const reduceClientFields: ({ fields, i18n, labelPrefix, pathPrefix, }: ReduceClientFieldsArgs) => FieldCondition[];
-//# sourceMappingURL=reduceClientFields.d.ts.map
+export declare const reduceFields: ({ fields, i18n, labelPrefix, pathPrefix, }: ReduceFieldOptionsArgs) => ReducedField[];
+export {};
+//# sourceMappingURL=reduceFields.d.ts.map

package/dist/elements/WhereBuilder/reduceFields.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"reduceFields.d.ts","sourceRoot":"","sources":["../../../src/elements/WhereBuilder/reduceFields.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAyB,UAAU,EAAE,MAAM,0BAA0B,CAAA;AACjF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAK1C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAM9C,KAAK,sBAAsB,GAAG;IAC5B,MAAM,EAAE,WAAW,EAAE,CAAA;IACrB,IAAI,EAAE,UAAU,CAAA;IAChB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,UAAU,CAAC,EAAE,MAAM,CAAA;CACpB,CAAA;AAED;;;GAGG;AACH,eAAO,MAAM,YAAY,+CAKtB,sBAAsB,KAAG,YAAY,EA4IvC,CAAA"}

package/dist/elements/WhereBuilder/{reduceClientFields.js → reduceFields.js}

@@ -9,7 +9,7 @@ import fieldTypes from './field-types.js';
  * Reduces a field map to a flat array of fields with labels and values.
  * Used in the WhereBuilder component to render the fields in the dropdown.
  */
-export const reduceClientFields = ({
+export const reduceFields = ({
   fields,
   i18n,
   labelPrefix,
@@ -29,7 +29,7 @@ export const reduceClientFields = ({
           // Make sure we handle nested tabs
           const tabPathPrefix = tabHasName(tab) && tab.name ? pathPrefix ? pathPrefix + '.' + tab.name : tab.name : pathPrefix;
           if (typeof localizedTabLabel === 'string') {
-            reduced.push(...reduceClientFields({
+            reduced.push(...reduceFields({
               fields: tab.fields,
               i18n,
               labelPrefix: labelWithPrefix,
@@ -42,7 +42,7 @@ export const reduceClientFields = ({
     }
     // Rows cant have labels, so we need to handle them differently
     if (field.type === 'row' && 'fields' in field) {
-      reduced.push(...reduceClientFields({
+      reduced.push(...reduceFields({
         fields: field.fields,
         i18n,
         labelPrefix,
@@ -53,7 +53,7 @@ export const reduceClientFields = ({
     if (field.type === 'collapsible' && 'fields' in field) {
       const localizedTabLabel = getTranslation(field.label || '', i18n);
       const labelWithPrefix = labelPrefix ? labelPrefix + ' > ' + localizedTabLabel : localizedTabLabel;
-      reduced.push(...reduceClientFields({
+      reduced.push(...reduceFields({
         fields: field.fields,
         i18n,
         labelPrefix: labelWithPrefix,
@@ -66,7 +66,7 @@ export const reduceClientFields = ({
       const labelWithPrefix = labelPrefix ? translatedLabel ? labelPrefix + ' > ' + translatedLabel : labelPrefix : translatedLabel;
       // Make sure we handle deeply nested groups
       const pathWithPrefix = field.name ? pathPrefix ? pathPrefix + '.' + field.name : field.name : pathPrefix;
-      reduced.push(...reduceClientFields({
+      reduced.push(...reduceFields({
         fields: field.fields,
         i18n,
         labelPrefix: labelWithPrefix,
@@ -92,10 +92,10 @@ export const reduceClientFields = ({
         field,
         prefix: labelPrefix
       }) : localizedLabel;
-      const formattedValue = pathPrefix ? createNestedClientFieldPath(pathPrefix, field) : field.name;
+      const fieldPath = pathPrefix ? createNestedClientFieldPath(pathPrefix, field) : field.name;
       const formattedField = {
         label: formattedLabel,
-        value: formattedValue,
+        value: fieldPath,
         ...fieldTypes[field.type],
         field,
         operators
@@ -106,4 +106,4 @@ export const reduceClientFields = ({
     return reduced;
   }, []);
 };
-//# sourceMappingURL=reduceClientFields.js.map
+//# sourceMappingURL=reduceFields.js.map