Feat: Using IconFont as an additional icon library #3221 (#7427)

### What problem does this PR solve?
Feat: Using IconFont as an additional icon library #3221

### Type of change


- [x] New Feature (non-breaking change which adds functionality)

web/src/pages/datasets/dataset-card.tsx

@@ -1,11 +1,11 @@
+import { MoreButton } from '@/components/more-button';
 import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
 import { Badge } from '@/components/ui/badge';
-import { Button } from '@/components/ui/button';
 import { Card, CardContent } from '@/components/ui/card';
 import { useNavigatePage } from '@/hooks/logic-hooks/navigate-hooks';
 import { IKnowledge } from '@/interfaces/database/knowledge';
 import { formatDate } from '@/utils/date';
-import { ChevronRight, Ellipsis } from 'lucide-react';
+import { ChevronRight } from 'lucide-react';
 import { DatasetDropdown } from './dataset-dropdown';
 import { useDisplayOwnerName } from './use-display-owner';
 import { useRenameDataset } from './use-rename-dataset';
@@ -29,7 +29,7 @@ export function DatasetCard({
       className="w-40"
       onClick={navigateToDataset(dataset.id)}
     >
-      <CardContent className="p-2.5 pt-1 group">
+      <CardContent className="p-2.5 pt-2 group">
         <section className="flex justify-between mb-2">
           <div className="flex gap-2 items-center">
             <Avatar className="size-6 rounded-lg">
@@ -46,13 +46,7 @@ export function DatasetCard({
             showDatasetRenameModal={showDatasetRenameModal}
             dataset={dataset}
           >
-            <Button
-              variant="ghost"
-              size="icon"
-              className="invisible group-hover:visible"
-            >
-              <Ellipsis />
-            </Button>
+            <MoreButton></MoreButton>
           </DatasetDropdown>
         </section>
         <div className="flex justify-between items-end">