4.8.19-feature (#3636)

* feat: sync org from wecom, pref: member list pagination (#3549)

* feat: sync org

* chore: fe

* chore: loading

* chore: type

* pref: team member list change to pagination. Edit a sort of list apis.

* feat: member update avatar

* chore: user avatar move to tmb

* chore: init scripts move user avatar

* chore: sourceMember

* fix: list api sourceMember

* fix: member sync

* fix: pagination

* chore: adjust code

* chore: move changeOwner to pro

* chore: init v4819 script

* chore: adjust code

* chore: UserBox

* perf: scroll page code

* perf: list data

* docs:更新用户答疑 (#3576)

* docs: add custom uid docs (#3572)

* fix: pagination bug (#3577)

* 4.8.19 test (#3584)

* faet: dataset search filter

* fix: scroll page

* fix: collection list api old version (#3591)

* fix: collection list api format

* fix: type error of addSourceMemeber

* fix: scroll fetch (#3592)

* fix: yuque dataset file folder can enter (#3593)

* perf: load members；perf: yuque load；fix: workflow llm params cannot close (#3594)

* chat openapi doc

* feat: dataset openapi doc

* perf: load members

* perf: member load code

* perf: yuque load

* fix: workflow llm params cannot close

* fix: api dataset reference tag preview (#3600)

* perf: doc

* feat: chat page config

* fix: http parse (#3634)

* update doc

* fix: http parse

* fix code run node reset template (#3633)

Co-authored-by: Archer <545436317@qq.com>

* docs:faq (#3627)

* docs:faq

* docsFix

* perf: sleep plugin

* fix: selector

---------

Co-authored-by: Finley Ge <32237950+FinleyGe@users.noreply.github.com>
Co-authored-by: Jiangween <145003935+Jiangween@users.noreply.github.com>
Co-authored-by: heheer <heheer@sealos.io>

packages/web/components/common/MySelect/index.tsx

@@ -21,7 +21,15 @@ import type { ButtonProps, MenuItemProps } from '@chakra-ui/react';
 import MyIcon from '../Icon';
 import { useRequest2 } from '../../../hooks/useRequest';
 import MyDivider from '../MyDivider';
+import { useScrollPagination } from '../../../hooks/useScrollPagination';
 
+/** 选择组件 Props 类型
+ * value: 选中的值
+ * placeholder: 占位符
+ * list: 列表数据
+ * isLoading: 是否加载中
+ * ScrollData: 分页滚动数据控制器 [useScrollPagination] 的返回值
+ * */
 export type SelectProps<T = any> = ButtonProps & {
   value?: T;
   placeholder?: string;
@@ -34,6 +42,7 @@ export type SelectProps<T = any> = ButtonProps & {
   }[];
   isLoading?: boolean;
   onchange?: (val: T) => any | Promise<any>;
+  ScrollData?: ReturnType<typeof useScrollPagination>['ScrollData'];
 };
 
 const MySelect = <T = any,>(
@@ -44,6 +53,7 @@ const MySelect = <T = any,>(
     list = [],
     onchange,
     isLoading = false,
+    ScrollData,
     ...props
   }: SelectProps<T>,
   ref: ForwardedRef<{
@@ -87,6 +97,46 @@ const MySelect = <T = any,>(
 
   const isSelecting = loading || isLoading;
 
+  const ListRender = useMemo(() => {
+    return (
+      <>
+        {list.map((item, i) => (
+          <Box key={i}>
+            <MenuItem
+              {...menuItemStyles}
+              {...(value === item.value
+                ? {
+                    ref: SelectedItemRef,
+                    color: 'primary.700',
+                    bg: 'myGray.100',
+                    fontWeight: '600'
+                  }
+                : {
+                    color: 'myGray.900'
+                  })}
+              onClick={() => {
+                if (onChange && value !== item.value) {
+                  onChange(item.value);
+                }
+              }}
+              whiteSpace={'pre-wrap'}
+              fontSize={'sm'}
+              display={'block'}
+            >
+              <Box>{item.label}</Box>
+              {item.description && (
+                <Box color={'myGray.500'} fontSize={'xs'}>
+                  {item.description}
+                </Box>
+              )}
+            </MenuItem>
+            {item.showBorder && <MyDivider my={2} />}
+          </Box>
+        ))}
+      </>
+    );
+  }, [list, value]);
+
   return (
     <Box
       css={css({
@@ -154,39 +204,7 @@ const MySelect = <T = any,>(
           maxH={'40vh'}
           overflowY={'auto'}
         >
-          {list.map((item, i) => (
-            <Box key={i}>
-              <MenuItem
-                {...menuItemStyles}
-                {...(value === item.value
-                  ? {
-                      ref: SelectedItemRef,
-                      color: 'primary.700',
-                      bg: 'myGray.100',
-                      fontWeight: '600'
-                    }
-                  : {
-                      color: 'myGray.900'
-                    })}
-                onClick={() => {
-                  if (onChange && value !== item.value) {
-                    onChange(item.value);
-                  }
-                }}
-                whiteSpace={'pre-wrap'}
-                fontSize={'sm'}
-                display={'block'}
-              >
-                <Box>{item.label}</Box>
-                {item.description && (
-                  <Box color={'myGray.500'} fontSize={'xs'}>
-                    {item.description}
-                  </Box>
-                )}
-              </MenuItem>
-              {item.showBorder && <MyDivider my={2} />}
-            </Box>
-          ))}
+          {ScrollData ? <ScrollData>{ListRender}</ScrollData> : ListRender}
         </MenuList>
       </Menu>
     </Box>