From b7410c7d338612eb607901d0a8cdbb4f554cd232 Mon Sep 17 00:00:00 2001
From: enes <enes@nostrdev.com>
Date: Fri, 17 Jan 2025 21:09:38 +0100
Subject: [PATCH] refactor(offline): make both export types as optional

---
 src/components/ButtonUnderline/index.tsx |  2 +-
 src/components/FileList/index.tsx        | 72 +++++++++++++-----------
 2 files changed, 40 insertions(+), 34 deletions(-)

diff --git a/src/components/ButtonUnderline/index.tsx b/src/components/ButtonUnderline/index.tsx
index 510b2a9..8301d90 100644
--- a/src/components/ButtonUnderline/index.tsx
+++ b/src/components/ButtonUnderline/index.tsx
@@ -2,7 +2,7 @@ import { PropsWithChildren } from 'react'
 import styles from './style.module.scss'
 
 interface ButtonUnderlineProps {
-  onClick: () => void
+  onClick: (event: React.MouseEvent<HTMLButtonElement>) => void
   disabled?: boolean | undefined
 }
 
diff --git a/src/components/FileList/index.tsx b/src/components/FileList/index.tsx
index a073ca4..45e2631 100644
--- a/src/components/FileList/index.tsx
+++ b/src/components/FileList/index.tsx
@@ -1,16 +1,16 @@
-import { CurrentUserFile } from '../../types/file.ts'
-import styles from './style.module.scss'
+import React from 'react'
 import { Button, Menu, MenuItem } from '@mui/material'
+import PopupState, { bindTrigger, bindMenu } from 'material-ui-popup-state'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import { faCheck } from '@fortawesome/free-solid-svg-icons'
-import PopupState, { bindTrigger, bindMenu } from 'material-ui-popup-state'
-import React from 'react'
+import { CurrentUserFile } from '../../types/file.ts'
+import styles from './style.module.scss'
 
 interface FileListProps {
   files: CurrentUserFile[]
   currentFile: CurrentUserFile
   setCurrentFile: (file: CurrentUserFile) => void
-  handleExport: () => void
+  handleExport?: () => void
   handleEncryptedExport?: () => void
 }
 
@@ -45,34 +45,40 @@ const FileList = ({
         ))}
       </ul>
 
-      <PopupState variant="popover" popupId="download-popup-menu">
-        {(popupState) => (
-          <React.Fragment>
-            <Button variant="contained" {...bindTrigger(popupState)}>
-              Export files
-            </Button>
-            <Menu {...bindMenu(popupState)}>
-              <MenuItem
-                onClick={() => {
-                  popupState.close
-                  handleExport()
-                }}
-              >
-                Export Files
-              </MenuItem>
-              <MenuItem
-                onClick={() => {
-                  popupState.close
-                  typeof handleEncryptedExport === 'function' &&
-                    handleEncryptedExport()
-                }}
-              >
-                Export Encrypted Files
-              </MenuItem>
-            </Menu>
-          </React.Fragment>
-        )}
-      </PopupState>
+      {(typeof handleExport === 'function' ||
+        typeof handleEncryptedExport === 'function') && (
+        <PopupState variant="popover" popupId="download-popup-menu">
+          {(popupState) => (
+            <React.Fragment>
+              <Button variant="contained" {...bindTrigger(popupState)}>
+                Export files
+              </Button>
+              <Menu {...bindMenu(popupState)}>
+                {typeof handleExport === 'function' && (
+                  <MenuItem
+                    onClick={() => {
+                      popupState.close
+                      handleExport()
+                    }}
+                  >
+                    Export Files
+                  </MenuItem>
+                )}
+                {typeof handleEncryptedExport === 'function' && (
+                  <MenuItem
+                    onClick={() => {
+                      popupState.close
+                      handleEncryptedExport()
+                    }}
+                  >
+                    Export Encrypted Files
+                  </MenuItem>
+                )}
+              </Menu>
+            </React.Fragment>
+          )}
+        </PopupState>
+      )}
     </div>
   )
 }