chore: remove unused code
This commit is contained in:
parent
16a88ef1ad
commit
f4877b55dd
@ -1,141 +0,0 @@
|
|||||||
import { Box, Button, TextField, Typography } from '@mui/material'
|
|
||||||
import saveAs from 'file-saver'
|
|
||||||
import { MuiFileInput } from 'mui-file-input'
|
|
||||||
import { useEffect, useState } from 'react'
|
|
||||||
import { LoadingSpinner } from '../../components/LoadingSpinner'
|
|
||||||
import { decryptArrayBuffer } from '../../utils'
|
|
||||||
import styles from './style.module.scss'
|
|
||||||
import { toast } from 'react-toastify'
|
|
||||||
import { useSearchParams } from 'react-router-dom'
|
|
||||||
import axios from 'axios'
|
|
||||||
import { DecryptionError } from '../../types/errors/DecryptionError'
|
|
||||||
|
|
||||||
export const DecryptZip = () => {
|
|
||||||
const [searchParams] = useSearchParams()
|
|
||||||
|
|
||||||
const [selectedFile, setSelectedFile] = useState<File | null>(null)
|
|
||||||
const [encryptionKey, setEncryptionKey] = useState('')
|
|
||||||
|
|
||||||
const [isLoading, setIsLoading] = useState(false)
|
|
||||||
const [loadingSpinnerDesc, setLoadingSpinnerDesc] = useState('')
|
|
||||||
const [isDraggingOver, setIsDraggingOver] = useState(false)
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
const fileUrl = searchParams.get('file')
|
|
||||||
|
|
||||||
if (fileUrl) {
|
|
||||||
setIsLoading(true)
|
|
||||||
setLoadingSpinnerDesc('Fetching zip file')
|
|
||||||
axios
|
|
||||||
.get(fileUrl, {
|
|
||||||
responseType: 'arraybuffer'
|
|
||||||
})
|
|
||||||
.then((res) => {
|
|
||||||
const fileName = fileUrl.split('/').pop()
|
|
||||||
const file = new File([res.data], fileName!)
|
|
||||||
setSelectedFile(file)
|
|
||||||
})
|
|
||||||
.catch((err) => {
|
|
||||||
console.error(
|
|
||||||
`error occurred in getting zip file from ${fileUrl}`,
|
|
||||||
err
|
|
||||||
)
|
|
||||||
})
|
|
||||||
.finally(() => {
|
|
||||||
setIsLoading(false)
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
const key = searchParams.get('key')
|
|
||||||
if (key) setEncryptionKey(key)
|
|
||||||
}, [searchParams])
|
|
||||||
|
|
||||||
const handleDecrypt = async () => {
|
|
||||||
if (!selectedFile || !encryptionKey) return
|
|
||||||
|
|
||||||
setIsLoading(true)
|
|
||||||
setLoadingSpinnerDesc('Decrypting zip file')
|
|
||||||
|
|
||||||
const encryptedArrayBuffer = await selectedFile.arrayBuffer()
|
|
||||||
|
|
||||||
const arrayBuffer = await decryptArrayBuffer(
|
|
||||||
encryptedArrayBuffer,
|
|
||||||
encryptionKey
|
|
||||||
).catch((err: DecryptionError) => {
|
|
||||||
console.log('err in decryption:>> ', err)
|
|
||||||
|
|
||||||
toast.error(err.message)
|
|
||||||
setIsLoading(false)
|
|
||||||
return null
|
|
||||||
})
|
|
||||||
|
|
||||||
if (!arrayBuffer) return
|
|
||||||
|
|
||||||
const blob = new Blob([arrayBuffer])
|
|
||||||
saveAs(blob, 'decrypted.zip')
|
|
||||||
|
|
||||||
setIsLoading(false)
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleDrop = (event: React.DragEvent<HTMLDivElement>) => {
|
|
||||||
event.preventDefault()
|
|
||||||
setIsDraggingOver(false)
|
|
||||||
const file = event.dataTransfer.files[0]
|
|
||||||
if (file.type === 'application/zip') setSelectedFile(file)
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleDragOver = (event: React.DragEvent<HTMLDivElement>) => {
|
|
||||||
event.preventDefault()
|
|
||||||
setIsDraggingOver(true)
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
{isLoading && <LoadingSpinner desc={loadingSpinnerDesc} />}
|
|
||||||
<Box className={styles.container}>
|
|
||||||
<Typography component='label' variant='h6'>
|
|
||||||
Select encrypted zip file
|
|
||||||
</Typography>
|
|
||||||
|
|
||||||
<Box
|
|
||||||
className={styles.inputBlock}
|
|
||||||
onDrop={handleDrop}
|
|
||||||
onDragOver={handleDragOver}
|
|
||||||
>
|
|
||||||
{isDraggingOver && (
|
|
||||||
<Box className={styles.fileDragOver}>
|
|
||||||
<Typography variant='body1'>Drop file here</Typography>
|
|
||||||
</Box>
|
|
||||||
)}
|
|
||||||
<MuiFileInput
|
|
||||||
placeholder='Drop file here, or click to select'
|
|
||||||
value={selectedFile}
|
|
||||||
onChange={(value) => setSelectedFile(value)}
|
|
||||||
InputProps={{
|
|
||||||
inputProps: {
|
|
||||||
accept: '.zip'
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<TextField
|
|
||||||
label='Encryption Key'
|
|
||||||
variant='outlined'
|
|
||||||
value={encryptionKey}
|
|
||||||
onChange={(e) => setEncryptionKey(e.target.value)}
|
|
||||||
/>
|
|
||||||
</Box>
|
|
||||||
|
|
||||||
<Box sx={{ mt: 1, display: 'flex', justifyContent: 'center' }}>
|
|
||||||
<Button
|
|
||||||
onClick={handleDecrypt}
|
|
||||||
variant='contained'
|
|
||||||
disabled={!selectedFile || !encryptionKey}
|
|
||||||
>
|
|
||||||
Decrypt
|
|
||||||
</Button>
|
|
||||||
</Box>
|
|
||||||
</Box>
|
|
||||||
</>
|
|
||||||
)
|
|
||||||
}
|
|
@ -1,27 +0,0 @@
|
|||||||
@import '../../colors.scss';
|
|
||||||
|
|
||||||
.container {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
color: $text-color;
|
|
||||||
|
|
||||||
.inputBlock {
|
|
||||||
position: relative;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
gap: 25px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.fileDragOver {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
background-color: rgba(255, 255, 255, 0.8);
|
|
||||||
z-index: 1;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
}
|
|
Loading…
Reference in New Issue
Block a user