adjust native

app/javascript/elements/native_upload.js

@@ -5,20 +5,36 @@ export default class extends HTMLElement {
     this.files = []
 
     document.addEventListener('turbo:submit-end', this.onSubmitEnd)
+    document.addEventListener('native:upload-start', this.onUploadStart)
+    document.addEventListener('native:upload-chunk', this.onUploadChunk)
+    document.addEventListener('native:upload-submit', this.onUploadSubmit)
   }
 
   disconnectedCallback () {
     document.removeEventListener('turbo:submit-end', this.onSubmitEnd)
+    document.removeEventListener('native:upload-start', this.onUploadStart)
+    document.removeEventListener('native:upload-chunk', this.onUploadChunk)
+    document.removeEventListener('native:upload-submit', this.onUploadSubmit)
   }
 
   get form () {
     return this.querySelector('form')
   }
 
-  append (index, name, type, base64) {
+  onUploadStart = (event) => {
+    this.files = []
+
+    event.detail.result = true
+  }
+
+  onUploadChunk = ({ detail: { index, name, type, chunk } }) => {
     const file = this.files[index] ||= { name, type, chunks: [] }
 
-    file.chunks.push(Uint8Array.from(atob(base64), (char) => char.charCodeAt(0)))
+    file.chunks.push(Uint8Array.from(atob(chunk), (char) => char.charCodeAt(0)))
+  }
+
+  onUploadSubmit = (event) => {
+    event.detail.result = this.submit(event.detail.url)
   }
 
   async submit (url) {