fix status column edited value doesn't persist

Author: raheeliftikhar5

client/packages/lowcoder/src/components/table/EditableCell.tsx

@@ -104,7 +104,7 @@ export function EditableCell<T extends JSONValue>(props: EditableCellProps<T>) {
 
   useEffect(() => {
     setTmpValue(value);
-  }, [value]);
+  }, [JSON.stringify(value)]);
 
   const onChange = useCallback(
     (value: T) => {
@@ -125,11 +125,11 @@ export function EditableCell<T extends JSONValue>(props: EditableCellProps<T>) {
     if(!_.isEqual(tmpValue, value)) {
       onTableEvent?.('columnEdited');
     }
-  }, [dispatch, baseValue, tmpValue]);
+  }, [dispatch, JSON.stringify(baseValue), JSON.stringify(tmpValue)]);
 
   const editView = useMemo(
     () => editViewFn?.({ value, onChange, onChangeEnd }) ?? <></>,
-    [editViewFn, value, onChange, onChangeEnd]
+    [editViewFn, JSON.stringify(value), onChange, onChangeEnd]
   );
 
   const enterEditFn = useCallback(() => {

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

@@ -325,15 +325,6 @@ const TableWrapper = styled.div<{
             border-top-right-radius: 0px;
           }
         }
-
-        // hide the bottom border of the last row
-        ${(props) =>
-    props.$toolbarPosition !== "below" &&
-    `
-            tbody > tr:last-child > td {
-              border-bottom: unset;
-            }
-        `}
       }
 
       .ant-table-expanded-row-fixed:after {
@@ -948,6 +939,7 @@ export function TableCompView(props: {
     return (
       <TableSummary
         tableSize={size}
+        istoolbarPositionBelow={toolbar.position === "below"}
         expandableRows={Boolean(expansion.expandModalView)}
         summaryRows={parseInt(summaryRows)}
         columns={columns}

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

@@ -7,10 +7,19 @@ import Table from "antd/es/table";
 import { ReactNode } from "react";
 import Tooltip from "antd/es/tooltip";
 
-const TableSummaryRow = styled(Table.Summary.Row)`
+const TableSummaryRow = styled(Table.Summary.Row)<{
+  $istoolbarPositionBelow: boolean;
+}>`
   td:last-child {
     border-right: unset !important;
   }
+
+  ${props => !props.$istoolbarPositionBelow && `
+    &:last-child td {
+      border-bottom: none !important;
+    }
+  `}
+  
 `;
 
 const TableSummarCell = styled(Table.Summary.Cell)<{
@@ -168,13 +177,15 @@ export function TableSummary(props: {
   summaryRows: number;
   columns: ColumnComp[];
   summaryRowStyle: TableSummaryRowStyleType;
+  istoolbarPositionBelow: boolean;
 }) {
   const {
     columns,
     summaryRows,
     summaryRowStyle,
     tableSize,
     expandableRows,
+    istoolbarPositionBelow,
   } = props;
   let visibleColumns = columns.filter(col => !col.getView().hide);
   if (expandableRows) {
@@ -186,7 +197,7 @@ export function TableSummary(props: {
   return (
     <Table.Summary>
       {Array.from(Array(summaryRows)).map((_, rowIndex) => (
-        <TableSummaryRow key={rowIndex}>
+        <TableSummaryRow key={rowIndex} $istoolbarPositionBelow={istoolbarPositionBelow}>
           {visibleColumns.map((column, index) => {
             const summaryColumn = column.children.summaryColumns.getView()[rowIndex].getView();
             return (