fallback image uploader renamed to imagekit uploader

iggy-social · Sep 15, 2024 · 995f906 · 995f906
1 parent 5271fb9
commit 995f906
Show file tree

Hide file tree

Showing 4 changed files with 49 additions and 42 deletions.
diff --git a/api/imageUploaderFallback.js → api/imageKitUploader.js b/api/imageUploaderFallback.js → api/imageKitUploader.js
diff --git a/components/storage/FileUploadInput.vue b/components/storage/FileUploadInput.vue
@@ -50,14 +50,51 @@ export default {
   },
 
   methods: {
+    async arweaveUpload() {
+      const thisAppUrl = window.location.origin
+
+      let fetcherService
+      if (this.$config.fileUploadTokenService === 'netlify') {
+        fetcherService = thisAppUrl + '/.netlify/functions/arweaveUploader'
+      } else if (this.$config.fileUploadTokenService === 'vercel') {
+        fetcherService = thisAppUrl + '/api/arweaveUploader'
+      }
+
+      // Convert file to base64
+      const fileData = await this.fileToBase64(this.file)
+
+      const fileType = this.file.type
+
+      const resp = await axios.post(fetcherService, {
+        fileData,
+        fileName: this.file.name,
+        fileType: this.file.type
+      })
+
+      const transactionId = resp.data.transactionId
+      let fileUri = `ar://${transactionId}`
+
+      // add file type to file uri so we can use it in the frontend
+      if (fileType.startsWith('image/')) {
+        fileUri += `?img`
+      } else if (fileType.startsWith('video/') || fileType.startsWith('audio/')) {
+        fileUri += `?${fileType}`
+      } else if (fileType.startsWith('text/plain')) {
+        fileUri += `?txt`
+      }
+
+      // emit file url
+      this.$emit('processUploadedFileUrl', fileUri)
+    },
+
     async imageKitUpload() {
       const thisAppUrl = window.location.origin
 
       let fetcherService
       if (this.$config.fileUploadTokenService === 'netlify') {
-        fetcherService = thisAppUrl + '/.netlify/functions/imageUploaderFallback'
+        fetcherService = thisAppUrl + '/.netlify/functions/imageKitUploader'
       } else if (this.$config.fileUploadTokenService === 'vercel') {
-        fetcherService = thisAppUrl + '/api/imageUploaderFallback'
+        fetcherService = thisAppUrl + '/api/imageKitUploader'
       }
 
       const resp = await $fetch(fetcherService).catch(error => error.data)
@@ -118,51 +155,21 @@ export default {
 
       if (this.storageType === 'arweave') {
         try {
-          const thisAppUrl = window.location.origin
-
-          let fetcherService
-          if (this.$config.fileUploadTokenService === 'netlify') {
-            fetcherService = thisAppUrl + '/.netlify/functions/arweaveUploader'
-          } else if (this.$config.fileUploadTokenService === 'vercel') {
-            fetcherService = thisAppUrl + '/api/arweaveUploader'
-          }
-
-          console.log(fetcherService)
-
-          // Convert file to base64
-          const fileData = await this.fileToBase64(this.file)
-
-          const fileType = this.file.type
-
-          const resp = await axios.post(fetcherService, {
-            fileData,
-            fileName: this.file.name,
-            fileType: this.file.type
-          })
-          console.log(resp)
-          
-          const transactionId = resp.data.transactionId
-          let fileUri = `ar://${transactionId}`
-
-          // add file type to file uri so we can use it in the frontend
-          if (fileType.startsWith('image/')) {
-            fileUri += `?img`
-          } else if (fileType.startsWith('video/') || fileType.startsWith('audio/')) {
-            fileUri += `?${fileType}`
-          } else if (fileType.startsWith('text/plain')) {
-            fileUri += `?txt`
-          }
-
-          // emit file url
-          this.$emit('processUploadedFileUrl', fileUri)
+          await this.arweaveUpload()
         } catch (error) {
           console.error('Error uploading file to decentralized storage service', error)
           console.log('Falling back to centralized storage service')
           await this.imageKitUpload()
         }
       } else {
-        // use centralized storage service
-        await this.imageKitUpload()
+        // use centralized storage service ImageKit
+        try {
+          await this.imageKitUpload()
+        } catch (error) {
+          console.error('Error uploading file to centralized storage service', error)
+          console.log('Falling back to decentralized storage service')
+          await this.arweaveUpload()
+        }
       }
 
       this.waitingUpload = false

diff --git a/netlify/functions/imageUploaderFallback.js → netlify/functions/imageKitUploader.js b/netlify/functions/imageUploaderFallback.js → netlify/functions/imageKitUploader.js
diff --git a/nuxt.config.ts b/nuxt.config.ts
@@ -65,7 +65,7 @@ export default defineNuxtConfig({
       favicon: "/img/favicon.svg",
       fileUploadEnabled: true, // enable/disable file uploads (enable only if external file storage is used, e.g. Arweave)
       fileUploadSizeLimit: 1 * 1024 * 1024, // max file upload size in bytes (1 * 1024 * 1024 = 1 MB)
-      fileUploadStorageType: "arweave", // "arweave" or "imagekit" (or leave empty for no file uploads)
+      fileUploadStorageType: "arweave", // "arweave" or "imagekit"
       fileUploadTokenService: process.env.FILE_UPLOAD_SERVICE || "netlify", // "netlify" or "vercel" (or leave empty for no file uploads)
       getPostsLimit: 30, // number of posts to fetch from Orbis in the getPosts() function
       iggyPostAddress: "0x5e54CebB2612744cB56547bC7CC41466ad7ac557",