Feat: Upload document #3221 (#7209)

### What problem does this PR solve?

Feat: Upload document #3221

### Type of change


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

web/src/components/confirm-delete-dialog.tsx

@@ -28,7 +28,10 @@ export function ConfirmDeleteDialog({
   return (
     <AlertDialog>
       <AlertDialogTrigger asChild>{children}</AlertDialogTrigger>
-      <AlertDialogContent>
+      <AlertDialogContent
+        onSelect={(e) => e.preventDefault()}
+        onClick={(e) => e.stopPropagation()}
+      >
         <AlertDialogHeader>
           <AlertDialogTitle>
             {title ?? t('common.deleteModalTitle')}

web/src/components/file-upload-dialog/index.tsx

@@ -8,15 +8,16 @@ import {
 } from '@/components/ui/dialog';
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
 import { IModalProps } from '@/interfaces/common';
-import { useState } from 'react';
+import { Dispatch, SetStateAction, useCallback, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { FileUploader } from '../file-uploader';
 
-export function UploaderTabs() {
-  const { t } = useTranslation();
+type UploaderTabsProps = {
+  setFiles: Dispatch<SetStateAction<File[]>>;
+};
 
-  const [files, setFiles] = useState<File[]>([]);
-  console.log('🚀 ~ TabsDemo ~ files:', files);
+export function UploaderTabs({ setFiles }: UploaderTabsProps) {
+  const { t } = useTranslation();
 
   return (
     <Tabs defaultValue="account">
@@ -36,8 +37,13 @@ export function UploaderTabs() {
   );
 }
 
-export function FileUploadDialog({ hideModal }: IModalProps<any>) {
+export function FileUploadDialog({ hideModal, onOk }: IModalProps<File[]>) {
   const { t } = useTranslation();
+  const [files, setFiles] = useState<File[]>([]);
+
+  const handleOk = useCallback(() => {
+    onOk?.(files);
+  }, [files, onOk]);
 
   return (
     <Dialog open onOpenChange={hideModal}>
@@ -45,9 +51,14 @@ export function FileUploadDialog({ hideModal }: IModalProps<any>) {
         <DialogHeader>
           <DialogTitle>{t('fileManager.uploadFile')}</DialogTitle>
         </DialogHeader>
-        <UploaderTabs></UploaderTabs>
+        <UploaderTabs setFiles={setFiles}></UploaderTabs>
         <DialogFooter>
-          <Button type="submit" variant={'tertiary'} size={'sm'}>
+          <Button
+            type="submit"
+            variant={'tertiary'}
+            size={'sm'}
+            onClick={handleOk}
+          >
             {t('common.save')}
           </Button>
         </DialogFooter>

web/src/components/list-filter-bar.tsx

@@ -14,6 +14,7 @@ interface IProps {
   searchString?: string;
   onSearchChange?: ChangeEventHandler<HTMLInputElement>;
   count?: number;
+  showFilter?: boolean;
 }
 
 const FilterButton = React.forwardRef<
@@ -35,18 +36,20 @@ export default function ListFilterBar({
   searchString,
   onSearchChange,
   count,
+  showFilter = true,
 }: PropsWithChildren<IProps>) {
   return (
     <div className="flex justify-between mb-6">
       <span className="text-3xl font-bold ">{title}</span>
       <div className="flex gap-4 items-center">
-        {FilterPopover ? (
-          <FilterPopover>
-            <FilterButton count={count}></FilterButton>
-          </FilterPopover>
-        ) : (
-          <FilterButton></FilterButton>
-        )}
+        {showFilter &&
+          (FilterPopover ? (
+            <FilterPopover>
+              <FilterButton count={count}></FilterButton>
+            </FilterPopover>
+          ) : (
+            <FilterButton></FilterButton>
+          ))}
 
         <SearchInput
           value={searchString}