@wix/patterns 1.430.0 → 1.432.0

package/src/schema/entityPageFieldManagement.ts

@@ -0,0 +1,44 @@
+import type { SourceState } from '@wix/bex-core';
+import { SchemaState } from '../components/SchemaSource/SchemaState';
+import { createSchemaFieldActionsMenu } from '../components/SchemaSource/schemaFieldActions';
+import { CustomFieldsPanelState } from '../state/CustomFields/CustomFieldsPanelState';
+import type { ManageFieldsSource } from '../state/ManageFieldsSource';
+
+/**
+ * Add / edit / delete field for an entity page, over the page's source.
+ *
+ * A collection page gets the same thing from its toolbar's
+ * `CollectionFieldsSourceState`, which an entity page has no toolbar to build —
+ * so the two pieces that don't need one are assembled here: the source's
+ * FieldsSource and per-field menu (`SchemaState`), and the modals
+ * (`CustomFieldsPanelState`).
+ */
+export function entityPageFieldManagement({
+  sourceState,
+  closeSidePanel,
+}: {
+  sourceState: SourceState<any>;
+  closeSidePanel: () => void;
+}): ManageFieldsSource {
+  const schemaState = new SchemaState({ sourceState });
+  const { container } = sourceState;
+  const panel = new CustomFieldsPanelState({
+    fieldsSource: schemaState.fieldsSource,
+    container,
+    reportBi: container.reportBi,
+    closeSidePanel,
+    createFieldActionsMenu: createSchemaFieldActionsMenu(schemaState),
+  });
+
+  return {
+    fieldsSource: schemaState.fieldsSource,
+    customFieldsPanel: panel,
+    fieldActionsMenu: panel.fieldActionsMenu,
+    openFieldModal: (opts) =>
+      panel.openCustomFieldModal({
+        fieldId: opts?.fieldId,
+        origin: opts?.origin ?? 'external',
+        customOrigin: opts?.customOrigin,
+      }),
+  };
+}

package/src/schema/index.ts

@@ -3,9 +3,19 @@ export * from './useTableCollection';
 export * from './useGridCollection';
 export * from './useEditableTableCollection';
 export * from './useLayoutSwitchCollection';
+export * from './useEntityPage';
 export {
   usePlatformizedSource,
   type PlatformizedSourceInput,
 } from './usePlatformizedSource';
 export type { SchemaCollectionOptions } from './schemaCollectionOptions';
 export { sourceMutations } from './sourceMutations';
+export { Table, type SchemaTableProps } from './Table';
+export { EditableTable, type SchemaEditableTableProps } from './EditableTable';
+export { Grid, type SchemaGridProps } from './Grid';
+export { LayoutSwitch, type SchemaLayoutSwitchProps } from './LayoutSwitch';
+export { EntityPage, type SchemaEntityPageProps } from './EntityPage';
+export {
+  EntityPageFieldsCard,
+  type EntityPageFieldsCardProps,
+} from './EntityPageFieldsCard';

package/src/schema/schemaCollectionOptions.ts

@@ -9,11 +9,6 @@ import type { CollectionConfigWithConditionals } from '@wix/bex-core/react';
 
 type FetchData<T> = (query: OffsetQuery) => Promise<OffsetQueryResult<T>>;
 
-/**
- * The collection options a schema-entry hook accepts — everything the source
- * doesn't supply. Source-owned keys (`queryName`, `paginationMode`,
- * `fetchData`, `fetchTotal`, `itemKey`, `itemName`) don't exist here.
- */
 export type SchemaCollectionOptions<T, F extends FiltersMap> = Omit<
   CollectionConfigWithConditionals<T, F>,
   | 'queryName'
@@ -22,17 +17,12 @@ export type SchemaCollectionOptions<T, F extends FiltersMap> = Omit<
   | 'fetchTotal'
   | 'itemKey'
   | 'itemName'
