fix: playground message flashing

src/components/seal-form/components/label-info.tsx

@@ -10,23 +10,38 @@ interface NoteInfoProps {
 }
 const NoteInfo: React.FC<NoteInfoProps> = (props) => {
   const { required, description, label } = props || {};
+
   return (
     <span className="label-text">
-      <span>{label}</span>
-      <span className="note-info">
-        {required && (
-          <span style={{ color: 'red' }} className="star">
-            *
-          </span>
-        )}
-        {description && (
-          <span style={{ marginLeft: 5, color: 'gray' }} className="desc">
-            <Tooltip title={description}>
+      {description ? (
+        <Tooltip title={description}>
+          <span>{label}</span>
+          <span className="note-info">
+            {required && (
+              <span style={{ color: 'red' }} className="star">
+                *
+              </span>
+            )}
+            <span
+              style={{ marginLeft: required ? 5 : 0, color: 'gray' }}
+              className="desc"
+            >
               <InfoCircleOutlined />
-            </Tooltip>
+            </span>
           </span>
-        )}
-      </span>
+        </Tooltip>
+      ) : (
+        <>
+          <span>{label}</span>
+          <span className="note-info">
+            {required && (
+              <span style={{ color: 'red' }} className="star">
+                *
+              </span>
+            )}
+          </span>
+        </>
+      )}
     </span>
   );
 };

src/components/seal-table/components/table-row.tsx

@@ -39,8 +39,8 @@ const TableRow: React.FC<
 
   console.log('table row====');
   const { updateChunkedList } = useUpdateChunkedList({
-    setDataList: setChildrenData,
-    callback: (list) => renderChildren?.(list)
+    setDataList: setChildrenData
+    // callback: (list) => renderChildren?.(list)
   });
 
   useEffect(() => {
@@ -101,6 +101,7 @@ const TableRow: React.FC<
       setChildrenData([]);
       setLoading(false);
     } finally {
+      childrenDataRef.current = childrenData;
       setFirstLoad(false);
     }
   };

src/components/seal-table/index.tsx

@@ -30,10 +30,10 @@ const SealTable: React.FC<SealTableProps> = (props) => {
   useEffect(() => {
     if (rowSelection) {
       const { selectedRowKeys } = rowSelection;
-      if (selectedRowKeys.length === 0) {
+      if (selectedRowKeys?.length === 0) {
         setSelectAll(false);
         setIndeterminate(false);
-      } else if (selectedRowKeys.length === props.dataSource.length) {
+      } else if (selectedRowKeys?.length === props.dataSource.length) {
         setSelectAll(true);
         setIndeterminate(false);
       } else {
@@ -45,12 +45,10 @@ const SealTable: React.FC<SealTableProps> = (props) => {
 
   const handleSelectAllChange = (e: any) => {
     if (e.target.checked) {
-      // update selectedRowKeys
       rowSelection?.onChange(props.dataSource.map((record) => record[rowKey]));
       setSelectAll(true);
       setIndeterminate(false);
     } else {
-      // update selectedRowKeys
       rowSelection?.onChange([]);
       setSelectAll(false);
       setIndeterminate(false);

src/components/status-tag/index.less

@@ -12,7 +12,7 @@
   overflow: hidden;
 
   &.download {
-    border: 1px solid var(--ant-color-border) !important;
+    border: 1px solid #93ecc5 !important;
   }
 
   .download {
@@ -24,12 +24,14 @@
     top: 0;
     bottom: 0;
     height: 100%;
-    background-color: rgba(0, 0, 0, 15%);
+    // background-color: rgba(0, 0, 0, 15%);
+    background-color: #e0f5ec;
   }
 
   .progress {
     position: relative;
     z-index: 10;
-    color: var(--ant-color-text);
+    // color: var(--ant-color-text);
+    color: var(--color-progress-green);
   }
 }

src/components/status-tag/index.tsx

@@ -27,7 +27,11 @@ type StatusTagProps = {
 
 const StatusTag: React.FC<StatusTagProps> = ({ statusValue, download }) => {
   const { text, status } = statusValue;
-  const [statusColor, setStatusColor] = useState<{ text: string; bg: string }>({
+  const [statusColor, setStatusColor] = useState<{
+    text: string;
+    bg: string;
+    border?: string;
+  }>({
     text: '',
     bg: ''
   });
@@ -56,7 +60,7 @@ const StatusTag: React.FC<StatusTagProps> = ({ statusValue, download }) => {
       })}
       style={{
         color: statusColor?.text,
-        border: `1px solid ${statusColor?.text}`
+        border: `1px solid ${statusColor?.border || statusColor?.text}`
       }}
     >
       {statusValue.message ? (