Merge pull request #1028 from autonomys/feat/add-notice-for-encrypted…

…-file Detect if file is encrypted
autonomys · Dec 18, 2024 · 6d997c9 · 6d997c9
2 parents 16af4b8 + 55e48ed
commit 6d997c9
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 14 deletions.
diff --git a/explorer/src/components/Storage/Files/FilePreview.tsx b/explorer/src/components/Storage/Files/FilePreview.tsx
@@ -1,3 +1,4 @@
+import { LockClosedIcon } from '@heroicons/react/24/outline'
 import { Arguments } from 'components/common/Arguments'
 import { Spinner } from 'components/common/Spinner'
 import { GetCidQuery, GetCidQueryVariables } from 'gql/graphql'
@@ -16,6 +17,9 @@ type Props = {
 type PreviewData = {
   type: string
   data: ArrayBuffer
+  isEncrypted: boolean
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  uploadOptions: any
 }
 
 export const FilePreview: FC<Props> = ({ cid }) => {
@@ -31,11 +35,13 @@ export const FilePreview: FC<Props> = ({ cid }) => {
 
   const fetchData = useCallback(async () => {
     if (data) {
-      const { dataArrayBuffer } = extractFileData(data)
+      const { dataArrayBuffer, isEncrypted, uploadOptions } = extractFileData(data)
       const fileType = await detectFileType(dataArrayBuffer)
       setRawData({
         type: fileType,
         data: dataArrayBuffer,
+        isEncrypted,
+        uploadOptions,
       })
     }
   }, [data])
@@ -60,6 +66,15 @@ export const FilePreview: FC<Props> = ({ cid }) => {
     if (!imageSrc) return <></>
 
     switch (true) {
+      case rawData?.isEncrypted:
+        return (
+          <div className='flex items-center'>
+            <LockClosedIcon className={'ml-2 size-6 shrink-0'} stroke='#DE67E4' />
+            <p className='text-sm font-medium text-grayDarker dark:text-white md:text-xl'>
+              No preview available for encrypted files
+            </p>
+          </div>
+        )
       case rawData?.type.startsWith('image'):
         return (
           <Image

diff --git a/explorer/src/utils/file.ts b/explorer/src/utils/file.ts
@@ -74,6 +74,19 @@ const extractFileDataByType = (data: any, type: 'file' | 'folder' | 'metadata')
   let rawData: string = ''
   let dataArrayBuffer: ArrayBuffer = new ArrayBuffer(0)
   let depth = 0
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  let uploadOptions: any
+
+  try {
+    if (data['files_' + type + 's'][0].chunk?.uploadOptions) {
+      uploadOptions = JSON.parse(data['files_' + type + 's'][0].chunk?.uploadOptions)
+      if (uploadOptions.encryption.algorithm)
+        return { rawData, dataArrayBuffer, isEncrypted: true, uploadOptions }
+    }
+  } catch (error) {
+    console.error('Error checking uploadOptions:', error)
+  }
+
   if (data['files_' + type + 's'][0][type + '_cids'].length === 0) {
     rawData = data['files_' + type + 's'][0].chunk?.data ?? ''
     dataArrayBuffer = Object.values(JSON.parse(rawData)) as unknown as ArrayBuffer
@@ -92,23 +105,20 @@ const extractFileDataByType = (data: any, type: 'file' | 'folder' | 'metadata')
     }
   }
   try {
-    if (data['files_' + type + 's'][0].chunk?.uploadOptions) {
-      const options = JSON.parse(data['files_' + type + 's'][0].chunk?.uploadOptions)
-      if (options.compression.algorithm === 'ZLIB') {
-        const inflate = new Zlib.Inflate(new Uint8Array(dataArrayBuffer), {
-          index: 0,
-          bufferSize: 1024,
-          bufferType: Zlib.Inflate.BufferType.BLOCK,
-          resize: true,
-          verify: true,
-        })
-        dataArrayBuffer = inflate.decompress()
-      }
+    if (uploadOptions.compression.algorithm === 'ZLIB') {
+      const inflate = new Zlib.Inflate(new Uint8Array(dataArrayBuffer), {
+        index: 0,
+        bufferSize: 1024,
+        bufferType: Zlib.Inflate.BufferType.BLOCK,
+        resize: true,
+        verify: true,
+      })
+      dataArrayBuffer = inflate.decompress()
     }
   } catch (error) {
     console.error('Error decompressing data:', error)
   }
-  return { rawData, dataArrayBuffer }
+  return { rawData, dataArrayBuffer, isEncrypted: false, uploadOptions }
 }
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any