Collection tag (#2266)

* feat: collection metadata filter (#2211)

* feat: add dataset collection tags (#2231)

* dataset page

* workflow page

* move

* fix

* add plus filter

* fix

* fix

* fix

* perf: collection tag code

* fix: collection tags (#2249)

* fix

* fix

* fix tags of dataset page

* fix tags of workflow page

* doc

* add comments

* fix: collection tags (#2264)

* fix: metadata filter

* feat: search filter

---------

Co-authored-by: heheer <1239331448@qq.com>
Co-authored-by: heheer <heheer@sealos.io>

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

@@ -5,22 +5,32 @@ import {
   PopoverContent,
   useDisclosure,
   PlacementWithLogical,
-  PopoverArrow
+  PopoverArrow,
+  PopoverContentProps
 } from '@chakra-ui/react';
 
+interface Props extends PopoverContentProps {
+  Trigger: React.ReactNode;
+  placement?: PlacementWithLogical;
+  offset?: [number, number];
+  trigger?: 'hover' | 'click';
+  hasArrow?: boolean;
+  children: (e: { onClose: () => void }) => React.ReactNode;
+  onCloseFunc?: () => void;
+  closeOnBlur?: boolean;
+}
+
 const MyPopover = ({
   Trigger,
   placement,
   offset,
   trigger,
-  children
-}: {
-  Trigger: React.ReactNode;
-  placement?: PlacementWithLogical;
-  offset?: [number, number];
-  trigger?: 'hover' | 'click';
-  children: (e: { onClose: () => void }) => React.ReactNode;
-}) => {
+  hasArrow = true,
+  children,
+  onCloseFunc,
+  closeOnBlur = false,
+  ...props
+}: Props) => {
   const firstFieldRef = React.useRef(null);
 
   const { onOpen, onClose, isOpen } = useDisclosure();
@@ -30,10 +40,13 @@ const MyPopover = ({
       isOpen={isOpen}
       initialFocusRef={firstFieldRef}
       onOpen={onOpen}
-      onClose={onClose}
+      onClose={() => {
+        onClose();
+        onCloseFunc && onCloseFunc();
+      }}
       placement={placement}
       offset={offset}
-      closeOnBlur={false}
+      closeOnBlur={closeOnBlur}
       trigger={trigger}
       openDelay={100}
       closeDelay={100}
@@ -41,8 +54,8 @@ const MyPopover = ({
       lazyBehavior="keepMounted"
     >
       <PopoverTrigger>{Trigger}</PopoverTrigger>
-      <PopoverContent p={4}>
-        <PopoverArrow />
+      <PopoverContent {...props}>
+        {hasArrow && <PopoverArrow />}
         {children({ onClose })}
       </PopoverContent>
     </Popover>