fix: table compos editorMode status

Author: iamfaran

client/packages/lowcoder/src/comps/comps/tableComp/tableComp.tsx

@@ -62,7 +62,6 @@ import { RowColorComp, RowHeightComp, SortValue, TableChildrenView, TableInitCom
 
 import { useContext, useState } from "react";
 import { EditorContext } from "comps/editorState";
-import { useEditorStore } from "comps/editorStore";
 
 export class TableImplComp extends TableInitComp implements IContainer {
   private prevUnevaledValue?: string;
@@ -565,16 +564,7 @@ let TableTmpComp = withViewFn(TableImplComp, (comp) => {
 });
 
 
-const withEditorModeStatus = (Component:any) => (props:any) => {
-  const editorModeStatus = useEditorStore((state) => state.editorModeStatus);
-  const {ref, ...otherProps} = props;
-  return <Component {...otherProps} editorModeStatus={editorModeStatus} />;
-};
-
-// Use this HOC when defining TableTmpComp
-TableTmpComp = withPropertyViewFn(TableTmpComp, (comp) => withEditorModeStatus(compTablePropertyView)(comp));
-
-// TableTmpComp = withPropertyViewFn(TableTmpComp, compTablePropertyView);
+TableTmpComp = withPropertyViewFn(TableTmpComp, compTablePropertyView);
 
 
 

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

@@ -35,6 +35,7 @@ import { alignOptions } from "comps/controls/dropdownControl";
 import { ColumnTypeCompMap } from "comps/comps/tableComp/column/columnTypeComp";
 import Segmented from "antd/es/segmented";
 import { CheckboxChangeEvent } from "antd/es/checkbox";
+import { useEditorStore } from "comps/editorStore";
 
 const InsertDiv = styled.div`
   display: flex;
@@ -496,8 +497,8 @@ function columnPropertyView<T extends MultiBaseComp<TableChildrenType>>(comp: T)
   ];
 }
 
-export function compTablePropertyView<T extends MultiBaseComp<TableChildrenType> & { editorModeStatus: string }>(comp: T) {
-  const editorModeStatus = comp.editorModeStatus;
+function TablePropertyView<T extends MultiBaseComp<TableChildrenType>>({ comp }: { comp: T }) {
+  const editorModeStatus = useEditorStore((state) => state.editorModeStatus);
   const dataLabel = trans("data");
 
   return (
@@ -661,3 +662,7 @@ export function compTablePropertyView<T extends MultiBaseComp<TableChildrenType>
     </>
   );
 }
+
+export function compTablePropertyView<T extends MultiBaseComp<TableChildrenType>>(comp: T) {
+  return <TablePropertyView comp={comp} />;
+}

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

@@ -42,7 +42,6 @@ import { RowColorComp, RowHeightComp, TableChildrenView, TableInitComp } from ".
 
 import { useContext } from "react";
 import { EditorContext } from "comps/editorState";
-import { useEditorStore } from "comps/editorStore";
 import { tableMethodExposings } from "./methods/tableMethodExposings";
 import { buildSortedDataNode, buildFilteredDataNode, buildOriDisplayDataNode, buildColumnAggrNode } from "./nodes/dataNodes";
 
@@ -242,14 +241,7 @@ let TableTmpComp = withViewFn(TableImplComp, (comp) => {
   );
 });
 
-const withEditorModeStatus = (Component:any) => (props:any) => {
-  const editorModeStatus = useEditorStore((state) => state.editorModeStatus);
-  const {ref, ...otherProps} = props;
-  return <Component {...otherProps} editorModeStatus={editorModeStatus} />;
-};
-
-
-TableTmpComp = withPropertyViewFn(TableTmpComp, (comp) => withEditorModeStatus(compTablePropertyView)(comp));
+TableTmpComp = withPropertyViewFn(TableTmpComp, compTablePropertyView);
 
 TableTmpComp = withDispatchHook(TableTmpComp, (dispatch) => (action) => {
   if (!dispatch) {

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

@@ -35,6 +35,7 @@ import { alignOptions } from "comps/controls/dropdownControl";
 import { ColumnTypeCompMap } from "./column/columnTypeComp";
 import Segmented from "antd/es/segmented";
 import { CheckboxChangeEvent } from "antd/es/checkbox";
+import { useEditorStore } from "comps/editorStore";
 
 const InsertDiv = styled.div`
   display: flex;
@@ -485,8 +486,8 @@ function columnPropertyView<T extends MultiBaseComp<TableChildrenType>>(comp: T)
   ];
 }
 
-export function compTablePropertyView<T extends MultiBaseComp<TableChildrenType> & { editorModeStatus: string }>(comp: T) {
-  const editorModeStatus = comp.editorModeStatus;
+function TablePropertyView<T extends MultiBaseComp<TableChildrenType>>({ comp }: { comp: T }) {
+  const editorModeStatus = useEditorStore((state) => state.editorModeStatus);
   const dataLabel = trans("data");
 
   return (
@@ -635,3 +636,7 @@ export function compTablePropertyView<T extends MultiBaseComp<TableChildrenType>
     </>
   );
 }
+
+export function compTablePropertyView<T extends MultiBaseComp<TableChildrenType>>(comp: T) {
+  return <TablePropertyView comp={comp} />;
+}