From 3ee1f18068fba36cc6ce899cc90769bae3c88f9e Mon Sep 17 00:00:00 2001
From: Zeke Zhang <958414905@qq.com>
Date: Thu, 24 Oct 2024 21:03:28 +0800
Subject: [PATCH] refactor(CardItem): remove lazy render

---
 .../antd/card-item/CardItem.tsx               | 23 +++----------------
 1 file changed, 3 insertions(+), 20 deletions(-)

diff --git a/packages/core/client/src/schema-component/antd/card-item/CardItem.tsx b/packages/core/client/src/schema-component/antd/card-item/CardItem.tsx
index 0c9097fe1a..861df27981 100644
--- a/packages/core/client/src/schema-component/antd/card-item/CardItem.tsx
+++ b/packages/core/client/src/schema-component/antd/card-item/CardItem.tsx
@@ -8,9 +8,8 @@
  */
 
 import { useFieldSchema } from '@formily/react';
-import { Skeleton, CardProps } from 'antd';
+import { CardProps } from 'antd';
 import React, { FC } from 'react';
-import { IntersectionOptions, useInView } from 'react-intersection-observer';
 import { useSchemaTemplate } from '../../../schema-templates';
 import { BlockItem } from '../block-item';
 import { BlockItemCard } from '../block-item/BlockItemCard';
@@ -20,38 +19,22 @@ import useStyles from './style';
 export interface CardItemProps extends CardProps {
   name?: string;
   children?: React.ReactNode;
-  /**
-   * lazy render options
-   * @default { threshold: 0, initialInView: true, triggerOnce: true }
-   * @see https://github.com/thebuilder/react-intersection-observer
-   */
-  lazyRender?: IntersectionOptions & { element?: React.JSX.Element };
   heightMode?: string;
   height?: number;
 }
 
 export const CardItem: FC<CardItemProps> = (props) => {
-  const { children, name, lazyRender = {}, heightMode, ...restProps } = props;
+  const { children, name, heightMode, ...restProps } = props;
   const template = useSchemaTemplate();
   const fieldSchema = useFieldSchema();
   const templateKey = fieldSchema?.['x-template-key'];
-  const { element: lazyRenderElement, ...resetLazyRenderOptions } = lazyRender;
-  const { ref, inView } = useInView({
-    threshold: 0,
-    initialInView: true,
-    triggerOnce: true,
-    skip: !!process.env.__E2E__,
-    ...resetLazyRenderOptions,
-  });
   const { wrapSSR, componentCls, hashId } = useStyles();
 
   if (templateKey && !template) return null;
   return wrapSSR(
     <BlockItemError>
       <BlockItem name={name} className={`${componentCls} ${hashId} noco-card-item`}>
-        <BlockItemCard ref={ref} {...restProps}>
-          {inView ? props.children : lazyRenderElement ?? <Skeleton paragraph={{ rows: 4 }} />}
-        </BlockItemCard>
+        <BlockItemCard {...restProps}>{props.children}</BlockItemCard>
       </BlockItem>
     </BlockItemError>,
   );