refactor: split online and offline create

src/pages/create/index.tsx

@@ -44,7 +44,6 @@ import {
   generateKeysFile,
   getHash,
   hexToNpub,
-  isOnline,
   unixNow,
   npubToHex,
   queryNip05,
@@ -65,6 +64,7 @@ import { Mark } from '../../types/mark.ts'
 import { StickySideColumns } from '../../layouts/StickySideColumns.tsx'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import {
+  faDownload,
   faEllipsis,
   faEye,
   faFile,
@@ -84,6 +84,7 @@ import _, { truncate } from 'lodash'
 import * as React from 'react'
 import { AvatarIconButton } from '../../components/UserAvatarIconButton'
 import { useImmer } from 'use-immer'
+import { ButtonUnderline } from '../../components/ButtonUnderline/index.tsx'
 
 type FoundUser = Event & { npub: string }
 
@@ -774,30 +775,6 @@ export const CreatePage = () => {
       .catch(handleUploadError)
   }
 
-  // Manage offline scenarios for signing or viewing the file
-  const handleOfflineFlow = async (
-    encryptedArrayBuffer: ArrayBuffer,
-    encryptionKey: string
-  ) => {
-    const finalZipFile = await createFinalZipFile(
-      encryptedArrayBuffer,
-      encryptionKey
-    )
-
-    if (!finalZipFile) {
-      setIsLoading(false)
-      return
-    }
-
-    saveAs(finalZipFile, `request-${unixNow()}.sigit.zip`)
-
-    // If user is the next signer, we can navigate directly to sign page
-    if (signers[0].pubkey === usersPubkey) {
-      navigate(appPrivateRoutes.sign, { state: { uploadedZip: finalZipFile } })
-    }
-    setIsLoading(false)
-  }
-
   const generateFilesZip = async (): Promise<ArrayBuffer | null> => {
     const zip = new JSZip()
     selectedFiles.forEach((file) => {
@@ -863,7 +840,7 @@ export const CreatePage = () => {
     return e.id
   }
 
-  const handleCreate = async () => {
+  const initCreation = async () => {
     try {
       if (!validateInputs()) return
 
@@ -875,7 +852,30 @@ export const CreatePage = () => {
       setLoadingSpinnerDesc('Generating encryption key')
       const encryptionKey = await generateEncryptionKey()
 
-      if (await isOnline()) {
+      setLoadingSpinnerDesc('Creating marks')
+      const markConfig = createMarks(fileHashes)
+
+      return {
+        encryptionKey,
+        markConfig,
+        fileHashes
+      }
+    } catch (error) {
+      if (error instanceof Error) {
+        toast.error(error.message)
+      }
+      console.error(error)
+      setIsLoading(false)
+    }
+  }
+
+  const handleCreate = async () => {
+    try {
+      const result = await initCreation()
+      if (!result) return
+
+      const { encryptionKey, markConfig, fileHashes } = result
+
       setLoadingSpinnerDesc('generating files.zip')
       const arrayBuffer = await generateFilesZip()
       if (!arrayBuffer) return
@@ -886,8 +886,6 @@ export const CreatePage = () => {
         encryptionKey
       )
 
-        const markConfig = createMarks(fileHashes)
-
       setLoadingSpinnerDesc('Uploading files.zip to file storage')
       const fileUrl = await uploadFile(encryptedArrayBuffer)
       if (!fileUrl) return
@@ -914,9 +912,7 @@ export const CreatePage = () => {
 
       setLoadingSpinnerDesc('Generating an open timestamp.')
 
-        const timestamp = await generateTimestamp(
-          extractNostrId(createSignature)
-        )
+      const timestamp = await generateTimestamp(extractNostrId(createSignature))
 
       const meta: Meta = {
         createSignature,
@@ -958,15 +954,29 @@ export const CreatePage = () => {
         const createSignatureJson = JSON.parse(createSignature)
         navigate(`${appPublicRoutes.verify}/${createSignatureJson.id}`)
       }
-      } else {
+    } catch (error) {
+      if (error instanceof Error) {
+        toast.error(error.message)
+      }
+      console.error(error)
+    } finally {
+      setIsLoading(false)
+    }
+  }
+
+  const handleCreateOffline = async () => {
+    try {
+      const result = await initCreation()
+      if (!result) return
+
+      const { encryptionKey, markConfig, fileHashes } = result
+
       const zip = new JSZip()
 
       selectedFiles.forEach((file) => {
         zip.file(`files/${file.name}`, file)
       })
 
-        const markConfig = createMarks(fileHashes)
-
       setLoadingSpinnerDesc('Generating create signature')
       const createSignature = await generateCreateSignature(
         markConfig,
@@ -1000,7 +1010,25 @@ export const CreatePage = () => {
         encryptionKey
       )
 
-        await handleOfflineFlow(encryptedArrayBuffer, encryptionKey)
+      const finalZipFile = await createFinalZipFile(
+        encryptedArrayBuffer,
+        encryptionKey
+      )
+
+      if (!finalZipFile) {
+        setIsLoading(false)
+        return
+      }
+
+      saveAs(finalZipFile, `request-${unixNow()}.sigit.zip`)
+
+      // If user is the next signer, we can navigate directly to sign page
+      if (signers[0].pubkey === usersPubkey) {
+        navigate(appPrivateRoutes.sign, {
+          state: { uploadedZip: finalZipFile }
+        })
+      } else {
+        navigate(appPrivateRoutes.homePage)
       }
     } catch (error) {
       if (error instanceof Error) {
@@ -1258,6 +1286,11 @@ export const CreatePage = () => {
                 Publish
               </Button>
 
+              <ButtonUnderline onClick={handleCreateOffline}>
+                <FontAwesomeIcon icon={faDownload} />
+                Create and export locally
+              </ButtonUnderline>
+
               {!!error && (
                 <FormHelperText error={!!error}>{error}</FormHelperText>
               )}