CP-13553: Refactor Docuseal PDF page loading and previews

app/javascript/template_builder/builder.vue

@@ -203,7 +203,6 @@
                 :draw-field="drawField"
                 :draw-field-type="drawFieldType"
                 :editable="editable"
-                :base-url="baseUrl"
                 @draw="[onDraw($event), withSelectedFieldType ? '' : drawFieldType = '', showDrawField = false]"
                 @drop-field="onDropfield"
                 @remove-area="removeArea"

app/javascript/template_builder/document.vue

@@ -95,11 +95,6 @@ export default {
       required: false,
       default: null
     },
-    baseUrl: {
-      type: String,
-      required: false,
-      default: ''
-    },
     isDrag: {
       type: Boolean,
       required: false,
@@ -113,26 +108,13 @@ export default {
     }
   },
   computed: {
-    basePreviewUrl () {
-      if (this.baseUrl) {
-        return new URL(this.baseUrl).origin
-      } else {
-        return ''
-      }
-    },
     numberOfPages () {
       return this.document.metadata?.pdf?.number_of_pages || this.document.preview_images.length
     },
     sortedPreviewImages () {
-      const lazyloadMetadata = this.document.preview_images[this.document.preview_images.length - 1].metadata
-
-      return [...Array(this.numberOfPages).keys()].map((i) => {
-        return this.previewImagesIndex[i] || {
-          metadata: lazyloadMetadata,
-          id: Math.random().toString(),
-          url: this.basePreviewUrl + `/preview/${this.document.signed_uuid || this.document.uuid}/${i}.jpg`
-        }
-      })
+      return [...Array(this.numberOfPages).keys()]
+        .map((i) => this.previewImagesIndex[i] ? { ...this.previewImagesIndex[i], _pageIndex: i } : null)
+        .filter(Boolean)
     },
     previewImagesIndex () {
       return this.document.preview_images.reduce((acc, e) => {

app/javascript/template_builder/dropzone.vue

@@ -35,11 +35,17 @@
             {{ message }}
           </div>
           <div
-            v-if="withDescription"
+            v-if="withDescription && !isLoading"
             class="text-sm"
           >
             <span class="font-medium">{{ t('click_to_upload') }}</span> {{ t('or_drag_and_drop_files') }}
           </div>
+          <div
+            v-if="withDescription && !isLoading"
+            class="text-xs text-base-content/60 mt-2"
+          >
+            {{ t('larger_pdfs_may_take_a_while_to_process') }}
+          </div>
         </div>
       </div>
       <form

app/javascript/template_builder/i18n.js

@@ -60,7 +60,8 @@ const en = {
   draw_field_on_the_document: 'Draw a field on the document',
   click_to_upload: 'Click to upload',
   or_drag_and_drop_files: 'or drag and drop files',
-  uploading: 'Uploading',
+  larger_pdfs_may_take_a_while_to_process: 'Please note, larger PDFs may take a while to process',
+  uploading: 'Processing... this may take a few moments',
   processing_: 'Processing...',
   add_pdf_documents_or_images: 'Add PDF documents or images',
   add_documents_or_images: 'Add documents or images',

app/javascript/template_builder/page.vue

@@ -6,7 +6,6 @@
   >
     <img
       ref="image"
-      loading="lazy"
       :src="image.url"
       :width="width"
       :height="height"

app/javascript/template_builder/preview.vue

@@ -6,7 +6,6 @@
         :width="previewImage.metadata.width"
         :height="previewImage.metadata.height"
         class="rounded border"
-        loading="lazy"
       >
       <div
         class="group flex justify-end cursor-pointer top-0 bottom-0 left-0 right-0 absolute p-1 hover:bg-black/10 transition-colors"

app/views/submissions/show.html.erb

@@ -38,16 +38,15 @@
         <% fields_index = Templates.build_field_areas_index(@submission.template_fields || @submission.template.fields) %>
         <% submitters_index = @submission.submitters.index_by(&:uuid) %>
         <% attachments_index = ActiveStorage::Attachment.where(record: @submission.submitters, name: :attachments).preload(:blob).index_by(&:uuid) %>
-        <% page_blob_struct = Struct.new(:url, :metadata, keyword_init: true) %>
         <% schema.each do |item| %>
           <% document = @submission.schema_documents.find { |e| e.uuid == item['attachment_uuid'] } %>
           <% document_annots_index = document.metadata.dig('pdf', 'annotations')&.group_by { |e| e['page'] } || {} %>
           <% preview_images_index = document.preview_images.loaded? ? document.preview_images.index_by { |e| e.filename.base.to_i } : {} %>
-          <% lazyload_metadata = document.preview_images.first.metadata %>
           <% (document.metadata.dig('pdf', 'number_of_pages') || (document.preview_images.loaded? ? preview_images_index.size : document.preview_images.size)).times do |index| %>
-            <% page = preview_images_index[index] || page_blob_struct.new(metadata: lazyload_metadata, url: preview_document_page_path(document.signed_uuid, "#{index}.jpg")) %>
+            <% page = preview_images_index[index] %>
+            <% next unless page %>
             <div id="<%= "page-#{document.uuid}-#{index}" %>" class="relative">
-              <img loading="lazy" src="<%= Docuseal::URL_CACHE.fetch([document.id, document.uuid, index].join(':'), expires_in: 10.minutes) { page.url } %>" width="<%= page.metadata['width'] %>" class="border rounded mb-4" height="<%= page.metadata['height'] %>">
+              <img src="<%= Docuseal::URL_CACHE.fetch([document.id, document.uuid, index].join(':'), expires_in: 10.minutes) { page.url } %>" width="<%= page.metadata['width'] %>" class="border rounded mb-4" height="<%= page.metadata['height'] %>">
               <div class="top-0 bottom-0 left-0 right-0 absolute">
                 <% document_annots_index[index]&.each do |annot| %>
                   <%= render 'submissions/annotation', annot: %>

app/views/submit_form/show.html.erb

@@ -6,7 +6,6 @@
 <% values = merge_prefill_values(submitter_values, @prefill_values || {}, template_fields) %>
 
 <% submitters_index = @submitter.submission.submitters.index_by(&:uuid) %>
-<% page_blob_struct = Struct.new(:url, :metadata, keyword_init: true) %>
 <% schema = Submissions.filtered_conditions_schema(@submitter.submission, values:, include_submitter_uuid: @submitter.uuid) %>
 <div style="max-height: -webkit-fill-available;">
   <div id="scrollbox">
@@ -20,11 +19,11 @@
         <div id="document-<%= document.uuid %>">
           <% document_annots_index = document.metadata.dig('pdf', 'annotations')&.group_by { |e| e['page'] } || {} %>
           <% preview_images_index = document.preview_images.loaded? ? document.preview_images.index_by { |e| e.filename.base.to_i } : {} %>
-          <% lazyload_metadata = document.preview_images.last&.metadata || {} %>
           <% (document.metadata.dig('pdf', 'number_of_pages') || (document.preview_images.loaded? ? preview_images_index.size : document.preview_images.size)).times do |index| %>
-            <% page = preview_images_index[index] || page_blob_struct.new(metadata: lazyload_metadata, url: preview_document_page_path(document.signed_uuid, "#{index}.jpg")) %>
+            <% page = preview_images_index[index] %>
+            <% next unless page %>
             <div class="relative my-4 shadow-md">
-              <img loading="lazy" src="<%= page.url %>" width="<%= page.metadata['width'] %>" height="<%= page.metadata['height'] %>">
+              <img src="<%= page.url %>" width="<%= page.metadata['width'] %>" height="<%= page.metadata['height'] %>">
               <div id="page-<%= [document.uuid, index].join('-') %>" class="top-0 bottom-0 left-0 right-0 absolute">
                 <% if annots = document_annots_index[index] %>
                   <%= render 'submit_form/annotations', annots: %>

config/routes.rb

@@ -140,7 +140,6 @@
     resources :recipients, only: %i[create], controller: 'templates_recipients'
     resources :submissions_export, only: %i[index new]
   end
-  resources :preview_document_page, only: %i[show], path: '/preview/:signed_uuid'
   resource :blobs_proxy, only: %i[show], path: '/file/:signed_uuid/*filename',
                          controller: 'api/active_storage_blobs_proxy'
   resource :blobs_proxy, only: %i[show], path: '/blobs_proxy/:signed_uuid/*filename',

lib/submissions.rb

@@ -3,8 +3,6 @@
 module Submissions
   DEFAULT_SUBMITTERS_ORDER = 'single_sided'
 
-  PRELOAD_ALL_PAGES_AMOUNT = 200
-
   module_function
 
   def search(current_user, submissions, keyword, search_values: false, search_template: false)
@@ -79,19 +77,14 @@ def preload_with_pages(submission)
     ActiveRecord::Associations::Preloader.new(
       records: [submission],
       associations: [
-        submission.template_id? ? { template_schema_documents: :blob } : { documents_attachments: :blob }
+        submission.template_id? ? :template_schema_documents : :documents_attachments
       ]
     ).call
 
-    total_pages =
-      submission.schema_documents.sum { |e| e.metadata.dig('pdf', 'number_of_pages').to_i }
-
-    if total_pages < PRELOAD_ALL_PAGES_AMOUNT
-      ActiveRecord::Associations::Preloader.new(
-        records: submission.schema_documents,
-        associations: [:blob, { preview_images_attachments: :blob }]
-      ).call
-    end
+    ActiveRecord::Associations::Preloader.new(
+      records: submission.schema_documents,
+      associations: [{ preview_images_attachments: :blob }]
+    ).call
 
     submission
   end

lib/submitters.rb

@@ -2,7 +2,6 @@
 
 module Submitters
   TRUE_VALUES = ['1', 'true', true].freeze
-  PRELOAD_ALL_PAGES_AMOUNT = 200
 
   FIELD_NAME_WEIGHTS = {
     'email' => 'A',

lib/templates/process_document.rb

@@ -12,21 +12,19 @@ module ProcessDocument
     Q = 95
     JPEG_Q = ENV.fetch('PAGE_QUALITY', '35').to_i
     MAX_WIDTH = 1400
-    MAX_NUMBER_OF_PAGES_PROCESSED = 15
     MAX_FLATTEN_FILE_SIZE = 20.megabytes
-    GENERATE_PREVIEW_SIZE_LIMIT = 50.megabytes
 
     module_function
 
-    def call(attachment, data, extract_fields: false, max_pages: MAX_NUMBER_OF_PAGES_PROCESSED)
+    def call(attachment, data, extract_fields: false)
       if attachment.content_type == PDF_CONTENT_TYPE
         if extract_fields && data.size < MAX_FLATTEN_FILE_SIZE
           pdf = HexaPDF::Document.new(io: StringIO.new(data))
 
           fields = Templates::FindAcroFields.call(pdf, attachment, data)
         end
 
-        generate_pdf_preview_images(attachment, data, pdf, max_pages:)
+        generate_pdf_preview_images(attachment, data, pdf)
 
         attachment.metadata['pdf']['fields'] = fields if fields
       elsif attachment.image?
@@ -81,7 +79,7 @@ def generate_preview_image(attachment, data)
       )
     end
 
-    def generate_pdf_preview_images(attachment, data, pdf = nil, max_pages: MAX_NUMBER_OF_PAGES_PROCESSED)
+    def generate_pdf_preview_images(attachment, data, pdf = nil)
       ActiveStorage::Attachment.where(name: ATTACHMENT_NAME, record: attachment).destroy_all
 
       pdf ||= HexaPDF::Document.new(io: StringIO.new(data))
@@ -96,9 +94,7 @@ def generate_pdf_preview_images(attachment, data, pdf = nil, max_pages: MAX_NUMB
         attachment.save!
       end
 
-      max_pages_to_process = data.size < GENERATE_PREVIEW_SIZE_LIMIT ? max_pages : 1
-
-      generate_document_preview_images(attachment, data, (0..[number_of_pages - 1, max_pages_to_process].min))
+      generate_document_preview_images(attachment, data, (0..number_of_pages - 1))
     end
 
     def generate_document_preview_images(attachment, data, range, concurrency: CONCURRENCY)
@@ -201,20 +197,5 @@ def normalize_attachment_fields(template, attachments = template.documents)
       end
     end
 
-    def generate_pdf_preview_from_file(attachment, file_path, page_number)
-      doc = Pdfium::Document.open_file(file_path)
-
-      blob = build_and_upload_blob(doc, page_number, '.jpg')
-
-      ApplicationRecord.no_touching do
-        ActiveStorage::Attachment.create!(
-          blob: blob,
-          name: ATTACHMENT_NAME,
-          record: attachment
-        )
-      end
-    ensure
-      doc&.close
-    end
   end
 end