+  | 'fqdn'
 > & {
   /** Wraps the source's fetch (filter/enrich results) without replacing it. */
   wrapFetchData?: (next: FetchData<T>) => FetchData<T>;
 };
 
-/** Builds the collection config from the source: the query fetches through the
- *  source's backend, identity and labels come from the source, and the
- *  consumer's options fill the rest.
- *  `options` is typed loosely — the hooks' option types already enforce the
- *  consumer surface, and TS can't infer `F` back through the conditional
- *  config type; callers pass the generics explicitly. */
 export function schemaCollectionConfig<T, F extends FiltersMap>(
   source: SchemaSource<T>,
   options?: object,
@@ -45,6 +35,7 @@ export function schemaCollectionConfig<T, F extends FiltersMap>(
   return {
     ...rest,
     queryName: source.collectionId,
+    fqdn: source.collectionId,
     paginationMode: source.paginationMode,
     fetchData: wrapFetchData ? wrapFetchData(fetchData) : fetchData,
     itemKey: source.itemKey,

package/src/schema/sourceMutations.ts

@@ -1,8 +1,12 @@
 import type { SourceState } from '@wix/bex-core';
 import type { EditableTableMutationHandlers } from '../state/EditableTable';
 
+const LOCAL_ID_PREFIX = 'new-';
+
 const newLocalId = () =>
-  `new-${Date.now().toString(36)}-${Math.random().toString(36).slice(2, 8)}`;
+  `${LOCAL_ID_PREFIX}${Date.now().toString(36)}-${Math.random()
+    .toString(36)
+    .slice(2, 6)}`;
 
 /**
  * Row write handlers read from the source's state — the schema-entry default,
@@ -26,12 +30,28 @@ export function sourceMutations<T>(
     return fn;
   };
 
+  const idField = () => sourceState.schema?.idField ?? '_id';
+
+  // A new row needs an id up front to key its optimistic patch, but that id is
+  // ours, not the backend's — creating with it would persist "new-…" as the
+  // item's id. Dropped from the payload, so a create carries no id at all.
+  const withoutLocalId = (item: T): Partial<T> => {
+    const key = idField();
+    const record = item as Record<string, unknown>;
+    if (!String(record[key] ?? '').startsWith(LOCAL_ID_PREFIX)) {
+      return item;
+    }
+    const { [key]: _localId, ...rest } = record;
+    return rest as Partial<T>;
+  };
+
   return {
-    createItem: () =>
-      ({ [sourceState.schema?.idField ?? '_id']: newLocalId() } as T),
+    createItem: () => ({ [idField()]: newLocalId() } as T),
     submitCreate: (items) =>
       Promise.all(
-        items.map((item) => required(backend().create, 'creating')(item)),
+        items.map((item) =>
+          required(backend().create, 'creating')(withoutLocalId(item)),
+        ),
       ),
     submitUpdate: (items) =>
       Promise.all(

package/src/schema/syncSourcePermissions.ts

@@ -0,0 +1,27 @@
+import { autorun, runInAction } from 'mobx';
+import type { FiltersMap, SourceState } from '@wix/bex-core';
+import type { EditableTableState } from '../state/EditableTable';
+
+/**
+ * Keeps an editable table's row-action flags in sync with its source: an action
+ * is disabled when the source denies the permission (`schema.itemPermissions`)
+ * OR the backend can't perform it (the write method is absent, e.g. a read-only
+ * source). Reactive because the schema loads asynchronously. Returns a disposer.
+ */
+export function syncSourcePermissions<T, F extends FiltersMap>(
+  state: EditableTableState<T, F>,
+  sourceState: SourceState<T>,
+): () => void {
+  return autorun(() => {
+    const loaded = sourceState.loadedSchema;
+    const perms = loaded?.schema.itemPermissions;
+    const backend = loaded?.backend;
+    runInAction(() => {
+      state.addItemDisabled = !(perms?.createItem ?? true) || !backend?.create;
+      state.updateItemDisabled =
+        !(perms?.updateItem ?? true) || !backend?.update;
+      state.removeItemDisabled =
+        !(perms?.deleteItem ?? true) || !backend?.bulkDelete;
+    });
+  });
+}

package/src/schema/useEditableTableCollection.ts

@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 import { SourceState } from '@wix/bex-core';
 import type {
   CollectionOptimisticActionsBaseParams,
@@ -7,33 +7,23 @@ import type {
   SchemaSource,
 } from '@wix/bex-core';
 import { useWixPatternsContainer } from '@wix/bex-core/react';
-import type {
-  EditableTableState,
-  EditableTablePermissions,
-  EditableTableMutationHandlers,
-} from '../state/EditableTable';
+import type { EditableTableState } from '../state/EditableTable';
 import type { CellType } from '../state/EditableTable/types';
 import type { FieldsSourceProvider } from '../components/fieldsSourceProvider';
-import {
-  useEditableTableCollection as useOpenEditableTableCollection,
-  type EditableTableCollectionConfig,
-} from '../hooks/useEditableTableCollection';
+import { useEditableTableCollection as useOpenEditableTableCollection } from '../hooks/useEditableTableCollection';
 import { SchemaState } from '../components/SchemaSource/SchemaState';
 import {
   schemaCollectionConfig,
   type SchemaCollectionOptions,
 } from './schemaCollectionOptions';
 import { sourceMutations } from './sourceMutations';
+import { syncSourcePermissions } from './syncSourcePermissions';
 import { attachesItself } from './usePlatformizedSource';
 
 export type SchemaEditableTableCollectionOptions<
   T,
   F extends FiltersMap = OptionalFiltersMap,
 > = SchemaCollectionOptions<T, F> & {
-  permissions?: EditableTablePermissions;
-  /** Row write handlers. Default: derived from the source's backend
-   *  (`create`/`update`/`bulkDelete`). */
-  mutations?: EditableTableMutationHandlers<T>;
   optimisticActionParams?: Partial<CollectionOptimisticActionsBaseParams<T, F>>;
   /** Additional cell types to register alongside the built-in ones. */
   extraCellTypes?: CellType[];
@@ -66,22 +56,22 @@ export function useEditableTableCollection<
     };
   });
 
-  const {
-    permissions,
-    mutations,
-    optimisticActionParams,
-    extraCellTypes,
-    ...rest
-  } = options ?? ({} as SchemaEditableTableCollectionOptions<T, F>);
+  const { optimisticActionParams, extraCellTypes, ...rest } =
+    options ?? ({} as SchemaEditableTableCollectionOptions<T, F>);
 
-  const state = useOpenEditableTableCollection<T, F>({
-    ...schemaCollectionConfig<T, F>(source, rest),
-    permissions,
-    mutations: mutations ?? sourceMutations(sourceState),
-    optimisticActionParams,
-    extraCellTypes,
-  } as unknown as EditableTableCollectionConfig<T, F>);
+  const state = useOpenEditableTableCollection<T, F>(
+    Object.assign(schemaCollectionConfig<T, F>(source, rest), {
+      mutations: sourceMutations(sourceState),
+      optimisticActionParams,
+      extraCellTypes,
+    }),
+  );
 
   useState(() => fieldsProvider.setOnTable(state.toolbar));
+  useEffect(
+    () => syncSourcePermissions(state, sourceState),
+    [state, sourceState],
+  );
+
   return state;
 }

package/src/schema/useEntityPage.ts

@@ -0,0 +1,105 @@
+import { useState } from 'react';
+import type { FieldValues } from 'react-hook-form';
+import type { SchemaSource } from '@wix/bex-core';
+import type { EntityPageState } from '../state';
+import {
+  useEntityPage as useOpenEntityPage,
+  type UseEntityPageParams,
+} from '../hooks/useEntityPage';
+
+/** Entity page options for a source-driven page: the source loads the schema and
+ *  its backend reads and writes the entity, so `fetch` and `onSave` derive from
+ *  it — pass one only to replace the derived default. */
+export type SchemaEntityPageOptions<
+  T,
+  V extends FieldValues = FieldValues,
+> = Omit<UseEntityPageParams<T, V>, 'fetch' | 'onSave' | 'schemaSource'> & {
+  /** The entity to load. Omitted ⇒ the create route: the page starts empty and
+   *  saving creates an entity. */
+  entityId?: string;
+  /** Replaces the read through the source's backend. */
+  fetch?: UseEntityPageParams<T, V>['fetch'];
+  /** Replaces the write through the source's backend. */
+  onSave?: UseEntityPageParams<T, V>['onSave'];
+};
+
+/** An entity page driven by a source: the source supplies the schema its fields
+ *  render from, and its backend reads and writes the entity. Render the state
+ *  with the `EntityPage` from this entry — it wires the fields provider. */
+export function useEntityPage<T, V extends FieldValues = FieldValues>(
+  source: SchemaSource<T>,
+  options: SchemaEntityPageOptions<T, V>,
+): EntityPageState<T, V> {
+  const { entityId, fetch, onSave, ...rest } = options;
+
+  // The derived read and write need values that change or don't exist yet when
+  // the state is created: the state itself (the save merges into the loaded
+  // entity) and the latest entityId (a re-fetch should read the current one).
+  const [page] = useState<PageRef<T, V>>(() => ({}));
+  page.entityId = entityId;
+
+  const state = useOpenEntityPage<T, V>({
+    ...rest,
+    schemaSource: source,
+    fetch: fetch ?? (() => fetchFromSource(source, page.entityId)),
+    onSave: onSave ?? (() => saveToSource(source, page)),
+  } as UseEntityPageParams<T, V>);
+
+  page.state = state;
+
+  return state;
+}
+
+interface PageRef<T, V extends FieldValues> {
+  entityId?: string;
+  state?: EntityPageState<T, V>;
+}
+
+async function fetchFromSource<T>(
+  source: SchemaSource<T>,
+  entityId?: string,
+): Promise<{ entity: T | undefined }> {
+  if (!entityId) {
+    return { entity: undefined };
+  }
+
+  const { backend } = await source.loadSchema();
+  return { entity: await required(backend.get, 'reading')(entityId) };
+}
+
+async function saveToSource<T, V extends FieldValues>(
+  source: SchemaSource<T>,
+  page: PageRef<T, V>,
+): Promise<{ updatedEntity: T }> {
+  const { entityId, state } = page;
+  const { backend } = await source.loadSchema();
+  const values = state!.form.getValues() as Partial<T>;
+
+  // Which write to run follows the route, not whether an entity happens to be
+  // loaded: an id whose entity is missing (deleted, or filtered out by
+  // permissions) must fail rather than quietly create a second record.
+  if (!entityId) {
+    return {
+      updatedEntity: await required(backend.create, 'creating')(values),
+    };
+  }
+
+  const { entity } = state!;
+  if (!entity) {
+    throw new Error(`The source has no entity "${entityId}" to update`);
+  }
+
+  return {
+    updatedEntity: await required(
+      backend.update,
+      'updating',
+    )({ ...entity, ...values } as T),
+  };
+}
+
+function required<F>(fn: F | undefined, action: string): F {
+  if (!fn) {
+    throw new Error(`The source doesn't support ${action} items`);
+  }
+  return fn;
+}

package/src/schema/useLayoutSwitchCollection.ts

@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 import { SourceState } from '@wix/bex-core';
 import type {
   FiltersMap,
@@ -12,18 +12,15 @@ import type {
   GridLayoutConfig,
   SpreadsheetLayoutConfig,
 } from '../state/LayoutSwitchState';
-import type { EditableTableMutationHandlers } from '../state/EditableTable';
 import type { FieldsSourceProvider } from '../components/fieldsSourceProvider';
-import {
-  useLayoutSwitchCollection as useOpenLayoutSwitchCollection,
-  type LayoutSwitchCollectionConfig,
-} from '../hooks/useLayoutSwitchCollection';
+import { useLayoutSwitchCollection as useOpenLayoutSwitchCollection } from '../hooks/useLayoutSwitchCollection';
 import { SchemaState } from '../components/SchemaSource/SchemaState';
 import {
   schemaCollectionConfig,
   type SchemaCollectionOptions,
 } from './schemaCollectionOptions';
 import { sourceMutations } from './sourceMutations';
+import { syncSourcePermissions } from './syncSourcePermissions';
 import { attachesItself } from './usePlatformizedSource';
 
 export type SchemaLayoutSwitchCollectionOptions<
@@ -35,10 +32,7 @@ export type SchemaLayoutSwitchCollectionOptions<
   spreadsheet?: Omit<
     SpreadsheetLayoutConfig<T, F>,
     'createOptimisticActions' | 'mutations'
-  > & {
-    /** Row write handlers. Default: derived from the source's backend. */
-    mutations?: EditableTableMutationHandlers<T>;
-  };
+  >;
 };
 
 /** One collection and one toolbar driven by a source, shared by every enabled
@@ -72,18 +66,25 @@ export function useLayoutSwitchCollection<
   const { table, grid, spreadsheet, ...rest } =
     options ?? ({} as SchemaLayoutSwitchCollectionOptions<T, F>);
 
-  const state = useOpenLayoutSwitchCollection<T, F>({
-    ...schemaCollectionConfig<T, F>(source, rest),
-    table,
-    grid,
-    spreadsheet: spreadsheet
-      ? {
-          ...spreadsheet,
-          mutations: spreadsheet.mutations ?? sourceMutations(sourceState),
-        }
-      : undefined,
-  } as unknown as LayoutSwitchCollectionConfig<T, F>);
+  const state = useOpenLayoutSwitchCollection<T, F>(
+    Object.assign(schemaCollectionConfig<T, F>(source, rest), {
+      table,
+      grid,
+      spreadsheet: spreadsheet
+        ? { ...spreadsheet, mutations: sourceMutations(sourceState) }
+        : undefined,
+    }),
+  );
 
   useState(() => fieldsProvider.setOnTable(state.toolbar));
+
+  // Keep the spreadsheet view's row actions gated on the source's permissions.
+  useEffect(() => {
+    const spreadsheetState = state.spreadsheetState;
+    return spreadsheetState
+      ? syncSourcePermissions(spreadsheetState, sourceState)
+      : undefined;
+  }, [state, sourceState]);
+
   return state;
 }

package/src/schema/usePlatformizedSource.ts

@@ -1,4 +1,5 @@
 import { useMemo } from 'react';
+import { useWixPatternsContainer } from '@wix/bex-core/react';
 import {
   defineSchemaSource,
   DataExtensionState,
@@ -8,8 +9,10 @@ import type {
   CollectionBackend,
   DataExtensionOverrides,
   SchemaSource,
+  WixPatternsContainer,
 } from '@wix/bex-core';
 import type { FieldsSourceProvider } from '../components/fieldsSourceProvider';
+import { attachFieldsContainer } from './useSchemaSource';
 import type { ToolbarCollectionState } from '../state';
 import { CollectionFieldsSourceState } from '../state/CollectionFieldsSourceState';
 import { DataExtension } from '../components/DataExtension/DataExtension';
@@ -43,11 +46,18 @@ type SelfAttachingSource<T> = SchemaSource<T> & FieldsSourceProvider;
 export const usePlatformizedSource = <T = Record<string, unknown>>(
   input: PlatformizedSourceInput<T>,
 ): SchemaSource<T> => {
-  return useMemo(() => createPlatformizedSource(input), [input.fqdn]);
+  const patternsContainer = useWixPatternsContainer();
+
+  return useMemo(
+    () => createPlatformizedSource(input, patternsContainer),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [input.fqdn],
+  );
 };
 
 function createPlatformizedSource<T>(
   input: PlatformizedSourceInput<T>,
+  patternsContainer: WixPatternsContainer,
 ): SelfAttachingSource<T> {
   const {
     fqdn,
@@ -59,17 +69,20 @@ function createPlatformizedSource<T>(
     ...overrides
   } = input;
 
-  const base = defineSchemaSource<T>({
-    collectionId: fqdn,
-    itemKey,
-    itemName,
-    // The added fields arrive with the collection-adapter refit; until then
-    // the attach below renders them, and the schema carries identity only.
-    loadSchema: async () => ({
-      schema: { id: fqdn, idField, displayField, fields: {} },
-      backend,
+  const base = attachFieldsContainer(
+    defineSchemaSource<T>({
+      collectionId: fqdn,
+      itemKey,
+      itemName,
+      // The added fields arrive with the collection-adapter refit; until then
+      // the attach below renders them, and the schema carries identity only.
+      loadSchema: async () => ({
+        schema: { id: fqdn, idField, displayField, fields: {} },
+        backend,
+      }),
     }),
-  });
+    patternsContainer,
+  );
 
   return {
     ...base,
@@ -87,6 +100,8 @@ function createPlatformizedSource<T>(
         ...overrides,
       });
       CollectionFieldsSourceState.setOnTable(toolbar, {
+        // The components read the fields container off this.
+        schemaSource: base,
         fieldsSource: dataExtensionFieldsSourceFrom({
           dataExtension,
           reportBi: toolbar.reportBi,

package/src/schema/useSchemaSource.ts

@@ -0,0 +1,52 @@
+import { useMemo } from 'react';
+import { defineSchemaSource } from '@wix/bex-core';
+import type {
+  SchemaSource,
+  SchemaSourceInput,
+  WixPatternsContainer,
+} from '@wix/bex-core';
+import { useWixPatternsContainer } from '@wix/bex-core/react';
+import { PatternsFieldsAppContainer } from '@wix/patterns-fields/providers';
+import type { SchemaSourceWithFields } from '../model/schemaFieldsContainer';
+
+/** A resolved source plus the container its field renderers are built with. */
+export type FieldsSchemaSource<T> = SchemaSource<T> &
+  Required<SchemaSourceWithFields>;
+
+/**
+ * Attaches the container the source's field renderers are built with. Used by
+ * `useSchemaSource` below, and by tests building a source through the core
+ * testkit — core can't attach it, so anything constructing a source outside this
+ * package has to.
+ */
+export function attachFieldsContainer<T>(
+  source: SchemaSource<T>,
+  patternsContainer: WixPatternsContainer,
+): FieldsSchemaSource<T> {
+  return Object.assign(source, {
+    fieldsContainer: new PatternsFieldsAppContainer({ patternsContainer }),
+  });
+}
+
+/**
+ * `defineSchemaSource` with the fields container attached — the source is where
+ * it belongs, so a page and a table on the same schema share one container
+ * instead of each building its own. Core defines the source but can't reference
+ * `@wix/patterns-fields`, hence this layer.
+ *
+ * The states initialize it from their own `init()`; `SchemaFieldsProvider` puts
+ * it in React context for the field renderers.
+ */
+export function useSchemaSource<T>(
+  input: SchemaSourceInput<T>,
+): FieldsSchemaSource<T> {
+  const patternsContainer = useWixPatternsContainer();
+
+  // Same memo key as the core hook: one source, and one container, per collection.
+  return useMemo(
+    () =>
+      attachFieldsContainer(defineSchemaSource<T>(input), patternsContainer),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [input.collectionId],
+  );
+}

package/src/state/CollectionFieldsSourceState.ts

@@ -6,9 +6,11 @@ import type {
   CustomFieldOrigin,
   Field,
   Schema,
+  SchemaSource,
   WixPatternsErrorCode,
 } from '@wix/bex-core';
 import type { Column } from '../model';
+import { fieldsContainerOf } from '../model/schemaFieldsContainer';
 import type { ToolbarCollectionState } from './ToolbarCollectionState';
 import { buildFieldColumns, ColumnOverridesContext } from './buildFieldColumns';
 import { handleFieldsSourceLoadError } from './handleFieldsSourceLoadError';
@@ -29,6 +31,13 @@ import {
 import type { FieldActionHandlersConfig } from '../components/FieldActions';
 import type { CustomColumnsBaseProps } from '../components/CustomColumns/CustomColumns';
 
+/** A cell type plus the config its editor needs, for a field the default
+ *  type→cell mapping can't fully resolve on its own. */
+export interface EditableCellUpgrade {
+  cellType: string;
+  typeConfig: unknown;
+}
+
 /** Builds the raw field-management for one field (handlers + registry metadata). */
 type FieldActionHandlersBuilder = (args: {
   fieldId: string;
@@ -59,11 +68,22 @@ export interface FieldsSourceComponents {
  * renders these with shared, source-neutral components.
  */
 export interface FieldsSourceRendering {
+  /** The schema behind this source, when it has one. The collection initializes
+   *  the fields container the schema carries; the components read it off the
+   *  same object for React context. */
+  schemaSource?: SchemaSource<any>;
   /**
    * Lets a source replace any column property the shared builder produces,
    * including the render function for media types. Called per field.
    */
   columnOverrides?(field: Field, ctx: ColumnOverridesContext): Partial<Column>;
+  /**
+   * The editable cell for a field whose editor needs `typeConfig` only the
+   * source can supply (a reference cell's referenced collection). Called per
+   * field when building editable columns; `undefined` keeps the default mapping
+   * for that field type, which for those types is a read-only display.
+   */
+  editableCellFor?(field: Field): EditableCellUpgrade | undefined;
   /** Per-source filter behavior (text operators, decimal, type icon). */
   filterConfig: FieldFilterConfig;
   /**
@@ -114,6 +134,11 @@ export class CollectionFieldsSourceState {
   readonly fieldActionsMenu: FieldActionsMenuBuilder;
   readonly fieldActionHandlers?: FieldActionHandlersBuilder;
   readonly components: FieldsSourceComponents;
+  /** Read by the source-driven components, which put its fields container in
+   *  React context. */
+  readonly schemaSource?: SchemaSource<any>;
+  /** Read by EditableTableState when it builds the source's editable columns. */
+  readonly editableCellFor?: FieldsSourceRendering['editableCellFor'];
   private readonly columnOverrides?: FieldsSourceRendering['columnOverrides'];
   private readonly toolbar: ToolbarCollectionState<any, any>;
   private readonly errorCode: WixPatternsErrorCode;
@@ -131,6 +156,8 @@ export class CollectionFieldsSourceState {
     this.props = params.props;
     this.filterConfig = params.filterConfig;
     this.columnOverrides = params.columnOverrides;
+    this.schemaSource = params.schemaSource;
+    this.editableCellFor = params.editableCellFor;
     this.components = params.components;
     this.errorCode = params.errorCode ?? 'InitCustomFieldsDataExtensionFailed';
 
@@ -177,18 +204,14 @@ export class CollectionFieldsSourceState {
   buildFilters(): FilterElement[] {
     return buildFieldFilters(
       this.toolbar,
-      this.fieldsSource.filterableFields,
+      this.fieldsSource,
       this.filterConfig,
     );
   }
 
   /** Registers a filter state per filterable field on the collection query. */
   registerFilters() {
-    registerFieldFilters(
-      this.toolbar,
-      this.fieldsSource.filterableFields,
-      this.filterConfig,
-    );
+    registerFieldFilters(this.toolbar, this.fieldsSource, this.filterConfig);
   }
 
   /**
@@ -219,6 +242,8 @@ export class CollectionFieldsSourceState {
   }
 
   init() {
+    // Idempotent, and the field renderers can't translate until it resolves.
+    fieldsContainerOf(this.schemaSource)?.init();
     this.initTask.runOnce(() => this.fieldsSource.load());
     this.initTask.status.promise?.catch(() => this.handleLoadError());