diff --git a/frontend/dashboard/src/pages/Report/LinksehatPayments/List.tsx b/frontend/dashboard/src/pages/Report/LinksehatPayments/List.tsx
index 8ab73fff..64921697 100644
--- a/frontend/dashboard/src/pages/Report/LinksehatPayments/List.tsx
+++ b/frontend/dashboard/src/pages/Report/LinksehatPayments/List.tsx
@@ -27,6 +27,7 @@ import {
   InputAdornment,
   IconButton,
   InputLabel,
+  Menu,
 } from '@mui/material';
 
 import {
@@ -65,6 +66,8 @@ import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
 import { MenuItem } from '@mui/material';
 import { fDateOnly } from '@/utils/formatTime';
 import AutocompleteLinksehatHealthcare from '@/components/autocomplete/AutocompleteLinksehatHealthcare';
+import { LoadingButton } from '@mui/lab';
+import UploadIcon from '@mui/icons-material/Upload';
 
 // ----------------------------------------------------------------------
 
@@ -90,6 +93,53 @@ export default function List() {
     // SEARCH
     const searchInput = useRef<HTMLInputElement>(null);
     const [searchText, setSearchText] = useState('');
+    const [importLoading, setImportLoading] = useState(false);
+    const [anchorEl, setAnchorEl] = React.useState<null | HTMLElement>(null);
+    const createMenu = Boolean(anchorEl);
+
+    const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {
+      setAnchorEl(event.currentTarget);
+    };
+    const handleClose = () => {
+      setAnchorEl(null);
+    };
+
+    /* ------------------------------ handle params ----------------------------- */
+    const [appliedParams, setAppliedParams] = useState({});
+    const params = {
+      searchParams: searchParams,
+      setSearchParams: setSearchParams,
+      appliedParams: appliedParams,
+      setAppliedParams: setAppliedParams,
+    };
+
+    const handleGetData = (type :string) => {
+      const parameters =
+      Object.keys(appliedParams).length !== 0
+        ? appliedParams
+        : Object.fromEntries([...searchParams.entries()]);
+      setImportLoading(true);
+      axios.get('/linksehat/payments/generate-excel', {
+        params: { ...parameters },
+      }).then((response) => {
+        const link = document.createElement('a');
+        link.href = response.data.data.file_url;
+        link.setAttribute('download', response.data.data.file_name);
+        document.body.appendChild(link);
+        link.click();
+        handleClose();
+        setImportLoading(false);
+      });
+      // axios.get(`report/logs/export`)
+      //   .then((response) => {
+      //     const link = document.createElement('a');
+      //     link.href = response.data.data.file_url;
+      //     link.setAttribute('download', response.data.data.file_name);
+      //     document.body.appendChild(link);
+      //     link.click();
+      //     handleClose();
+      //   })
+    }
 
     //handle search
     const handleSearchChange = (event: any) => {
@@ -170,7 +220,7 @@ export default function List() {
               }}
             />
           </Grid>
-          <Grid item md={2}>
+          <Grid item md={1}>
             <FormControl fullWidth>
               <InputLabel>Payment Status</InputLabel>
               <Select
@@ -283,6 +333,29 @@ export default function List() {
               />
             </LocalizationProvider>
           </Grid>
+
+          <Grid item md={1}>
+          <LoadingButton
+              variant="outlined"
+              startIcon={<UploadIcon />}
+              sx={{ p: 1.8 }}
+              onClick={handleClick}
+              loading={importLoading}
+            >
+              Export
+            </LoadingButton>
+            <Menu
+                id="import-button"
+                anchorEl={anchorEl}
+                open={createMenu}
+                onClose={handleClose}
+                MenuListProps={{
+                  'aria-labelledby': 'basic-button',
+                }}
+              >
+                <MenuItem onClick={() => {handleGetData('')}}>Download Excel</MenuItem>
+            </Menu>
+            </Grid>
         </Grid>
       </form>
     );