List API

Learn how to access and control SolidX list views programmatically from external components.

Overview

SolidX exposes a programmatic List View API so external components can control an active list page.

Typical callers now include:

module-owned list buttons under admin-layout
custom widgets under admin-layout
bespoke route UIs under custom-layout

This API is exposed through:

listViewRegistry
getListView(listId)
getRegisteredListViewIds()
SolidListViewHandle

Source of Truth

Implementation references:

src/routes/pages/admin/core/ListPage.tsx
src/components/core/list/listViewRegistry.ts
src/components/core/list/SolidListView.tsx

How List Views Are Exposed

ListPage.tsx creates a list ID and registers the list handle on mount:

const listId = `page:${moduleName}:${modelName}:${menuItemId}:${menuItemName}:${actionId}:${actionName}`;
registerListView(listId, handle);

It unregisters on unmount:

unregisterListView(listId);

Important details:

modelName is camel-cased in ListPage
menuItemId, menuItemName, actionId, and actionName are part of the ID
treat list IDs as fully-qualified keys and use exact matching

Registry API

import { getListView, getRegisteredListViewIds } from "@solidxai/core-ui";

Available functions:

getListView(listId)
getRegisteredListViewIds()
hasListView(listId)

`SolidListViewHandle` API

type SolidListViewHandle = {
  refresh: () => void;
  clearFilters: () => void;
  applyFilter: (filter: {
    custom_filter_predicate?: any;
    search_predicate?: any;
    saved_filter_predicate?: any;
    predefined_search_predicate?: any;
  }) => void;
  setPagination: (nextFirst: number, nextRows: number) => void;
  setSort: (nextMultiSortMeta: { field: string; order: 1 | -1 }[]) => void;
  setShowArchived: (value: boolean) => void;
  getState: () => any;
};

Typical External Usage

Pattern:

Read registered IDs.
Build the exact target listId from module, model, menu, and action context.
Resolve the handle via getListView.
Invoke handle APIs such as applyFilter or refresh.

Example:

import { getListView, getRegisteredListViewIds } from "@solidxai/core-ui";

const listIds = getRegisteredListViewIds();
const listId = "page:onboarding:applicationMaster:menu-123:Applications:action-456:open";
const listView = getListView(listId);

if (listView) {
  listView.applyFilter({
    custom_filter_predicate: {
      $and: [{ applicationNumber: { $in: matchingApplicationNumbers } }],
    },
  });
}

Filter Shape Notes

applyFilter(...) accepts predicate buckets used by the list search pipeline:

custom_filter_predicate
search_predicate
saved_filter_predicate
predefined_search_predicate

Troubleshooting

list handle is undefined -> list may not be mounted yet or the ID does not match exactly
no matching ID found -> inspect getRegisteredListViewIds() and verify every segment
filter call has no effect -> verify predicate structure and target model field names
wrong target list updated -> use exact listId matching only

List API

On this page