@object-ui/fields 16.0.0 → 17.1.0

package/src/widgets/RadioField.tsx

@@ -1,25 +1,82 @@
-import React, { useId } from 'react';
+import React, { useId, useEffect } from 'react';
 import { RadioGroup, RadioGroupItem, Label, EmptyValue } from '@object-ui/components';
+import { isValueStillOffered, type OptionLike } from '@object-ui/core';
 import { FieldWidgetProps } from './types';
+import { useCascadingOptions } from './useCascadingOptions';
 
-interface Option { label: string; value: string }
+type Option = OptionLike;
 
 /**
  * RadioField - choose exactly one value from a fixed option set, rendered as a
  * radio group. The stored value is the selected option value (string). Used for
  * the `radio` field type.
+ *
+ * Like the single `SelectField`, options support per-option `visibleWhen`
+ * cascading + `dependsOn` gating (ADR-0058 / #2715), resolved through the shared
+ * {@link useCascadingOptions} hook: the offered radios narrow against the live
+ * form record + `current_user`, the control is gated behind a "select the parent
+ * first" hint while a dependency is empty, and a value no longer offered (parent
+ * changed / predicate flipped) is cleared.
  */
-export function RadioField({ value, onChange, field, readonly, className, ...props }: FieldWidgetProps<string>) {
-  const config = (field || (props as any).schema) as any;
-  const options: Option[] = config?.options || [];
+export function RadioField({
+  value,
+  onChange,
+  field,
+  readonly,
+  className,
+  schema,
+  dependentValues,
+  dependsOn: dependsOnProp,
+  emptyHint: _emptyHint,
+  dataSource: _dataSource,
+  ...props
+}: FieldWidgetProps<string>) {
+  const config = (field || schema) as any;
+  const rawOptions: Option[] = config?.options || [];
   const groupId = useId();
+  const fieldName = (props as any).name || config?.name || (props as any).id || '';
+
+  const dependsOn = config?.dependsOn ?? dependsOnProp;
+  const { options, gated, dependsOnFields } = useCascadingOptions<Option>(
+    rawOptions,
+    dependsOn,
+    dependentValues,
+  );
+
+  // Cascade clear: once the offered set no longer includes the current value
+  // (parent changed / predicate flipped), drop it so no stale pair persists.
+  useEffect(() => {
+    if (readonly) return;
+    if (value === undefined || value === null || (value as unknown) === '') return;
+    if (!isValueStillOffered(value, options)) onChange?.(undefined as unknown as string);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [options, gated]);
 
   if (readonly) {
     if (value == null || value === '') return <EmptyValue />;
-    const opt = options.find((o) => o.value === value);
+    // Label from the raw set so a stored value hidden by `visibleWhen` still
+    // renders its label rather than a bare id.
+    const opt = rawOptions.find((o) => o.value === value);
     return <span className="text-sm">{opt?.label || String(value)}</span>;
   }
 
+  // No offered options is unfillable — surface a legible state instead of an
+  // empty radio group: a dependency-gated list prompts for its controlling
+  // field; an unconfigured / fully-filtered list says so. Mirrors the select.
+  if (options.length === 0) {
+    const hint = gated
+      ? `Select ${dependsOnFields.join(' / ')} first`
+      : 'No options available';
+    return (
+      <div
+        data-testid={fieldName ? `radio-empty-${fieldName}` : undefined}
+        className="flex min-h-9 w-full items-center rounded-md border border-input bg-muted/30 px-3 py-2 text-sm text-muted-foreground"
+      >
+        {hint}
+      </div>
+    );
+  }
+
   return (
     <RadioGroup
       value={value ?? ''}
@@ -28,10 +85,13 @@ export function RadioField({ value, onChange, field, readonly, className, ...pro
       className={className}
     >
       {options.map((opt) => {
-        const id = `${groupId}-${opt.value}`;
+        // Radix speaks strings — stringify the (possibly numeric,
+        // #3090-widened) authored value at this boundary.
+        const value = String(opt.value);
+        const id = `${groupId}-${value}`;
         return (
-          <div key={opt.value} className="flex items-center space-x-2">
-            <RadioGroupItem value={opt.value} id={id} />
+          <div key={value} className="flex items-center space-x-2">
+            <RadioGroupItem value={value} id={id} data-testid={`radio-option-${value}`} />
             <Label htmlFor={id} className="font-normal">{opt.label}</Label>
           </div>
         );

package/src/widgets/RecipientPickerField.test.tsx

@@ -0,0 +1,157 @@
+/**
+ * ObjectUI
+ * Copyright (c) 2024-present ObjectStack Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * RecipientPickerField — the sharing-rule recipient picker (objectstack#3821).
+ *
+ * Two regressions are pinned here:
+ *  1. the candidate query must use the STRUCTURED `$orderby` form. It used to
+ *     pass the clause string `'name asc'`, which ApiDataSource walked
+ *     character by character into `0 n,1 a,2 m,…`; the server then sorted by
+ *     columns that don't exist and every recipient list came back empty, so
+ *     the control read "No matches" forever and no rule could be saved.
+ *  2. the placeholder must come from a per-type i18n key, not from
+ *     interpolating the enum value into an English sentence.
+ */
+import { describe, it, expect, vi } from 'vitest';
+import React from 'react';
+import { render, screen, waitFor, fireEvent } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import { RecipientPickerField } from './RecipientPickerField';
+
+const USERS = [
+  { id: 'usr_1', name: 'Ada Auditor' },
+  { id: 'usr_2', name: 'Bob Builder' },
+];
+
+function mockDataSource(rows: any[] = USERS) {
+  return { find: vi.fn().mockResolvedValue({ data: rows }) } as any;
+}
+
+function renderPicker(recipientType: string, dataSource: any, value = '') {
+  return render(
+    <RecipientPickerField
+      value={value}
+      onChange={vi.fn()}
+      field={{ name: 'recipient_id' } as any}
+      dataSource={dataSource}
+      dependentValues={{ recipient_type: recipientType }}
+    />,
+  );
+}
+
+describe('RecipientPickerField — candidate query', () => {
+  it('orders candidates with the structured $orderby form, never a clause string', async () => {
+    const ds = mockDataSource();
+    renderPicker('user', ds);
+
+    await waitFor(() => expect(ds.find).toHaveBeenCalled());
+    const [object, params] = ds.find.mock.calls[0];
+    expect(object).toBe('sys_user');
+    expect(params.$orderby).toEqual({ name: 'asc' });
+    // A bare string is what regressed; assert the shape explicitly.
+    expect(typeof params.$orderby).not.toBe('string');
+  });
+
+  it('queries the object mapped to each recipient type', async () => {
+    for (const [type, object] of [
+      ['user', 'sys_user'],
+      ['team', 'sys_team'],
+      ['business_unit', 'sys_business_unit'],
+      ['unit_and_subordinates', 'sys_business_unit'],
+      ['position', 'sys_position'],
+    ] as const) {
+      const ds = mockDataSource([]);
+      const { unmount } = renderPicker(type, ds);
+      await waitFor(() => expect(ds.find).toHaveBeenCalled());
+      expect(ds.find.mock.calls[0][0]).toBe(object);
+      unmount();
+    }
+  });
+
+  it('shows the loaded records as options once the list is opened', async () => {
+    const ds = mockDataSource();
+    renderPicker('user', ds);
+    await waitFor(() => expect(ds.find).toHaveBeenCalled());
+
+    fireEvent.click(screen.getByRole('combobox'));
+    expect(await screen.findByText('Ada Auditor')).toBeInTheDocument();
+    expect(screen.getByText('Bob Builder')).toBeInTheDocument();
+  });
+});
+
+describe('RecipientPickerField — keeping the stored recipient', () => {
+  function renderControlled(initialType: string, value: string, onChange: any) {
+    const ds = mockDataSource();
+    const view = render(
+      <RecipientPickerField
+        value={value}
+        onChange={onChange}
+        field={{ name: 'recipient_id' } as any}
+        dataSource={ds}
+        dependentValues={{ recipient_type: initialType }}
+      />,
+    );
+    const rerenderWith = (type: string) =>
+      view.rerender(
+        <RecipientPickerField
+          value={value}
+          onChange={onChange}
+          field={{ name: 'recipient_id' } as any}
+          dataSource={ds}
+          dependentValues={{ recipient_type: type }}
+        />,
+      );
+    return { ...view, rerenderWith };
+  }
+
+  it('keeps the saved recipient when the type arrives late (edit form hydrating)', async () => {
+    // The edit dialog mounts the widget before the record lands, so
+    // recipient_type is '' on the first render and 'user' on the next. That is
+    // hydration, not the admin changing the type — clearing there wiped the
+    // saved recipient and the blank got persisted on save.
+    const onChange = vi.fn();
+    const { rerenderWith } = renderControlled('', 'usr_1', onChange);
+    rerenderWith('user');
+    await waitFor(() => expect(onChange).not.toHaveBeenCalled());
+  });
+
+  it('clears the recipient when the admin actually switches type', async () => {
+    const onChange = vi.fn();
+    const { rerenderWith } = renderControlled('user', 'usr_1', onChange);
+    rerenderWith('team');
+    await waitFor(() => expect(onChange).toHaveBeenCalledWith(''));
+  });
+
+  it('does not clear when the type is unset back to empty', async () => {
+    const onChange = vi.fn();
+    const { rerenderWith } = renderControlled('user', 'usr_1', onChange);
+    rerenderWith('');
+    await waitFor(() => expect(onChange).not.toHaveBeenCalled());
+  });
+});
+
+describe('RecipientPickerField — localizable copy', () => {
+  it('takes the placeholder from a per-type key rather than the raw enum value', async () => {
+    // With no I18nProvider the widget falls back to the English defaults, so
+    // the assertion is on the *wording*: 'Select a business unit' can only come
+    // from the keyed string — interpolating the enum produced
+    // 'Select a business unit' only by accident and 'Select a unit and
+    // subordinates' for the next type over.
+    const ds = mockDataSource([]);
+    renderPicker('unit_and_subordinates', ds);
+    await waitFor(() => expect(ds.find).toHaveBeenCalled());
+    expect(await screen.findByText('Select a business unit')).toBeInTheDocument();
+    expect(screen.queryByText(/unit and subordinates/i)).not.toBeInTheDocument();
+  });
+
+  it('prompts for a recipient type before one is chosen', () => {
+    renderPicker('', mockDataSource([]));
+    expect(screen.getByText('Select a recipient type first.')).toBeInTheDocument();
+  });
+});

package/src/widgets/RecipientPickerField.tsx

@@ -2,6 +2,7 @@ import React from 'react';
 import { Combobox, EmptyValue, cn } from '@object-ui/components';
 import { SchemaRendererContext } from '@object-ui/react';
 import type { FieldWidgetProps } from './types';
+import { useFieldTranslation } from './useFieldTranslation';
 
 /**
  * RecipientPickerField — dependent record picker for a polymorphic recipient
@@ -31,14 +32,20 @@ interface RecipientMapping {
   storeField: 'id' | 'name';
   /** Candidate display-label fields, in preference order. */
   labelFields: string[];
+  /**
+   * i18n key for the "choose one" placeholder. Keyed per type rather than
+   * interpolating the enum value into an English sentence — "Select a
+   * business unit" and "选择业务单元" share no structure (objectstack#3821).
+   */
+  placeholderKey: string;
 }
 
 const TYPE_TO_OBJECT: Record<string, RecipientMapping> = {
-  user: { object: 'sys_user', storeField: 'id', labelFields: ['name', 'full_name', 'email'] },
-  team: { object: 'sys_team', storeField: 'id', labelFields: ['name', 'label'] },
-  business_unit: { object: 'sys_business_unit', storeField: 'id', labelFields: ['name', 'label'] },
-  unit_and_subordinates: { object: 'sys_business_unit', storeField: 'id', labelFields: ['name', 'label'] },
-  position: { object: 'sys_position', storeField: 'name', labelFields: ['label', 'name'] },
+  user: { object: 'sys_user', storeField: 'id', labelFields: ['name', 'full_name', 'email'], placeholderKey: 'fields.recipient.selectUser' },
+  team: { object: 'sys_team', storeField: 'id', labelFields: ['name', 'label'], placeholderKey: 'fields.recipient.selectTeam' },
+  business_unit: { object: 'sys_business_unit', storeField: 'id', labelFields: ['name', 'label'], placeholderKey: 'fields.recipient.selectBusinessUnit' },
+  unit_and_subordinates: { object: 'sys_business_unit', storeField: 'id', labelFields: ['name', 'label'], placeholderKey: 'fields.recipient.selectUnitAndSubordinates' },
+  position: { object: 'sys_position', storeField: 'name', labelFields: ['label', 'name'], placeholderKey: 'fields.recipient.selectPosition' },
 };
 
 export function RecipientPickerField({
@@ -49,6 +56,7 @@ export function RecipientPickerField({
   ...props
 }: FieldWidgetProps<string>) {
   const ctx = React.useContext(SchemaRendererContext);
+  const { t } = useFieldTranslation();
   const dataSource: any = (props as any).dataSource ?? (ctx as any)?.dataSource ?? null;
   const disabled = (props as any).disabled as boolean | undefined;
   const dependentValues: Record<string, any> = (props as any).dependentValues ?? {};
@@ -57,12 +65,18 @@ export function RecipientPickerField({
 
   const [records, setRecords] = React.useState<any[] | null>(null);
 
-  // Reset the stored recipient when the type changes AFTER mount (an id for a
-  // user is not a valid team/business-unit id). The ref starts null so the
-  // initial render of an existing rule never clears its value.
-  const prevType = React.useRef<string | null>(null);
+  // Reset the stored recipient when the admin PICKS a different type (an id for
+  // a user is not a valid team/business-unit id).
+  //
+  // "Different type" means one non-empty type replacing another. The empty
+  // string is not a type — it is the edit form before the record has hydrated,
+  // and treating `'' → 'user'` as a change wiped the saved recipient the moment
+  // an existing rule was opened for editing (objectstack#3821): the picker went
+  // blank, and saving persisted the blank. Only a non-empty predecessor can
+  // invalidate the stored id.
+  const prevType = React.useRef<string>('');
   React.useEffect(() => {
-    if (prevType.current !== null && prevType.current !== recipientType && value) {
+    if (prevType.current && recipientType && prevType.current !== recipientType && value) {
       onChange('' as any);
     }
     prevType.current = recipientType;
@@ -75,7 +89,11 @@ export function RecipientPickerField({
     let cancelled = false;
     (async () => {
       try {
-        const res = await dataSource.find(mapping.object, { $top: 500, $orderby: 'name asc' });
+        // Object form, not the 'name asc' clause string: the clause string is
+        // supported again (objectstack#3821 fixed ApiDataSource walking it
+        // character by character), but the structured form can't regress that
+        // way for any data source.
+        const res = await dataSource.find(mapping.object, { $top: 500, $orderby: { name: 'asc' } });
         const list: any[] = res?.data ?? res?.records ?? (Array.isArray(res) ? res : []);
         if (!cancelled) setRecords(Array.isArray(list) ? list : []);
       } catch {
@@ -105,7 +123,7 @@ export function RecipientPickerField({
   if (!recipientType) {
     return (
       <p className={cn('text-sm text-muted-foreground', className)}>
-        Select a recipient type first.
+        {t('fields.recipient.selectTypeFirst')}
       </p>
     );
   }
@@ -137,12 +155,14 @@ export function RecipientPickerField({
       value={value ?? ''}
       onValueChange={(v) => onChange(v as any)}
       placeholder={
-        records === null ? 'Loading…' : `Select a ${recipientType.replace(/_/g, ' ')}`
+        records === null
+          ? t('fields.recipient.loading')
+          : t(mapping.placeholderKey ?? 'fields.recipient.select')
       }
-      searchPlaceholder="Search…"
-      emptyText={records === null ? 'Loading…' : 'No matches'}
+      searchPlaceholder={t('fields.recipient.search')}
+      emptyText={records === null ? t('fields.recipient.loading') : t('fields.recipient.empty')}
       disabled={disabled}
-      className={className}
+      className={cn('w-full', className)}
     />
   );
 }

package/src/widgets/SelectField.tsx

@@ -1,4 +1,4 @@
-import React, { useContext, useEffect, useMemo } from 'react';
+import React, { useEffect } from 'react';
 import {
   Select,
   SelectContent,
@@ -7,19 +7,38 @@ import {
   SelectValue,
   EmptyValue,
 } from '@object-ui/components';
-import {
-  resolveVisibleOptions,
-  isOptionGroupGated,
-  resolveDependsOnFields,
-  isValueStillOffered,
-} from '@object-ui/core';
-import { SchemaRendererContext, usePredicateScope } from '@object-ui/react';
+import { isValueStillOffered } from '@object-ui/core';
 import { SelectFieldMetadata } from '@object-ui/types';
 import { useFieldTranslation } from './useFieldTranslation';
 import { FieldWidgetProps } from './types';
+import { MultiSelectField } from './MultiSelectField';
+import { useCascadingOptions } from './useCascadingOptions';
 
 /**
- * SelectField - Dropdown selection widget with configurable options.
+ * SelectField - dropdown selection widget.
+ *
+ * A field declared `multiple: true` selects zero-or-more values (spec:
+ * `multiple` is valid on `select`), so it renders the multi-value chip picker
+ * — the same widget the `multiselect` type uses. Delegating here (rather than
+ * only at a type-resolution layer) means every surface that renders the
+ * `select` widget — the object form, the inline grid editor, and
+ * `ActionParamDialog` — inherits multi-select identically, with no drift
+ * between them. Single-value selects keep the cascading dropdown below.
+ *
+ * Both branches resolve per-option `visibleWhen` cascading / role-gating through
+ * the shared {@link useCascadingOptions} hook (#2715), so single and multi stay
+ * in lockstep.
+ */
+export function SelectField(props: FieldWidgetProps<any>) {
+  const config = (props.field || (props as any).schema) as SelectFieldMetadata | undefined;
+  if ((config as any)?.multiple) {
+    return <MultiSelectField {...props} />;
+  }
+  return <SingleSelectField {...(props as FieldWidgetProps<string>)} />;
+}
+
+/**
+ * SingleSelectField - single-value dropdown with configurable options.
  *
  * Supports cascading / role-gated options (#2284): each option may carry a
  * `visibleWhen` CEL predicate, evaluated against the live form record +
@@ -29,7 +48,7 @@ import { FieldWidgetProps } from './types';
  * of those is empty the control is gated with a "select the parent first" hint,
  * mirroring the dependent-lookup UX.
  */
-export function SelectField({
+function SingleSelectField({
   value,
   onChange,
   field,
@@ -50,28 +69,11 @@ export function SelectField({
   // react-hook-form field name spread in by the form renderer (FormField).
   const fieldName = (props as any).name || (config as any)?.name || props.id || '';
 
-  // Live form values for cascading options — injected by the form renderer as
-  // `dependentValues` (same channel dependent lookups use), falling back to the
-  // record on SchemaRendererContext. `current_user` etc. come from the global
-  // predicate scope so role/context predicates resolve too.
-  const ctx = useContext(SchemaRendererContext) as any;
-  const record = useMemo<Record<string, unknown>>(() => {
-    return (dependentValues ?? ctx?.formValues ?? ctx?.data ?? {}) as Record<string, unknown>;
-  }, [dependentValues, ctx?.formValues, ctx?.data]);
-  const predicateScope = usePredicateScope();
-
   const dependsOn = (config as any)?.dependsOn ?? dependsOnProp;
-  const dependsOnFields = useMemo(() => resolveDependsOnFields(dependsOn), [dependsOn]);
-  const gated = useMemo(
-    () => dependsOnFields.length > 0 && isOptionGroupGated(dependsOn, record),
-    [dependsOnFields, dependsOn, record],
-  );
-
-  // Effective (offered) options after per-option `visibleWhen` filtering. Empty
-  // while gated so we never present an unfiltered set before the parent is set.
-  const options = useMemo(
-    () => (gated ? [] : resolveVisibleOptions(rawOptions, record, predicateScope)),
-    [gated, rawOptions, record, predicateScope],
+  const { options, gated, dependsOnFields } = useCascadingOptions(
+    rawOptions,
+    dependsOn,
+    dependentValues,
   );
 
   // Cascade clear: once the offered set no longer includes the current value

package/src/widgets/TextAreaField.tsx

@@ -22,6 +22,10 @@ import { FieldWidgetProps } from './types';
  * textarea trapped between other fields.
  */
 export function TextAreaField({ value, onChange, field, readonly, errorMessage, ...props }: FieldWidgetProps<string>) {
+  // Hooks must run before any early return (readonly) to keep hook order stable.
+  const [fullscreenOpen, setFullscreenOpen] = useState(false);
+  const [draft, setDraft] = useState(value ?? '');
+
   if (readonly) {
     return (
       <div className="text-sm whitespace-pre-wrap">
@@ -32,7 +36,10 @@ export function TextAreaField({ value, onChange, field, readonly, errorMessage,
 
   const textareaField = (field || (props as any).schema) as any;
   const rows = textareaField?.rows || 4;
-  const maxLength = textareaField?.max_length;
+  // Spec FieldSchema declares camelCase `maxLength`; `max_length` is the legacy
+  // objectui spelling. Dual-read (framework#1878 §3 recheck) — without this a
+  // spec-authored maxLength gave neither the textarea cap nor the counter.
+  const maxLength = textareaField?.maxLength ?? textareaField?.max_length;
   // Mobile fullscreen flag may arrive on the field metadata, on the form-field
   // schema (when called via the form renderer where `field` is the ObjectQL
   // metadata sub-object), or as an explicit widget prop.
@@ -42,8 +49,6 @@ export function TextAreaField({ value, onChange, field, readonly, errorMessage,
     (props as any).mobile_fullscreen ??
     (props as any).schema?.mobile_fullscreen,
   );
-  const [fullscreenOpen, setFullscreenOpen] = useState(false);
-  const [draft, setDraft] = useState(value ?? '');
 
   const openFullscreen = () => { setDraft(value ?? ''); setFullscreenOpen(true); };
   const cancelFullscreen = () => setFullscreenOpen(false);

package/src/widgets/__tests__/FilterConditionField.matchAll.test.ts

@@ -0,0 +1,66 @@
+/**
+ * ObjectUI
+ * Copyright (c) 2024-present ObjectStack Inc.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/**
+ * Empty-criteria guard for the sharing-rule criteria builder
+ * (objectstack#3896).
+ *
+ * This widget used to tell an admin that an empty criteria meant "All
+ * records" — the most dangerous thing it could say, because it was describing
+ * a bug as a feature. A sharing rule with no predicate was stored as
+ * `criteria_json: null` and then evaluated as `find(object, { filter: {} })`,
+ * i.e. every record of the object granted to the recipient. `SharingRuleSchema`
+ * had always forbidden that shape ("never seeded as a permissive match-all",
+ * ADR-0049); the REST and data-API entries just never checked.
+ *
+ * The server now refuses to save such a rule and shares nothing for one
+ * already stored. These tests pin the client-side mirror of that predicate, so
+ * the widget warns while the admin is still looking at the empty builder
+ * rather than after a rejected save.
+ */
+import { describe, it, expect } from 'vitest';
+import { isMatchAllCriteria } from '../FilterConditionField';
+
+describe('isMatchAllCriteria — shapes that would share every record', () => {
+  it('flags the empty and vacuous shapes', () => {
+    for (const shape of [
+      undefined,
+      null,
+      {},           // what a blank builder / blank textarea parses to
+      [],
+      true,
+      42,
+      { $and: [] },
+      { $or: [] },
+      { $and: [{}] },
+      { $or: [{ stage: 'won' }, {}] }, // one unconstrained branch opens the OR
+    ]) {
+      expect(isMatchAllCriteria(shape), `${JSON.stringify(shape) ?? String(shape)}`).toBe(true);
+    }
+  });
+
+  it('passes anything that actually narrows the result set', () => {
+    for (const shape of [
+      { stage: 'won' },
+      { amount: { $gte: 100000 } },
+      [{ stage: 'won' }],
+      { $and: [{ stage: 'won' }] },
+      { $or: [{ a: 1 }, { b: 2 }] },
+      { health: 'red', budget: { $gt: 1 } },
+    ]) {
+      expect(isMatchAllCriteria(shape), JSON.stringify(shape)).toBe(false);
+    }
+  });
+
+  it('agrees with the server on the reported case: a rule saved with no criteria', () => {
+    // The builder emits '' for an empty group, which the widget parses to {}.
+    expect(isMatchAllCriteria({})).toBe(true);
+    // …and one real condition is enough to clear the gate.
+    expect(isMatchAllCriteria({ health: 'red' })).toBe(false);
+  });
+});