refactor prefill

app/javascript/submission_form/initials_step.vue

@@ -87,7 +87,7 @@
           </button>
         </span>
         <button
-          v-if="modelValue || computedPreviousValue"
+          v-if="modelValue || computedPreviousValue || computedPrefillData"
           type="button"
           class="btn font-medium btn-outline btn-sm clear-canvas-button"
           @click="remove"
@@ -139,8 +139,8 @@
       :name="`values[${field.uuid}]`"
     >
     <img
-      v-if="modelValue || computedPreviousValue"
-      :src="attachmentsIndex[modelValue || computedPreviousValue].url"
+      v-if="modelValue || computedPreviousValue || computedPrefillData"
+      :src="previousValueUrl"
       :alt="field.name || t('initials')"
       class="mx-auto bg-white border border-base-300 rounded max-h-44"
     >
@@ -150,12 +150,12 @@
         class="absolute top-0 right-0 left-0 bottom-0"
       />
       <label
-        v-if="!isDrawInitials && !modelValue && !computedPreviousValue"
+        v-if="!isDrawInitials && !modelValue && !computedPreviousValue && !computedPrefillData"
         for="initials_text_input"
         class="absolute top-0 right-0 left-0 bottom-0"
       />
       <canvas
-        v-show="!modelValue && !computedPreviousValue"
+        v-show="!modelValue && !computedPreviousValue && !computedPrefillData"
         ref="canvas"
         role="img"
         :aria-label="t('initials_drawing_area')"
@@ -166,7 +166,7 @@
       />
     </div>
     <input
-      v-if="!isDrawInitials && !modelValue && !computedPreviousValue"
+      v-if="!isDrawInitials && !modelValue && !computedPreviousValue && !computedPrefillData"
       id="initials_text_input"
       ref="textInput"
       class="base-input !text-2xl w-full mt-6 text-center"
@@ -236,6 +236,11 @@ export default {
       required: false,
       default: ''
     },
+    prefillData: {
+      type: Object,
+      required: false,
+      default: null
+    },
     nativePlatform: {
       type: String,
       required: false,
@@ -263,10 +268,24 @@ export default {
       } else {
         return null
       }
+    },
+    computedPrefillData () {
+      if (this.isUsePreviousValue && this.field.required === true && !this.previousValue && !this.modelValue) {
+        return this.prefillData
+      } else {
+        return null
+      }
+    },
+    previousValueUrl () {
+      if (this.computedPrefillData) {
+        return this.computedPrefillData.url
+      } else {
+        return this.attachmentsIndex[this.modelValue || this.computedPreviousValue].url
+      }
     }
   },
   created () {
-    this.isInitialsStarted = !!this.computedPreviousValue
+    this.isInitialsStarted = !!(this.computedPreviousValue || this.computedPrefillData)
   },
   async mounted () {
     this.$nextTick(() => {
@@ -407,7 +426,48 @@ export default {
         this.updateWrittenInitials({ target: this.$refs.textInput })
       }
     },
+    submitPrefillAttachment () {
+      if (this.dryRun) {
+        const attachment = { uuid: Math.random().toString(), url: this.prefillData.url }
+
+        this.$emit('attached', attachment)
+        this.$emit('update:model-value', attachment.uuid)
+
+        return Promise.resolve(attachment)
+      }
+
+      const formData = new FormData()
+
+      formData.append('prefill_token', this.prefillData.token)
+
+      return fetch(this.baseUrl + `/s/${this.submitterSlug}/prefill_attachments`, {
+        method: 'POST',
+        headers: { ...this.fetchOptions.headers },
+        body: formData
+      }).then(async (resp) => {
+        if (!resp.ok) {
+          const data = await resp.json()
+
+          return Promise.reject(new Error(data.error))
+        }
+
+        const attachment = await resp.json()
+
+        this.$emit('attached', attachment)
+        this.$emit('update:model-value', attachment.uuid)
+
+        return attachment
+      }).catch((error) => {
+        this.remove()
+
+        return Promise.reject(error)
+      })
+    },
     async submit () {
+      if (this.computedPrefillData) {
+        return this.submitPrefillAttachment()
+      }
+
       if (this.modelValue || this.computedPreviousValue) {
         if (this.computedPreviousValue) {
           this.$emit('update:model-value', this.computedPreviousValue)