List view test

packages/react-sdk-components/src/components/field/ObjectReference/ObjectReference.tsx

@@ -316,6 +316,7 @@ export default function ObjectReference(props: ObjectReferenceProps) {
         referenceList: rawViewMetadata.config.referenceList,
         referenceType,
         rowHeader: rawViewMetadata.config.rowHeader,
+        parameters: rawViewMetadata.config.parameters,
         selectionList: contextPageValue,
         selectionMode: mode,
         showPromotedFilters: false,

packages/react-sdk-components/src/components/template/ListView/ListView.tsx

@@ -41,6 +41,7 @@ import { getGenericFieldsLocalizedValue } from '../../helpers/common-utils';
 import { format } from '../../helpers/formatters';
 
 import useInit from './hooks';
+import { useCascadeAndUpdate } from './hooks';
 import type { PConnProps } from '../../../types/PConnProps';
 
 interface ListViewProps extends PConnProps {
@@ -77,6 +78,7 @@ let sortColumnId: any;
 const filterByColumns: any[] = [];
 
 export default function ListView(props: ListViewProps) {
+  console.log('ListView props', props);
   const { getPConnect, bInForm = true } = props;
   const {
     globalSearch,
@@ -459,7 +461,7 @@ export default function ListView(props: ListViewProps) {
     fetchDataFromServer();
   }
 
-  function fetchAllData(fields): any {
+  function fetchAllData(fields, overrideParams?: any): any {
     if (displayAs === 'advancedSearch' && !showRecords) {
       return Promise.resolve({ data: null });
     }
@@ -479,12 +481,13 @@ export default function ListView(props: ListViewProps) {
       query = filterPayload.current?.query;
     }
     const context = getPConnect().getContextName();
+    const resolvedParams = overrideParams ?? dataViewParameters;
     // getDataAsync isn't returning correct data for the Page(i.e. ListView within a page) case
     return !bInForm
       ? // @ts-ignore - 3rd parameter "context" should be optional in getData method
         PCore.getDataApiUtils().getData(referenceList, payload)
       : // @ts-ignore - Argument of type 'null' is not assignable to parameter of type 'object'
-        PCore.getDataPageUtils().getDataAsync(referenceList, context, payload ? payload.dataViewParameters : dataViewParameters, null, query);
+        PCore.getDataPageUtils().getDataAsync(referenceList, context, payload ? payload.dataViewParameters : resolvedParams, null, query);
   }
 
   const buildSelect = (fieldDefs, colId, patchQueryFields = [], compositeKeys = []) => {
@@ -557,12 +560,12 @@ export default function ListView(props: ListViewProps) {
     return fieldsMap;
   };
 
-  async function fetchDataFromServer() {
+  async function fetchDataFromServer(overrideParams?: any) {
     let bCallSetRowsColumns = true;
     const { fieldDefs, itemKey, patchQueryFields } = meta;
     let listFields = fieldDefs ? buildSelect(fieldDefs, undefined, patchQueryFields, compositeKeys) : [];
     listFields = addItemKeyInSelect(fieldDefs, itemKey, listFields, compositeKeys);
-    const workListJSON = await fetchAllData(listFields);
+    const workListJSON = await fetchAllData(listFields, overrideParams);
 
     // this is an unresovled version of this.fields$, need unresolved, so can get the property reference
     const columnFields = componentConfig.presets[0].children[0].children;
@@ -652,6 +655,14 @@ export default function ListView(props: ListViewProps) {
     }, {});
   }
 
+  useCascadeAndUpdate({
+    getPConnect,
+    listContext,
+    referenceList,
+    parameters,
+    fetchDataFromServer
+  });
+
   useEffect(() => {
     if (listContext.meta) {
       const identifier = `promoted-filters-queryable-${uniqueId}`;

packages/react-sdk-components/src/components/template/ListView/hooks.ts

@@ -1,7 +1,70 @@
-import { useEffect } from 'react';
+import { useEffect, useRef } from 'react';
 
 import { getContext, readContextResponse } from './utils';
 
+/**
+ * Hook that subscribes to parameter field changes and triggers a data re-fetch
+ * when the parameters change. This mirrors the useCascadeAndUpdate hook from
+ * the constellation-frontend codebase.
+ */
+export function useCascadeAndUpdate({ getPConnect, listContext, referenceList, parameters, fetchDataFromServer }) {
+  const isParametersOverride = !!parameters;
+  const fetchRef = useRef(fetchDataFromServer);
+  fetchRef.current = fetchDataFromServer;
+
+  useEffect(() => {
+    if (Object.keys(listContext).length === 0) return;
+
+    const fieldChangeCallback = () => {
+      if (listContext.meta) {
+        // Resolve fresh parameters at callback time since the subscription fires
+        // before React re-renders with updated props
+        const { parameters: freshParams } = getPConnect().getConfigProps();
+        fetchRef.current(freshParams);
+      }
+    };
+
+    const rawViewParameters = getPConnect().getComponentConfig?.()?.parameters;
+    const subscriptionId = crypto.randomUUID();
+
+    const overriddenParamFields: string[] = [];
+
+    // Collect overridden parameter fields that are property references
+    if (rawViewParameters && isParametersOverride) {
+      Object.keys(rawViewParameters).forEach(paramKey => {
+        const paramField = rawViewParameters[paramKey];
+        if (PCore.getAnnotationUtils().isProperty(paramField)) {
+          overriddenParamFields.push(`.${PCore.getAnnotationUtils().getPropertyName(paramField)}`);
+        }
+      });
+    }
+
+    // Subscribe to parameter field changes when parameters are overridden on the view
+    if (overriddenParamFields.length !== 0) {
+      PCore.getDataPageUtils().subscribeToUpdate(
+        referenceList,
+        overriddenParamFields,
+        getPConnect().getContextName(),
+        getPConnect().getPageReference(),
+        fieldChangeCallback,
+        `${subscriptionId}-override-params`
+      );
+    }
+
+    return function cleanup() {
+      if (overriddenParamFields.length !== 0) {
+        PCore.getDataPageUtils().unsubscribe(
+          referenceList,
+          overriddenParamFields,
+          getPConnect().getContextName(),
+          getPConnect().getPageReference(),
+          `${subscriptionId}-override-params`
+        );
+      }
+    };
+  }, [listContext]);
+}
+
 export default function useInit(props) {
   const {
     referenceList,

packages/react-sdk-components/src/components/template/SimpleTable/SimpleTableManual/SimpleTableManual.tsx

@@ -217,7 +217,9 @@ export default function SimpleTableManual(props: PropsWithChildren<SimpleTableMa
   });
 
   useEffect(() => {
-    buildElementsForTable();
+    if (!(readOnlyMode && dataPageName)) {
+      buildElementsForTable();
+    }
     if (readOnlyMode || allowEditingInModal) {
       generateRowsData();
     }
@@ -303,14 +305,17 @@ export default function SimpleTableManual(props: PropsWithChildren<SimpleTableMa
 
   function generateRowsData() {
     myRowsRef.current = [];
-
     // if referenceList is empty and dataPageName property value exists then make a datapage fetch call and get the list of data.
     if (!referenceList.length && dataPageName) {
       getDataPage(dataPageName, parameters, context)
         .then(listData => {
           const data = formatRowsData(listData);
           myRowsRef.current = data || [];
           setRowData(data);
+          // Build elements from fetched data since referenceList may be empty for data page tables
+          if (readOnlyMode) {
+            buildElementsFromData(listData as any[]);
+          }
         })
         .catch(e => {
           console.log(e);
@@ -423,13 +428,14 @@ export default function SimpleTableManual(props: PropsWithChildren<SimpleTableMa
           const pageReferenceValue = isDatapage
             ? `${referenceListData}[${index}]`
             : `${pConn.getPageReference()}${referenceListData.substring(referenceListData.lastIndexOf('.'))}[${index}]`;
+          const isDisplayOnly = readOnlyMode || allowEditingInModal;
           const config = {
             meta: item,
             options: {
               context,
               pageReference: pageReferenceValue,
               referenceList: referenceListData,
-              hasForm: true
+              hasForm: !isDisplayOnly
             }
           };
           const view = PCore.createPConnect(config);
@@ -441,6 +447,22 @@ export default function SimpleTableManual(props: PropsWithChildren<SimpleTableMa
     setElementsData(eleData);
   }
 
+  function buildElementsFromData(listData: any[]) {
+    const eleData: any = [];
+    listData.forEach((element, index) => {
+      const data: any = [];
+      rawFields.forEach(item => {
+        if (!item.config.hide) {
+          const propName = item.config.value.replace('@P .', '');
+          const val = getRowValue(element, propName);
+          data.push(createElement('span', { key: `${index}-${propName}` }, val ?? '---'));
+        }
+      });
+      eleData.push(data);
+    });
+    setElementsData(eleData);
+  }
+
   const handleRequestSort = (event: React.MouseEvent<unknown>, property: keyof any) => {
     const isAsc = orderBy === property && order === 'asc';
     setOrder(isAsc ? 'desc' : 'asc');