remove expansion functionality from table

Author: iamfaran

client/packages/lowcoder/src/comps/comps/tableLiteComp/expansionControl.tsx

@@ -1,7 +1,7 @@
 import { default as Table, TableProps, ColumnType } from "antd/es/table";
-import { TableCellContext, TableRowContext } from "comps/comps/tableComp/tableContext";
-import { TableToolbar } from "comps/comps/tableComp/tableToolbarComp";
-import { RowColorViewType, RowHeightViewType, TableEventOptionValues } from "comps/comps/tableComp/tableTypes";
+import { TableCellContext, TableRowContext } from "comps/comps/tableLiteComp/tableContext";
+import { TableToolbar } from "comps/comps/tableLiteComp/tableToolbarComp";
+import { RowColorViewType, RowHeightViewType, TableEventOptionValues } from "comps/comps/tableLiteComp/tableTypes";
 import {
   COL_MIN_WIDTH,
   COLUMN_CHILDREN_KEY,
@@ -12,7 +12,7 @@ import {
   onTableChange,
   RecordType,
   supportChildrenTree,
-} from "comps/comps/tableComp/tableUtils";
+} from "comps/comps/tableLiteComp/tableUtils";
 import {
   handleToHoverRow,
   handleToSelectedRow,
@@ -870,14 +870,12 @@ export const TableCompView = React.memo((props: {
   const size = useMemo(() => compChildren.size.getView(), [compChildren.size]);
   const editModeClicks = useMemo(() => compChildren.editModeClicks.getView(), [compChildren.editModeClicks]);
   const onEvent = useMemo(() => compChildren.onEvent.getView(), [compChildren.onEvent]);
-  const currentExpandedRows = useMemo(() => compChildren.currentExpandedRows.getView(), [compChildren.currentExpandedRows]);
   const dynamicColumn = compChildren.dynamicColumn.getView();
   const dynamicColumnConfig = useMemo(
     () => compChildren.dynamicColumnConfig.getView(),
     [compChildren.dynamicColumnConfig]
   );
   const columnsAggrData = comp.columnAggrData;
-  const expansion = useMemo(() => compChildren.expansion.getView(), [compChildren.expansion]);
   const antdColumns = useMemo(
     () =>
       columnsToAntdFormat(
@@ -970,17 +968,7 @@ export const TableCompView = React.memo((props: {
     updateEmptyRows();
   }, [updateEmptyRows]);
 
-  useUpdateEffect(() => {
-    if (!isEqual(currentExpandedRows, expandedRowKeys)) {
-      compChildren.currentExpandedRows.dispatchChangeValueAction(expandedRowKeys);
-    }
-  }, [expandedRowKeys]);
 
-  useUpdateEffect(() => {
-    if (!isEqual(currentExpandedRows, expandedRowKeys)) {
-      setExpandedRowKeys(currentExpandedRows);
-    }
-  }, [currentExpandedRows]);
 
   const pageDataInfo = useMemo(() => {
     // Data pagination
@@ -1032,7 +1020,7 @@ export const TableCompView = React.memo((props: {
         total: pageDataInfo.total,
         current: pageDataInfo.current,
       }}
-      columns={columns}
+      columns={columns as any}
       onRefresh={() =>
         onRefresh(
           editorState.queryCompInfoList().map((info) => info.name),
@@ -1062,7 +1050,6 @@ export const TableCompView = React.memo((props: {
         tableSize={size}
         istoolbarPositionBelow={toolbar.position === "below"}
         multiSelectEnabled={compChildren.selection.children.mode.value === 'multiple'}
-        expandableRows={Boolean(expansion.expandModalView)}
         summaryRows={parseInt(summaryRows)}
         columns={columns}
         summaryRowStyle={summaryRowStyle}
@@ -1119,31 +1106,12 @@ export const TableCompView = React.memo((props: {
             $showHRowGridBorder={showHRowGridBorder}
           >
             <ResizeableTable<RecordType>
-              expandable={{
-                ...expansion.expandableConfig,
-                childrenColumnName: supportChildren
-                  ? COLUMN_CHILDREN_KEY
-                  : "OB_CHILDREN_KEY_PLACEHOLDER",
-                fixed: "left",
-                onExpand: (expanded) => {
-                  if (expanded) {
-                    handleChangeEvent('rowExpand')
-                  } else {
-                    handleChangeEvent('rowShrink')
-                  }
-                },
-                onExpandedRowsChange: (expandedRowKeys) => {
-                  setExpandedRowKeys(expandedRowKeys as unknown as string[]);
-                },
-                expandedRowKeys: expandedRowKeys,
-              }}
-              // rowKey={OB_ROW_ORI_INDEX}
               rowColorFn={compChildren.rowColor.getView() as any}
               rowHeightFn={compChildren.rowHeight.getView() as any}
               {...compChildren.selection.getView()(onEvent)}
               bordered={compChildren.showRowGridBorder.getView()}
               onChange={(pagination, filters, sorter, extra) => {
-                onTableChange(pagination, filters, sorter, extra, comp.dispatch, onEvent);
+                onTableChange(pagination, filters, sorter, extra, comp.dispatch, onEvent as any);
               }}
               showHeader={!compChildren.hideHeader.getView()}
               columns={antdColumns}
@@ -1163,9 +1131,6 @@ export const TableCompView = React.memo((props: {
               }}
               summary={summaryView}
             />
-            <SlotConfigContext.Provider value={{ modalWidth: width && Math.max(width, 300) }}>
-              {expansion.expandModalView}
-            </SlotConfigContext.Provider>
           </TableWrapper>
         </ScrollBar>
         {toolbar.position === "below" && !hideToolbar && (toolbar.fixedToolbar || (tableAutoHeight && showHorizontalScrollbar)) && toolbarView}

client/packages/lowcoder/src/comps/comps/tableLiteComp/tableCompView.tsx

@@ -604,7 +604,6 @@ export function compTablePropertyView<T extends MultiBaseComp<TableChildrenType>
       {["logic", "both"].includes(editorModeStatus) && (
         <>
           <Section name={sectionNames.advanced}>
-            {comp.children.expansion.getPropertyView()}
             {comp.children.dynamicColumn.propertyView({ label: trans("table.dynamicColumn") })}
             {comp.children.dynamicColumn.getView() &&
               comp.children.dynamicColumnConfig.propertyView({

client/packages/lowcoder/src/comps/comps/tableLiteComp/tablePropertyView.tsx

@@ -200,7 +200,6 @@ TableSummaryCellView.displayName = 'TableSummaryCellView';
 
 export const TableSummary = memo(function TableSummary(props: {
   tableSize: string;
-  expandableRows: boolean;
   multiSelectEnabled: boolean;
   summaryRows: number;
   columns: ColumnComp[];
@@ -214,7 +213,6 @@ export const TableSummary = memo(function TableSummary(props: {
     summaryRows,
     summaryRowStyle,
     tableSize,
-    expandableRows,
     multiSelectEnabled,
     istoolbarPositionBelow,
     dynamicColumn,
@@ -229,14 +227,11 @@ export const TableSummary = memo(function TableSummary(props: {
         return dynamicColumnConfig.includes(colView.isCustom ? colView.title : colView.dataIndex)
       })
     }
-    if (expandableRows) {
-      cols.unshift(new ColumnComp({}));
-    }
     if (multiSelectEnabled) {
       cols.unshift(new ColumnComp({}));
     }
     return cols;
-  }, [columns, expandableRows, multiSelectEnabled, dynamicColumn, dynamicColumnConfig]);
+  }, [columns, multiSelectEnabled, dynamicColumn, dynamicColumnConfig]);
 
   const renderSummaryCell = useCallback((column: ColumnComp, rowIndex: number, index: number) => {
     const summaryColumn = column.children.summaryColumns.getView()[rowIndex].getView();

client/packages/lowcoder/src/comps/comps/tableLiteComp/tableSummaryComp.tsx

@@ -2,8 +2,9 @@ import { default as Button } from "antd/es/button";
 import { default as Pagination, PaginationProps } from "antd/es/pagination";
 import { default as Popover } from "antd/es/popover";
 import { ThemeDetail } from "api/commonSettingApi";
-import { ColumnCompType } from "comps/comps/tableComp/column/tableColumnComp";
-import { TableOnEventView } from "comps/comps/tableComp/tableTypes";
+import { ColumnCompType } from "comps/comps/tableLiteComp/column/tableColumnComp";
+import { ColumnComp } from "./column/tableColumnComp";
+import { TableOnEventView } from "comps/comps/tableLiteComp/tableTypes";
 import { BoolControl } from "comps/controls/boolControl";
 import { StringControl } from "comps/controls/codeControl";
 import { dropdownControl } from "comps/controls/dropdownControl";

client/packages/lowcoder/src/comps/comps/tableLiteComp/tableToolbarComp.tsx

@@ -32,7 +32,6 @@ import {
 } from "lowcoder-core";
 import { controlItem } from "lowcoder-design";
 import { JSONArray, JSONObject } from "util/jsonTypes";
-import { ExpansionControl } from "./expansionControl";
 import { PaginationControl } from "./paginationControl";
 import { SelectionControl } from "./selectionControl";
 import { AutoHeightControl } from "comps/controls/autoHeightControl";
@@ -99,16 +98,6 @@ export const TableEventOptions = [
     value: "rowClick",
     description: trans("table.rowClick"),
   },
-  {
-    label: trans("table.rowExpand"),
-    value: "rowExpand",
-    description: trans("table.rowExpand"),
-  },
-  {
-    label: trans("table.rowShrink"),
-    value: "rowShrink",
-    description: trans("table.rowShrink"),
-  },
   {
     label: trans("table.columnEdited"),
     value: "columnEdited",
@@ -261,11 +250,9 @@ const tableChildrenMap = {
   dynamicColumn: BoolPureControl,
   // todo: support object config
   dynamicColumnConfig: ArrayStringControl,
-  expansion: ExpansionControl,
   selectedCell: stateComp<JSONObject>({}),
   inlineAddNewRow: BoolControl,
   editModeClicks: dropdownControl(editModeClickOptions, "single"),
-  currentExpandedRows: stateComp<string[]>([]),
 };
 
 export const TableInitComp = (function () {