Enable file downloading

components/files/files-dialog.js

@@ -0,0 +1,52 @@
+import {useState} from 'react'
+import PropTypes from 'prop-types'
+import Button from '@mui/material/Button'
+import Dialog from '@mui/material/Dialog'
+import DialogActions from '@mui/material/DialogActions'
+import DialogContent from '@mui/material/DialogContent'
+import useMediaQuery from '@mui/material/useMediaQuery'
+import {useTheme} from '@mui/material/styles'
+
+import DownloadForOfflineIcon from '@mui/icons-material/DownloadForOffline'
+import FilesList from './files-list'
+
+export default function FilesDialog({files}) {
+  const [open, setOpen] = useState(false)
+  const theme = useTheme()
+  const fullScreen = useMediaQuery(theme.breakpoints.down('md'))
+
+  const handleClickOpen = () => {
+    setOpen(true)
+  }
+
+  const handleClose = () => {
+    setOpen(false)
+  }
+
+  return (
+    <>
+      <Button endIcon={<DownloadForOfflineIcon />} sx={{marginBottom: 2}} variant='outlined' onClick={handleClickOpen}>
+        Télécharger
+      </Button>
+      <Dialog
+        fullScreen={fullScreen}
+        open={open}
+        aria-labelledby='FilesDialog'
+        onClose={handleClose}
+      >
+        <DialogContent dividers>
+          <FilesList files={files} />
+        </DialogContent>
+        <DialogActions>
+          <Button autoFocus onClick={handleClose}>
+            Fermer
+          </Button>
+        </DialogActions>
+      </Dialog>
+    </>
+  )
+}
+
+FilesDialog.propTypes = {
+  files: PropTypes.array.isRequired
+}