add webhook secret

.rubocop.yml

@@ -11,6 +11,7 @@ AllCops:
     - bin/*
     - vendor/**/*
   TargetRubyVersion: '3.3'
+  SuggestExtensions: false
 
 Metrics/BlockLength:
   Exclude:
@@ -78,6 +79,3 @@ Rails/ApplicationController:
 
 Rails/Output:
   Enabled: false
-
-Capybara/ClickLinkOrButtonStyle:
-  Enabled: false

Gemfile.lock

@@ -341,8 +341,8 @@ GEM
     os (1.1.4)
     package_json (0.1.0)
     pagy (8.1.2)
-    parallel (1.24.0)
-    parser (3.3.1.0)
+    parallel (1.25.1)
+    parser (3.3.4.0)
       ast (~> 2.4.1)
       racc
     pg (1.5.6)
@@ -419,7 +419,7 @@ GEM
       psych (>= 4.0.0)
     redis-client (0.22.0)
       connection_pool
-    regexp_parser (2.9.0)
+    regexp_parser (2.9.2)
     reline (0.5.7)
       io-console (~> 0.5)
     representable (3.2.0)
@@ -432,7 +432,8 @@ GEM
       actionpack (>= 5.2)
       railties (>= 5.2)
     retriable (3.1.2)
-    rexml (3.2.6)
+    rexml (3.3.2)
+      strscan
     rotp (6.3.0)
     rqrcode (2.2.0)
       chunky_png (~> 1.0)
@@ -455,23 +456,19 @@ GEM
       rspec-mocks (~> 3.13)
       rspec-support (~> 3.13)
     rspec-support (3.13.1)
-    rubocop (1.63.3)
+    rubocop (1.65.0)
       json (~> 2.3)
       language_server-protocol (>= 3.17.0)
       parallel (~> 1.10)
       parser (>= 3.3.0.2)
       rainbow (>= 2.2.2, < 4.0)
-      regexp_parser (>= 1.8, < 3.0)
+      regexp_parser (>= 2.4, < 3.0)
       rexml (>= 3.2.5, < 4.0)
       rubocop-ast (>= 1.31.1, < 2.0)
       ruby-progressbar (~> 1.7)
       unicode-display_width (>= 2.4.0, < 3.0)
-    rubocop-ast (1.31.2)
-      parser (>= 3.3.0.4)
-    rubocop-capybara (2.20.0)
-      rubocop (~> 1.41)
-    rubocop-factory_bot (2.25.1)
-      rubocop (~> 1.41)
+    rubocop-ast (1.31.3)
+      parser (>= 3.3.1.0)
     rubocop-performance (1.21.0)
       rubocop (>= 1.48.1, < 2.0)
       rubocop-ast (>= 1.31.1, < 2.0)
@@ -480,13 +477,8 @@ GEM
       rack (>= 1.1)
       rubocop (>= 1.33.0, < 2.0)
       rubocop-ast (>= 1.31.1, < 2.0)
-    rubocop-rspec (2.29.1)
-      rubocop (~> 1.40)
-      rubocop-capybara (~> 2.17)
-      rubocop-factory_bot (~> 2.22)
-      rubocop-rspec_rails (~> 2.28)
-    rubocop-rspec_rails (2.28.3)
-      rubocop (~> 1.40)
+    rubocop-rspec (3.0.3)
+      rubocop (~> 1.61)
     ruby-progressbar (1.13.0)
     ruby-vips (2.2.1)
       ffi (~> 1.12)
@@ -524,6 +516,7 @@ GEM
     stringio (3.1.0)
     strip_attributes (1.13.0)
       activemodel (>= 3.0, < 8.0)
+    strscan (3.1.0)
     thor (1.3.1)
     timeout (0.4.1)
     trailblazer-option (0.1.2)

app/controllers/account_configs_controller.rb

@@ -13,7 +13,8 @@ class AccountConfigsController < ApplicationController
     AccountConfig::FORM_WITH_CONFETTI_KEY,
     AccountConfig::DOWNLOAD_LINKS_AUTH_KEY,
     AccountConfig::FORCE_SSO_AUTH_KEY,
-    AccountConfig::FLATTEN_RESULT_PDF_KEY
+    AccountConfig::FLATTEN_RESULT_PDF_KEY,
+    AccountConfig::WITH_SIGNATURE_ID
   ].freeze
 
   InvalidKey = Class.new(StandardError)

app/controllers/accounts_controller.rb

@@ -7,7 +7,8 @@ class AccountsController < ApplicationController
     'fr-FR' => 'French (France)',
     'es-ES' => 'Spanish (Spain)',
     'pt-PT' => 'Portuguese (Portugal)',
-    'de-DE' => 'German (Germany)'
+    'de-DE' => 'German (Germany)',
+    'it-IT' => 'Italian (Italy)'
   }.freeze
 
   before_action :load_account

app/controllers/api/api_base_controller.rb

@@ -39,12 +39,17 @@ module Api
 
     private
 
-    def paginate(relation)
-      result = relation.order(id: :desc)
+    def paginate(relation, field: :id)
+      result = relation.order(field => :desc)
                        .limit([params.fetch(:limit, DEFAULT_LIMIT).to_i, MAX_LIMIT].min)
 
-      result = result.where(id: ...params[:after].to_i) if params[:after].present?
-      result = result.where(id: (params[:before].to_i + 1)...) if params[:before].present?
+      if field == :id
+        result = result.where(id: ...params[:after].to_i) if params[:after].present?
+        result = result.where(id: (params[:before].to_i + 1)...) if params[:before].present?
+      else
+        result = result.where(field => ...params[:after]) if params[:after].present?
+        result = result.where(field => (params[:before] + 1)...) if params[:before].present?
+      end
 
       result
     end

app/controllers/api/attachments_controller.rb

@@ -16,7 +16,7 @@ module Api
         cookies.encrypted[:signature_uuids] = build_new_cookie_signatures_json(submitter, attachment)
       end
 
-      render json: attachment.as_json(only: %i[uuid], methods: %i[url filename content_type])
+      render json: attachment.as_json(only: %i[uuid created_at], methods: %i[url filename content_type])
     end
 
     def build_new_cookie_signatures_json(submitter, attachment)

app/controllers/api/form_events_controller.rb

@@ -0,0 +1,35 @@
+# frozen_string_literal: true
+
+module Api
+  class FormEventsController < ApiBaseController
+    load_and_authorize_resource :submitter, parent: false
+
+    def index
+      submitters = @submitters.where.not(completed_at: nil)
+
+      params[:after] = Time.zone.at(params[:after].to_i) if params[:after].present?
+      params[:before] = Time.zone.at(params[:before].to_i) if params[:before].present?
+
+      submitters = paginate(
+        submitters.preload(template: :folder, submission: [:submitters, { audit_trail_attachment: :blob }],
+                           documents_attachments: :blob, attachments_attachments: :blob),
+        field: :completed_at
+      )
+
+      render json: {
+        data: submitters.map do |s|
+                {
+                  event_type: 'form.completed',
+                  timestamp: s.completed_at,
+                  data: Submitters::SerializeForWebhook.call(s)
+                }
+              end,
+        pagination: {
+          count: submitters.size,
+          next: submitters.last&.completed_at&.to_i,
+          prev: submitters.first&.completed_at&.to_i
+        }
+      }
+    end
+  end
+end

app/controllers/api/submissions_controller.rb

@@ -75,13 +75,7 @@ module Api
         end
       end
 
-      json = submissions.flat_map do |submission|
-        submission.submitters.map do |s|
-          Submitters::SerializeForApi.call(s, with_documents: false, with_urls: true)
-        end
-      end
-
-      render json:
+      render json: build_create_json(submissions)
     rescue Submitters::NormalizeValues::BaseError => e
       Rollbar.warning(e) if defined?(Rollbar)
 
@@ -102,6 +96,18 @@ module Api
 
     private
 
+    def build_create_json(submissions)
+      json = submissions.flat_map do |submission|
+        submission.submitters.map do |s|
+          Submitters::SerializeForApi.call(s, with_documents: false, with_urls: true, params:)
+        end
+      end
+
+      json = { submitters: json } if request.path.ends_with?('/init')
+
+      json
+    end
+
     def create_submissions(template, params)
       is_send_email = !params[:send_email].in?(['false', false])
 
@@ -121,7 +127,6 @@ module Api
           template:,
           user: current_user,
           source: :api,
-          mark_as_sent: is_send_email,
           submitters_order: params[:submitters_order] || params[:order] || 'preserved',
           submissions_attrs:,
           params:
@@ -142,6 +147,7 @@ module Api
     def submissions_params
       permitted_attrs = [
         :send_email, :send_sms, :bcc_completed, :completed_redirect_url, :reply_to, :go_to_last,
+        :expire_at,
         {
           message: %i[subject body],
           submitters: [[:send_email, :send_sms, :completed_redirect_url, :uuid, :name, :email, :role,

app/controllers/api/submitters_controller.rb

@@ -23,7 +23,9 @@ module Api
       )
 
       render json: {
-        data: submitters.map { |s| Submitters::SerializeForApi.call(s, with_template: true, with_events: true) },
+        data: submitters.map do |s|
+                Submitters::SerializeForApi.call(s, with_template: true, with_events: true, params:)
+              end,
         pagination: {
           count: submitters.size,
           next: submitters.last&.id,
@@ -35,7 +37,7 @@ module Api
     def show
       Submissions::EnsureResultGenerated.call(@submitter) if @submitter.completed_at?
 
-      render json: Submitters::SerializeForApi.call(@submitter, with_template: true, with_events: true)
+      render json: Submitters::SerializeForApi.call(@submitter, with_template: true, with_events: true, params:)
     end
 
     def update
@@ -73,7 +75,8 @@ module Api
 
       render json: Submitters::SerializeForApi.call(@submitter, with_template: false,
                                                                 with_urls: true,
-                                                                with_events: false)
+                                                                with_events: false,
+                                                                params:)
     end
 
     def submitter_params

app/controllers/api/templates_clone_controller.rb

@@ -7,6 +7,11 @@ module Api
     def create
       authorize!(:manage, @template)
 
+      ActiveRecord::Associations::Preloader.new(
+        records: [@template],
+        associations: [schema_documents: :preview_images_attachments]
+      ).call
+
       cloned_template = Templates::Clone.call(
         @template,
         author: current_user,
@@ -18,11 +23,11 @@ module Api
       cloned_template.source = :api
       cloned_template.save!
 
-      Templates::CloneAttachments.call(template: cloned_template, original_template: @template)
+      schema_documents = Templates::CloneAttachments.call(template: cloned_template, original_template: @template)
 
       SendTemplateCreatedWebhookRequestJob.perform_async('template_id' => cloned_template.id)
 
-      render json: Templates::SerializeForApi.call(cloned_template)
+      render json: Templates::SerializeForApi.call(cloned_template, schema_documents)
     end
   end
 end

app/controllers/api/tools_controller.rb

@@ -0,0 +1,18 @@
+# frozen_string_literal: true
+
+module Api
+  class ToolsController < ApiBaseController
+    skip_authorization_check
+
+    def merge
+      files = params[:files] || []
+
+      return render json: { error: 'Files are required' }, status: :unprocessable_entity if files.blank?
+      return render json: { error: 'At least 2 files are required' }, status: :unprocessable_entity if files.size < 2
+
+      render json: {
+        data: Base64.encode64(PdfUtils.merge(files.map { |base64| StringIO.new(Base64.decode64(base64)) }).string)
+      }
+    end
+  end
+end

app/controllers/api/users_controller.rb

@@ -0,0 +1,11 @@
+# frozen_string_literal: true
+
+module Api
+  class UsersController < ApiBaseController
+    authorize_resource :current_user
+
+    def show
+      render json: current_user.as_json(only: %i[id first_name last_name email])
+    end
+  end
+end

app/controllers/embed_scripts_controller.rb

@@ -0,0 +1,39 @@
+# frozen_string_literal: true
+
+class EmbedScriptsController < ActionController::Metal
+  DUMMY_SCRIPT = <<~JAVASCRIPT.freeze
+    const DummyBuilder = class extends HTMLElement {
+      connectedCallback() {
+        this.innerHTML = `
+          <div style="text-align: center; padding: 20px; font-family: Arial, sans-serif;">
+            <h2>Upgrade to Pro</h2>
+            <p>Unlock embedded components by upgrading to Pro</p>
+            <div style="margin-top: 40px;">
+              <a href="#{Docuseal::CONSOLE_URL}/on_premise" target="_blank" style="padding: 15px 25px; background-color: #222; color: white; text-decoration: none; border-radius: 5px; font-size: 16px; cursor: pointer;">
+                Learn More
+              </a>
+            </div>
+          </div>
+        `;
+      }
+    };
+
+    const DummyForm = class extends DummyBuilder {};
+
+    if (!window.customElements.get('docuseal-builder')) {
+      window.customElements.define('docuseal-builder', DummyBuilder);
+    }
+
+    if (!window.customElements.get('docuseal-form')) {
+      window.customElements.define('docuseal-form', DummyForm);
+    }
+  JAVASCRIPT
+
+  def show
+    headers['Content-Type'] = 'application/javascript'
+
+    self.response_body = DUMMY_SCRIPT
+
+    self.status = 200
+  end
+end

app/controllers/start_form_controller.rb

@@ -17,7 +17,8 @@ class StartFormController < ApplicationController
   def update
     return redirect_to start_form_path(@template.slug) if @template.archived_at?
 
-    @submitter = Submitter.where(submission: @template.submissions.where(archived_at: nil))
+    @submitter = Submitter.where(submission: @template.submissions.where(expire_at: Time.current..)
+                                             .or(@template.submissions.where(expire_at: nil)).where(archived_at: nil))
                           .order(id: :desc)
                           .then { |rel| params[:resubmit].present? ? rel.where(completed_at: nil) : rel }
                           .find_or_initialize_by(**submitter_params.compact_blank)

app/controllers/submissions_controller.rb

@@ -39,7 +39,6 @@ class SubmissionsController < ApplicationController
                                            user: current_user,
                                            source: :invite,
                                            submitters_order: params[:preserve_order] == '1' ? 'preserved' : 'random',
-                                           mark_as_sent: params[:send_email] == '1',
                                            submissions_attrs: submissions_params[:submission].to_h.values,
                                            params: params.merge('send_completed_email' => true))
       end
@@ -54,11 +53,20 @@ class SubmissionsController < ApplicationController
   end
 
   def destroy
-    @submission.update!(archived_at: Time.current)
+    notice =
+      if params[:permanently].present?
+        @submission.destroy!
 
-    SendSubmissionArchivedWebhookRequestJob.perform_async('submission_id' => @submission.id)
+        'Submission has been removed'
+      else
+        @submission.update!(archived_at: Time.current)
 
-    redirect_back(fallback_location: template_path(@submission.template), notice: 'Submission has been archived')
+        SendSubmissionArchivedWebhookRequestJob.perform_async('submission_id' => @submission.id)
+
+        'Submission has been archived'
+      end
+
+    redirect_back(fallback_location: template_path(@submission.template), notice:)
   end
 
   private

app/controllers/submit_form_controller.rb

@@ -8,28 +8,15 @@ class SubmitFormController < ApplicationController
   skip_authorization_check
 
   CONFIG_KEYS = [].freeze
-  PRELOAD_ALL_PAGES_AMOUNT = 200
 
   def show
     @submitter = Submitter.find_by!(slug: params[:slug])
 
     return redirect_to submit_form_completed_path(@submitter.slug) if @submitter.completed_at?
     return render :archived if @submitter.submission.template.archived_at? || @submitter.submission.archived_at?
+    return render :expired if @submitter.submission.expired?
 
-    ActiveRecord::Associations::Preloader.new(
-      records: [@submitter],
-      associations: [submission: [:template, { template_schema_documents: :blob }]]
-    ).call
-
-    total_pages =
-      @submitter.submission.template_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: @submitter.submission.template_schema_documents,
-        associations: [:blob, { preview_images_attachments: :blob }]
-      ).call
-    end
+    Submitters.preload_with_pages(@submitter)
 
     Submitters::MaybeUpdateDefaultValues.call(@submitter, current_user)
 
@@ -40,7 +27,15 @@ class SubmitFormController < ApplicationController
 
     return unless @form_configs[:prefill_signature]
 
-    @signature_attachment =
+    if (user_signature = UserConfigs.load_signature(current_user))
+      @signature_attachment = ActiveStorage::Attachment.find_or_create_by!(
+        blob_id: user_signature.blob_id,
+        name: 'attachments',
+        record: @submitter
+      )
+    end
+
+    @signature_attachment ||=
       Submitters::MaybeAssignDefaultBrowserSignature.call(@submitter, params, cookies, @attachments_index.values)
 
     @attachments_index[@signature_attachment.uuid] = @signature_attachment if @signature_attachment
@@ -54,11 +49,13 @@ class SubmitFormController < ApplicationController
     end
 
     if submitter.template.archived_at? || submitter.submission.archived_at?
-      Rollbar.info("Archived template: #{submitter.template.id}") if defined?(Rollbar)
-
       return render json: { error: 'Form has been archived.' }, status: :unprocessable_entity
     end
 
+    if submitter.submission.expired?
+      return render json: { error: 'Form has been expired.' }, status: :unprocessable_entity
+    end
+
     Submitters::SubmitValues.call(submitter, params, request)
 
     head :ok

app/controllers/submit_form_values_controller.rb

@@ -15,7 +15,7 @@ class SubmitFormValuesController < ApplicationController
 
     render json: {
       value:,
-      attachment: attachment&.as_json(only: %i[uuid], methods: %i[url filename content_type])
+      attachment: attachment&.as_json(only: %i[uuid created_at], methods: %i[url filename content_type])
     }, head: :ok
   end
 end

app/controllers/templates_controller.rb

@@ -27,7 +27,7 @@ class TemplatesController < ApplicationController
   def edit
     ActiveRecord::Associations::Preloader.new(
       records: [@template],
-      associations: [schema_documents: { preview_images_attachments: :blob }]
+      associations: [schema_documents: [:blob, { preview_images_attachments: :blob }]]
     ).call
 
     @template_data =
@@ -43,6 +43,11 @@ class TemplatesController < ApplicationController
 
   def create
     if @base_template
+      ActiveRecord::Associations::Preloader.new(
+        records: [@base_template],
+        associations: [schema_documents: :preview_images_attachments]
+      ).call
+
       @template = Templates::Clone.call(@base_template, author: current_user,
                                                         name: params.dig(:template, :name),
                                                         folder_name: params[:folder_name])
@@ -82,8 +87,6 @@ class TemplatesController < ApplicationController
       if params[:permanently].present?
         @template.destroy!
 
-        Rollbar.info("Remove template: #{@template.id}") if defined?(Rollbar)
-
         'Template has been removed.'
       else
         @template.update!(archived_at: Time.current)

app/controllers/templates_form_preview_controller.rb

@@ -1,8 +1,6 @@
 # frozen_string_literal: true
 
 class TemplatesFormPreviewController < ApplicationController
-  PRELOAD_ALL_PAGES_AMOUNT = 200
-
   layout 'form'
 
   load_and_authorize_resource :template
@@ -15,20 +13,7 @@ class TemplatesFormPreviewController < ApplicationController
 
     @submitter.submission.submitters = @template.submitters.map { |item| Submitter.new(uuid: item['uuid']) }
 
-    ActiveRecord::Associations::Preloader.new(
-      records: [@submitter],
-      associations: [submission: [:template, { template_schema_documents: :blob }]]
-    ).call
-
-    total_pages =
-      @submitter.submission.template_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: @submitter.submission.template_schema_documents,
-        associations: [:blob, { preview_images_attachments: :blob }]
-      ).call
-    end
+    Submitters.preload_with_pages(@submitter)
 
     @attachments_index = ActiveStorage::Attachment.where(record: @submitter.submission.submitters, name: :attachments)
                                                   .preload(:blob).index_by(&:uuid)

app/controllers/templates_preferences_controller.rb

@@ -22,6 +22,7 @@ class TemplatesPreferencesController < ApplicationController
       preferences: %i[bcc_completed request_email_subject request_email_body
                       documents_copy_email_subject documents_copy_email_body
                       documents_copy_email_enabled documents_copy_email_attach_audit
+                      completed_notification_email_attach_documents
                       completed_notification_email_subject completed_notification_email_body
                       completed_notification_email_enabled completed_notification_email_attach_audit]
     ).tap do |attrs|

app/controllers/templates_uploads_controller.rb

@@ -15,11 +15,13 @@ class TemplatesUploadsController < ApplicationController
     documents = Templates::CreateAttachments.call(@template, url_params || params, extract_fields: true)
     schema = documents.map { |doc| { attachment_uuid: doc.uuid, name: doc.filename.base } }
 
-    fields = Templates::ProcessDocument.normalize_attachment_fields(@template, documents)
+    if @template.fields.blank?
+      @template.fields = Templates::ProcessDocument.normalize_attachment_fields(@template, documents)
 
-    schema.each { |item| item['pending_fields'] = true } if fields.present?
+      schema.each { |item| item['pending_fields'] = true } if @template.fields.present?
+    end
 
-    @template.update!(schema:, fields:)
+    @template.update!(schema:)
 
     SendTemplateCreatedWebhookRequestJob.perform_async('template_id' => @template.id)
 
@@ -56,7 +58,7 @@ class TemplatesUploadsController < ApplicationController
     file = ActionDispatch::Http::UploadedFile.new(
       tempfile:,
       filename: File.basename(
-        URI.decode_www_form_component(params[:filename].presence || params[:url])
+        URI.decode_www_form_component(params[:filename].presence || params[:url]), '.*'
       ),
       type: Marcel::MimeType.for(tempfile)
     )

app/controllers/webhook_secret_controller.rb

@@ -0,0 +1,29 @@
+# frozen_string_literal: true
+
+class WebhookSecretController < ApplicationController
+  before_action :load_encrypted_config
+  authorize_resource :encrypted_config, parent: false
+
+  def index; end
+
+  def create
+    @encrypted_config.assign_attributes(value: {
+      encrypted_config_params[:key] => encrypted_config_params[:value]
+    }.compact_blank)
+
+    @encrypted_config.value.present? ? @encrypted_config.save! : @encrypted_config.delete
+
+    redirect_back(fallback_location: settings_webhooks_path, notice: 'Webhook Secret has been saved.')
+  end
+
+  private
+
+  def load_encrypted_config
+    @encrypted_config =
+      current_account.encrypted_configs.find_or_initialize_by(key: EncryptedConfig::WEBHOOK_SECRET_KEY)
+  end
+
+  def encrypted_config_params
+    params.require(:encrypted_config).permit(value: %i[key value]).fetch(:value, {})
+  end
+end

app/controllers/webhook_settings_controller.rb

@@ -17,7 +17,8 @@ class WebhookSettingsController < ApplicationController
   def update
     submitter = current_account.submitters.where.not(completed_at: nil).order(:id).last
 
-    SendFormCompletedWebhookRequestJob.perform_async({ 'submitter_id' => submitter.id })
+    SendFormCompletedWebhookRequestJob.perform_async({ 'submitter_id' => submitter.id,
+                                                       'encrypted_config_id' => @encrypted_config.id })
 
     redirect_back(fallback_location: settings_webhooks_path, notice: 'Webhook request has been sent.')
   end

app/javascript/application.js

@@ -24,6 +24,7 @@ import SubmitForm from './elements/submit_form'
 import PromptPassword from './elements/prompt_password'
 import EmailsTextarea from './elements/emails_textarea'
 import ToggleOnSubmit from './elements/toggle_on_submit'
+import PasswordInput from './elements/password_input'
 
 import * as TurboInstantClick from './lib/turbo_instant_click'
 
@@ -85,6 +86,7 @@ safeRegisterElement('prompt-password', PromptPassword)
 safeRegisterElement('emails-textarea', EmailsTextarea)
 safeRegisterElement('toggle-cookies', ToggleCookies)
 safeRegisterElement('toggle-on-submit', ToggleOnSubmit)
+safeRegisterElement('password-input', PasswordInput)
 
 safeRegisterElement('template-builder', class extends HTMLElement {
   connectedCallback () {

app/javascript/elements/password_input.js

@@ -0,0 +1,35 @@
+import { target, targetable } from '@github/catalyst/lib/targetable'
+
+export default targetable(class extends HTMLElement {
+  static [target.static] = [
+    'visiblePasswordIcon',
+    'hiddenPasswordIcon',
+    'passwordInput',
+    'togglePasswordVisibility'
+  ]
+
+  connectedCallback () {
+    this.togglePasswordVisibility.addEventListener('click', this.handleTogglePasswordVisibility)
+    document.addEventListener('turbo:submit-start', this.setInitialPasswordType)
+  }
+
+  disconnectedCallback () {
+    this.togglePasswordVisibility.removeEventListener('click', this.handleTogglePasswordVisibility)
+    document.removeEventListener('turbo:submit-start', this.setInitialPasswordType)
+  }
+
+  handleTogglePasswordVisibility = () => {
+    this.passwordInput.type = this.passwordInput.type === 'password' ? 'text' : 'password'
+    this.toggleIcon()
+  }
+
+  setInitialPasswordType = () => {
+    this.passwordInput.type = 'password'
+    this.toggleIcon()
+  }
+
+  toggleIcon = () => {
+    this.visiblePasswordIcon.classList.toggle('hidden', this.passwordInput.type === 'password')
+    this.hiddenPasswordIcon.classList.toggle('hidden', this.passwordInput.type === 'text')
+  }
+})

app/javascript/form.js

@@ -22,6 +22,7 @@ safeRegisterElement('submission-form', class extends HTMLElement {
       scrollPadding: this.dataset.scrollPadding || '-80px',
       dryRun: this.dataset.dryRun === 'true',
       expand: ['true', 'false'].includes(this.dataset.expand) ? this.dataset.expand === 'true' : null,
+      withSignatureId: this.dataset.withSignatureId === 'true',
       withConfetti: this.dataset.withConfetti !== 'false',
       withDisclosure: this.dataset.withDisclosure === 'true',
       withTypedSignature: this.dataset.withTypedSignature !== 'false',

app/javascript/submission_form/area.vue

@@ -3,10 +3,10 @@
     class="field-area flex absolute lg:text-base -outline-offset-1"
     dir="auto"
     :style="computedStyle"
-    :class="{ 'text-[1.5vw] lg:text-base': !textOverflowChars, 'text-[1.0vw] lg:text-xs': textOverflowChars, 'cursor-default': !submittable, 'border border-red-100 bg-red-100 cursor-pointer': submittable, 'border border-red-100': !isActive && submittable, 'bg-opacity-80': !isActive && !isValueSet && submittable, 'field-area-active outline-red-500 outline-dashed outline-2 z-10': isActive && submittable, 'bg-opacity-40': (isActive || isValueSet) && submittable }"
+    :class="{ 'text-[1.6vw] lg:text-base': !textOverflowChars, 'text-[1.0vw] lg:text-xs': textOverflowChars, 'cursor-default': !submittable, 'border border-red-100 bg-red-100 cursor-pointer': submittable, 'border border-red-100': !isActive && submittable, 'bg-opacity-80': !isActive && !isValueSet && submittable, 'field-area-active outline-red-500 outline-dashed outline-2 z-10': isActive && submittable, 'bg-opacity-40': (isActive || isValueSet) && submittable }"
   >
     <div
-      v-if="!isActive && !isValueSet && field.type !== 'checkbox' && submittable && !area.option_uuid"
+      v-if="(!withFieldPlaceholder || !field.name || field.type === 'cells') && !isActive && !isValueSet && field.type !== 'checkbox' && submittable && !area.option_uuid"
       class="absolute top-0 bottom-0 right-0 left-0 items-center justify-center h-full w-full"
     >
       <span
@@ -54,18 +54,44 @@
       class="object-contain mx-auto"
       :src="stamp.url"
     >
-    <img
+    <div
       v-else-if="field.type === 'signature' && signature"
-      class="object-contain mx-auto"
-      :src="signature.url"
+      class="flex flex-col justify-between h-full overflow-hidden"
     >
+      <div
+        class="flex-grow flex overflow-hidden"
+        style="min-height: 50%"
+      >
+        <img
+          class="object-contain mx-auto"
+          :src="signature.url"
+        >
+      </div>
+      <div
+        v-if="withSignatureId"
+        class="w-full mt-1 text-[1vw] lg:text-[0.55rem] lg:leading-[0.65rem]"
+      >
+        <div class="truncate uppercase">
+          ID: {{ signature.uuid }}
+        </div>
+        <div>
+          {{ t('reason') }}: {{ t('digitally_signed_by') }} {{ submitter.name }}
+          <template v-if="submitter.email">
+            &lt;{{ submitter.email }}&gt;
+          </template>
+        </div>
+        <div>
+          {{ new Date(signature.created_at).toLocaleString(undefined, { year: 'numeric', month: 'short', day: 'numeric', hour: 'numeric', minute: 'numeric', timeZoneName: 'short' }) }}
+        </div>
+      </div>
+    </div>
     <img
       v-else-if="field.type === 'initials' && initials"
       class="object-contain mx-auto"
       :src="initials.url"
     >
     <div
-      v-else-if="field.type === 'file' || field.type === 'payment'"
+      v-else-if="(field.type === 'file' || field.type === 'payment') && attachments.length"
       class="px-0.5 flex flex-col justify-center"
     >
       <a
@@ -75,7 +101,7 @@
         :href="attachment.url"
       >
         <IconPaperclip
-          class="inline w-[1.5vw] h-[1.5vw] lg:w-4 lg:h-4"
+          class="inline w-[1.6vw] h-[1.6vw] lg:w-4 lg:h-4"
         />
         {{ attachment.filename }}
       </a>
@@ -160,7 +186,12 @@
       class="flex items-center px-0.5 w-full"
       :class="alignClasses[field.preferences?.align]"
     >
-      <span v-if="Array.isArray(modelValue)">
+      <span
+        v-if="field && field.name && withFieldPlaceholder && !modelValue && modelValue !== 0"
+        class="whitespace-pre-wrap text-gray-400"
+        :class="{ 'w-full': field.preferences?.align }"
+      >{{ field.name }}</span>
+      <span v-else-if="Array.isArray(modelValue)">
         {{ modelValue.join(', ') }}
       </span>
       <span v-else-if="field.type === 'date'">
@@ -193,6 +224,15 @@ export default {
       type: Object,
       required: true
     },
+    submitter: {
+      type: Object,
+      required: true
+    },
+    withSignatureId: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
     isValueSet: {
       type: Boolean,
       required: false,
@@ -203,6 +243,11 @@ export default {
       required: false,
       default: '-80px'
     },
+    withFieldPlaceholder: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
     submittable: {
       type: Boolean,
       required: false,
@@ -364,7 +409,7 @@ export default {
     modelValue () {
       this.$nextTick(() => {
         if (['date', 'text', 'number'].includes(this.field.type) && this.$refs.textContainer && (this.textOverflowChars === 0 || (this.textOverflowChars - 4) > `${this.modelValue}`.length)) {
-          this.textOverflowChars = this.$refs.textContainer.scrollHeight > this.$refs.textContainer.clientHeight ? `${this.modelValue}`.length : 0
+          this.textOverflowChars = this.$refs.textContainer.scrollHeight > this.$refs.textContainer.clientHeight ? `${this.modelValue || (this.withFieldPlaceholder ? this.field.name : '')}`.length : 0
         }
       })
     }
@@ -372,7 +417,7 @@ export default {
   mounted () {
     this.$nextTick(() => {
       if (['date', 'text', 'number'].includes(this.field.type) && this.$refs.textContainer) {
-        this.textOverflowChars = this.$refs.textContainer.scrollHeight > this.$refs.textContainer.clientHeight ? `${this.modelValue}`.length : 0
+        this.textOverflowChars = this.$refs.textContainer.scrollHeight > this.$refs.textContainer.clientHeight ? `${this.modelValue || (this.withFieldPlaceholder ? this.field.name : '')}`.length : 0
       }
     })
   },

app/javascript/submission_form/areas.vue

@@ -23,8 +23,11 @@
             :submittable="true"
             :field-index="fieldIndex"
             :scroll-padding="scrollPadding"
+            :submitter="submitter"
+            :with-field-placeholder="withFieldPlaceholder"
+            :with-signature-id="withSignatureId"
             :is-active="currentStep === step"
-            :with-label="withLabel"
+            :with-label="withLabel && !withFieldPlaceholder"
             :is-value-set="step.some((f) => f.uuid in values)"
             :attachments-index="attachmentsIndex"
             @click="$emit('focus-step', step)"
@@ -49,11 +52,25 @@ export default {
       required: false,
       default: () => []
     },
+    withSignatureId: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    submitter: {
+      type: Object,
+      required: true
+    },
     values: {
       type: Object,
       required: false,
       default: () => ({})
     },
+    withFieldPlaceholder: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
     scrollPadding: {
       type: String,
       required: false,
@@ -69,6 +86,11 @@ export default {
       required: false,
       default: true
     },
+    scrollEl: {
+      type: Object,
+      required: false,
+      default: null
+    },
     currentStep: {
       type: Array,
       required: false,
@@ -103,7 +125,12 @@ export default {
         if (container.style.overflow === 'hidden') {
           this.scrollInContainer(areaRef.$el)
         } else {
-          areaRef.$refs.scrollToElem.scrollIntoView({ behavior: 'smooth', block: 'start' })
+          const targetRect = areaRef.$refs.scrollToElem.getBoundingClientRect()
+          const root = this.$root.$el?.parentNode?.classList?.contains('ds') ? this.$root.$el : document.body
+          const rootRect = root.getBoundingClientRect()
+          const scrollEl = this.scrollEl || window
+
+          scrollEl.scrollTo({ top: targetRect.top - rootRect.top, behavior: 'smooth' })
         }
 
         return true
@@ -122,7 +149,7 @@ export default {
 
       const targetTopRelativeToBox = targetRect.top - boxRect.top
 
-      scrollbox.scrollTop = targetTopRelativeToBox - container.offsetHeight + formContainer.offsetHeight + target.offsetHeight + padding
+      scrollbox.scrollTo({ top: targetTopRelativeToBox - container.offsetHeight + formContainer.offsetHeight + target.offsetHeight + padding, behavior: 'smooth' })
     },
     setAreaRef (el) {
       if (el) {

app/javascript/submission_form/date_step.vue

@@ -43,6 +43,7 @@
         :required="field.required"
         type="date"
         :name="`values[${field.uuid}]`"
+        @keydown.enter="onEnter"
         @focus="$emit('focus')"
       >
     </div>
@@ -78,7 +79,7 @@ export default {
       default: ''
     }
   },
-  emits: ['update:model-value', 'focus'],
+  emits: ['update:model-value', 'focus', 'submit'],
   computed: {
     value: {
       set (value) {
@@ -90,6 +91,13 @@ export default {
     }
   },
   methods: {
+    onEnter (e) {
+      if (this.modelValue) {
+        e.preventDefault()
+
+        this.$emit('submit')
+      }
+    },
     setCurrentDate () {
       const inputEl = this.$refs.input
 

app/javascript/submission_form/form.vue

@@ -3,6 +3,10 @@
     ref="areas"
     :steps="stepFields"
     :values="values"
+    :with-field-placeholder="withFieldPlaceholder"
+    :submitter="submitter"
+    :scroll-el="scrollEl"
+    :with-signature-id="withSignatureId"
     :attachments-index="attachmentsIndex"
     :with-label="!isAnonymousChecboxes && showFieldNames"
     :current-step="currentStepFields"
@@ -102,6 +106,7 @@
             v-model="values[currentField.uuid]"
             :show-field-names="showFieldNames"
             :field="currentField"
+            @submit="submitStep"
             @focus="scrollIntoField(currentField)"
           />
           <div v-else-if="currentField.type === 'select'">
@@ -384,6 +389,7 @@
             v-model="values[currentField.uuid]"
             :field="currentField"
             :submitter-slug="submitterSlug"
+            :values="values"
             @attached="attachments.push($event)"
             @focus="scrollIntoField(currentField)"
             @submit="submitStep"
@@ -533,6 +539,11 @@ export default {
       type: Object,
       required: true
     },
+    withSignatureId: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
     scrollPadding: {
       type: String,
       required: false,
@@ -548,6 +559,16 @@ export default {
       required: false,
       default: () => []
     },
+    withFieldPlaceholder: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
+    scrollEl: {
+      type: Object,
+      required: false,
+      default: null
+    },
     onComplete: {
       type: Function,
       required: false,
@@ -789,7 +810,7 @@ export default {
       }, [])
     },
     formulaFields () {
-      return this.fields.filter((f) => f.preferences?.formula)
+      return this.fields.filter((f) => f.preferences?.formula && f.type !== 'payment')
     },
     attachmentsIndex () {
       return this.attachments.reduce((acc, a) => {
@@ -1093,7 +1114,9 @@ export default {
           if (response.status === 422 || response.status === 500) {
             const data = await response.json()
 
-            alert(data.error || 'Value is invalid')
+            const i18nError = data.error ? this.t(data.error.replace(/\s+/g, '_').toLowerCase()) : ''
+
+            alert(i18nError !== data.error ? i18nError : (data.error || this.t('value_is_invalid')))
 
             return Promise.reject(new Error(data.error))
           }

app/javascript/submission_form/i18n.js

@@ -9,12 +9,16 @@ const en = {
   scan_the_qr_code_with_the_camera_app_to_open_the_form_on_mobile_and_draw_your_signature: 'Scan the QR code with the camera app to open the form on mobile and draw your signature',
   date: 'Date',
   number: 'Number',
+  value_is_invalid: 'Value is invalid',
+  verification_code_is_invalid: 'Verification code is invalid',
   already_paid: 'Already paid',
   image: 'Image',
   pay: 'Pay',
   take_photo: 'Take photo',
   number_phone_is_invalid: '{number} phone is invalid',
   file: 'File',
+  digitally_signed_by: 'Digitally signed by',
+  reason: 'Reason',
   select: 'Select',
   checkbox: 'Checkbox',
   multiple: 'Multiple',
@@ -73,6 +77,8 @@ const en = {
 }
 
 const es = {
+  value_is_invalid: 'El valor no es válido',
+  verification_code_is_invalid: 'El código de verificación no es válido',
   drawn_signature_on_a_touchscreen_device: 'Firma dibujada en un dispositivo con pantalla táctil',
   scan_the_qr_code_with_the_camera_app_to_open_the_form_on_mobile_and_draw_your_signature: 'Escanea el código QR con la aplicación de la cámara para abrir el formulario en el móvil y dibujar tu firma',
   by_clicking_you_agree_to_the: 'Al hacer clic en "{button}", usted acepta el',
@@ -83,6 +89,8 @@ const es = {
   text: 'Texto',
   signature: 'Firma',
   pay: 'Pagar',
+  digitally_signed_by: 'Firmado digitalmente por',
+  reason: 'Razón',
   initials: 'Iniciales',
   date: 'Fecha',
   number: 'Número',
@@ -146,6 +154,8 @@ const es = {
 }
 
 const it = {
+  value_is_invalid: 'Il valore non è valido',
+  verification_code_is_invalid: 'Il codice di verifica non è valido',
   drawn_signature_on_a_touchscreen_device: 'Firma disegnata su un dispositivo con schermo tattile',
   scan_the_qr_code_with_the_camera_app_to_open_the_form_on_mobile_and_draw_your_signature: 'Scansiona il codice QR con l\'app della fotocamera per aprire il modulo sul cellulare e disegnare la tua firma',
   by_clicking_you_agree_to_the: 'Cliccando su "{button}", accetti il',
@@ -155,6 +165,8 @@ const it = {
   already_paid: 'Pagato',
   text: 'Testo',
   signature: 'Firma',
+  digitally_signed_by: 'Firmato digitalmente da',
+  reason: 'Motivo',
   initials: 'Iniziali',
   date: 'Data',
   number: 'Numero',
@@ -219,6 +231,8 @@ const it = {
 }
 
 const de = {
+  value_is_invalid: 'Wert ist ungültig',
+  verification_code_is_invalid: 'Bestätigungscode ist ungültig',
   drawn_signature_on_a_touchscreen_device: 'Gezeichnete Unterschrift auf einem Touchscreen-Gerät',
   scan_the_qr_code_with_the_camera_app_to_open_the_form_on_mobile_and_draw_your_signature: 'Scannen Sie den QR-Code mit der Kamera-App, um das Formular auf dem Handy zu öffnen und Ihre Unterschrift zu zeichnen',
   by_clicking_you_agree_to_the: 'Durch Klicken auf "{button}" stimmen Sie zu, dass Sie die',
@@ -228,6 +242,8 @@ const de = {
   minimize: 'Minimieren',
   text: 'Text',
   signature: 'Unterschrift',
+  digitally_signed_by: 'Digital unterschrieben von',
+  reason: 'Grund',
   initials: 'Initialen',
   date: 'Datum',
   number: 'Nummer',
@@ -292,6 +308,8 @@ const de = {
 }
 
 const fr = {
+  value_is_invalid: 'La valeur est invalide',
+  verification_code_is_invalid: 'Le code de vérification est invalide',
   drawn_signature_on_a_touchscreen_device: 'Signature dessinée sur un appareil à écran tactile',
   scan_the_qr_code_with_the_camera_app_to_open_the_form_on_mobile_and_draw_your_signature: 'Scannez le code QR avec l\'application de l\'appareil photo pour ouvrir le formulaire sur mobile et dessiner votre signature',
   by_clicking_you_agree_to_the: 'En cliquant sur "{button}", vous acceptez la',
@@ -302,6 +320,8 @@ const fr = {
   already_paid: 'Déjà payé',
   signature: 'Signature',
   initials: 'Initiales',
+  digitally_signed_by: 'Signé numériquement par',
+  reason: 'Raison',
   pay: 'Payer',
   date: 'Date',
   number: 'Numéro',
@@ -365,6 +385,8 @@ const fr = {
 }
 
 const pl = {
+  value_is_invalid: 'Wartość jest nieprawidłowa',
+  verification_code_is_invalid: 'Kod weryfikacyjny jest nieprawidłowy',
   drawn_signature_on_a_touchscreen_device: 'Podpis odręczny na urządzeniu z ekranem dotykowym',
   scan_the_qr_code_with_the_camera_app_to_open_the_form_on_mobile_and_draw_your_signature: 'Zeskanuj kod QR za pomocą aplikacji aparatu, aby otworzyć formularz na telefonie i narysować swój podpis',
   by_clicking_you_agree_to_the: 'Klikając na "{button}", zgadzasz się na',
@@ -373,6 +395,8 @@ const pl = {
   minimize: 'Zminimalizuj',
   text: 'Tekst',
   already_paid: 'Już zapłacono',
+  digitally_signed_by: 'Podpisano cyfrowo przez',
+  reason: 'Powód',
   signature: 'Podpis',
   initials: 'Inicjały',
   date: 'Data',
@@ -438,6 +462,8 @@ const pl = {
 }
 
 const uk = {
+  value_is_invalid: 'Значення є неправильним',
+  verification_code_is_invalid: 'Код підтвердження є неправильним',
   drawn_signature_on_a_touchscreen_device: 'Підпис на сенсорному пристрої',
   scan_the_qr_code_with_the_camera_app_to_open_the_form_on_mobile_and_draw_your_signature: 'Скануйте QR-код за допомогою програми камери, щоб відкрити форму на мобільному пристрої та намалювати свій підпис',
   by_clicking_you_agree_to_the: 'Натиснувши на "{button}", ви погоджуєтеся з',
@@ -447,6 +473,8 @@ const uk = {
   text: 'Текст',
   already_paid: 'Вже оплачено',
   signature: 'Підпис',
+  digitally_signed_by: 'Підписано в електронному вигляді',
+  reason: 'Причина',
   initials: 'Ініціали',
   date: 'Дата',
   number: 'Число',
@@ -511,6 +539,8 @@ const uk = {
 }
 
 const cs = {
+  value_is_invalid: 'Hodnota je neplatná',
+  verification_code_is_invalid: 'Ověřovací kód je neplatný',
   drawn_signature_on_a_touchscreen_device: 'Namalovaný podpis na dotykovém zařízení',
   scan_the_qr_code_with_the_camera_app_to_open_the_form_on_mobile_and_draw_your_signature: 'Naskenujte QR kód pomocí aplikace fotoaparátu, abyste otevřeli formulář na mobilním zařízení a nakreslili svůj podpis',
   by_clicking_you_agree_to_the: 'Kliknutím na "{button}" souhlasíte s',
@@ -523,6 +553,8 @@ const cs = {
   initials: 'Iniciály',
   date: 'Datum',
   number: 'Číslo',
+  digitally_signed_by: 'Digitálně podepsáno',
+  reason: 'Důvod',
   image: 'Obrázek',
   pay: 'Zaplatit',
   file: 'Soubor',
@@ -584,6 +616,8 @@ const cs = {
 }
 
 const pt = {
+  value_is_invalid: 'Valor é inválido',
+  verification_code_is_invalid: 'Código de verificação é inválido',
   drawn_signature_on_a_touchscreen_device: 'Assinatura desenhada em um dispositivo com tela sensível ao toque',
   scan_the_qr_code_with_the_camera_app_to_open_the_form_on_mobile_and_draw_your_signature: 'Escaneie o código QR com o aplicativo da câmera para abrir o formulário no celular e desenhar sua assinatura',
   by_clicking_you_agree_to_the: 'Ao clicar em "{button}", você concorda com o',
@@ -594,6 +628,8 @@ const pt = {
   text: 'Texto',
   signature: 'Assinatura',
   initials: 'Iniciais',
+  digitally_signed_by: 'Assinado digitalmente por',
+  reason: 'Razão',
   date: 'Data',
   number: 'Número',
   image: 'Imagem',
@@ -657,6 +693,8 @@ const pt = {
 }
 
 const he = {
+  value_is_invalid: 'ערך לא תקין',
+  verification_code_is_invalid: 'קוד האימות אינו תקין',
   drawn_signature_on_a_touchscreen_device: 'חתימה שנוצרה במכשיר עם מסך מגע',
   scan_the_qr_code_with_the_camera_app_to_open_the_form_on_mobile_and_draw_your_signature: 'סרוק את קוד ה-QR באמצעות אפליקציית המצלמה כדי לפתוח את הטופס במובייל ולצייר את החתימה שלך',
   by_clicking_you_agree_to_the: 'על ידי לחיצה על "{button}", אתה מסכים ל',
@@ -668,6 +706,8 @@ const he = {
   signature: 'חתימה',
   initials: 'ראשי תיבות',
   date: 'תאריך',
+  digitally_signed_by: 'חתום דיגיטלית על ידי',
+  reason: 'סיבה',
   number: 'מספר',
   image: 'תמונה',
   file: 'קובץ',
@@ -731,6 +771,8 @@ const he = {
 }
 
 const nl = {
+  value_is_invalid: 'Waarde is ongeldig',
+  verification_code_is_invalid: 'Verificatiecode is ongeldig',
   drawn_signature_on_a_touchscreen_device: 'Getekende handtekening op een apparaat met een touchscreen',
   scan_the_qr_code_with_the_camera_app_to_open_the_form_on_mobile_and_draw_your_signature: 'Scan de QR-code met de camera-app om het formulier op mobiel te openen en uw handtekening te tekenen',
   by_clicking_you_agree_to_the: 'Door op "{button}" te klikken, gaat u akkoord met de',
@@ -740,6 +782,8 @@ const nl = {
   text: 'Tekst',
   already_paid: 'Al betaald',
   signature: 'Handtekening',
+  digitally_signed_by: 'Digitaal ondertekend door',
+  reason: 'Reden',
   initials: 'Initialen',
   date: 'Datum',
   number: 'Nummer',
@@ -805,6 +849,8 @@ const nl = {
 }
 
 const ar = {
+  value_is_invalid: 'القيمة غير صالحة',
+  verification_code_is_invalid: 'رمز التحقق غير صالح',
   drawn_signature_on_a_touchscreen_device: 'توقيع مرسوم على جهاز بشاشة تعمل باللمس',
   scan_the_qr_code_with_the_camera_app_to_open_the_form_on_mobile_and_draw_your_signature: 'امسح رمز الاستجابة السريعة باستخدام تطبيق الكاميرا لفتح النموذج على الهاتف المحمول ورسم توقيعك',
   by_clicking_you_agree_to_the: 'بالنقر فوق "{button}"، أنت توافق على',
@@ -815,6 +861,8 @@ const ar = {
   initials: 'الاختصارات',
   date: 'تاريخ',
   number: 'رقم',
+  digitally_signed_by: 'تم التوقيع رقميًا بواسطة',
+  reason: 'السبب',
   image: 'صورة',
   take_photo: 'التقاط صورة',
   pay: 'دفع',
@@ -888,6 +936,8 @@ const ko = {
   signature: '서명',
   initials: '이니셜',
   date: '날짜',
+  digitally_signed_by: '디지털 서명이 완료되었습니다',
+  reason: '이유',
   number: '숫자',
   pay: '급여',
   image: '이미지',

app/javascript/submission_form/markdown_content.vue

@@ -51,7 +51,17 @@ export default {
   },
   computed: {
     items () {
-      return snarkdown(this.string.replace(/\n/g, '<br>')).split(htmlSplitRegexp)
+      const linkParts = this.string.split(/(https?:\/\/[^\s)]+)/g)
+
+      const text = linkParts.map((part, index) => {
+        if (part.match(/^https?:\/\//) && !linkParts[index - 1]?.match(/\(\s*$/) && !linkParts[index + 1]?.match(/^\s*\)/)) {
+          return `[${part}](${part})`
+        } else {
+          return part
+        }
+      }).join('')
+
+      return snarkdown(text.replace(/\n/g, '<br>')).split(htmlSplitRegexp)
     }
   },
   methods: {

app/javascript/submission_form/payment_step.vue

@@ -51,7 +51,7 @@
         class="btn bg-[#7B73FF] text-white hover:bg-[#0A2540] text-lg w-full"
         :class="{ disabled: isCreatingCheckout }"
         :disabled="isCreatingCheckout"
-        @click.prevent="startCheckout"
+        @click.prevent="postCheckout"
       >
         <IconInnerShadowTop
           v-if="isCreatingCheckout"
@@ -93,6 +93,10 @@ export default {
       type: Object,
       required: true
     },
+    values: {
+      type: Object,
+      required: true
+    },
     submitterSlug: {
       type: String,
       required: true
@@ -101,7 +105,8 @@ export default {
   emits: ['focus', 'submit', 'update:model-value', 'attached'],
   data () {
     return {
-      isCreatingCheckout: false
+      isCreatingCheckout: false,
+      isMathLoaded: false
     }
   },
   computed: {
@@ -114,20 +119,72 @@ export default {
     defaultName () {
       const { price, currency } = this.field.preferences || {}
 
-      const formattedPrice = new Intl.NumberFormat([], {
+      const formatter = new Intl.NumberFormat([], {
         style: 'currency',
         currency
-      }).format(price)
+      })
 
-      return this.t('pay') + ' ' + formattedPrice
+      if (this.field.preferences?.formula) {
+        if (this.isMathLoaded) {
+          return this.t('pay') + ' ' + formatter.format(this.calculateFormula())
+        } else {
+          return ''
+        }
+      } else {
+        return this.t('pay') + ' ' + formatter.format(price)
+      }
     }
   },
-  mounted () {
+  async mounted () {
     if (this.sessionId) {
       this.$emit('submit')
     }
+
+    if (!this.sessionId) {
+      this.postCheckout({ checkStatus: true })
+    }
+
+    if (this.field.preferences?.formula) {
+      const {
+        create,
+        evaluateDependencies,
+        addDependencies,
+        subtractDependencies,
+        divideDependencies,
+        multiplyDependencies,
+        powDependencies,
+        roundDependencies,
+        absDependencies,
+        sinDependencies,
+        tanDependencies,
+        cosDependencies
+      } = await import('mathjs')
+
+      this.math = create({
+        evaluateDependencies,
+        addDependencies,
+        subtractDependencies,
+        divideDependencies,
+        multiplyDependencies,
+        powDependencies,
+        roundDependencies,
+        absDependencies,
+        sinDependencies,
+        tanDependencies,
+        cosDependencies
+      })
+
+      this.isMathLoaded = true
+    }
   },
   methods: {
+    calculateFormula () {
+      const transformedFormula = this.field.preferences.formula.replace(/{{(.*?)}}/g, (match, uuid) => {
+        return this.values[uuid] || 0.0
+      })
+
+      return this.math.evaluate(transformedFormula.toLowerCase())
+    },
     async submit () {
       if (this.sessionId) {
         return fetch(this.baseUrl + '/api/stripe_payments/' + this.sessionId, {
@@ -158,7 +215,7 @@ export default {
         return Promise.resolve({})
       }
     },
-    startCheckout () {
+    postCheckout ({ checkStatus } = {}) {
       this.isCreatingCheckout = true
 
       fetch(this.baseUrl + '/api/stripe_payments', {
@@ -166,6 +223,7 @@ export default {
         body: JSON.stringify({
           submitter_slug: this.submitterSlug,
           field_uuid: this.field.uuid,
+          check_status: checkStatus,
           referer: document.location.href
         }),
         headers: { 'Content-Type': 'application/json' }

app/javascript/submission_form/signature_step.vue

@@ -156,7 +156,7 @@
         class="top-0 bottom-0 right-0 left-0 absolute bg-white rounded-2xl m-0.5"
       />
       <div
-        v-show="isShowQr"
+        v-if="isShowQr"
         class="top-0 bottom-0 right-0 left-0 absolute bg-base-content/10 rounded-2xl"
       >
         <div
@@ -172,13 +172,13 @@
         </div>
         <div class="flex items-center justify-center w-full h-full p-4">
           <div
-            v-if="withQrButton"
-            ref="qr"
             class="bg-white p-4 rounded-xl h-full"
           >
             <canvas
               ref="qrCanvas"
               class="h-full"
+              width="132"
+              height="132"
             />
           </div>
         </div>
@@ -340,18 +340,6 @@ export default {
 
         this.$refs.canvas.getContext('2d').scale(scale, scale)
       }
-
-      if (this.withQrButton) {
-        import('qr-creator').then(({ default: Qr }) => {
-          Qr.render({
-            text: `${document.location.origin}/p/${this.submitterSlug}?f=${this.field.uuid.split('-')[0]}`,
-            radius: 0.0,
-            ecLevel: 'H',
-            background: null,
-            size: 132
-          }, this.$refs.qrCanvas)
-        })
-      }
     })
 
     if (this.$refs.canvas) {
@@ -406,6 +394,20 @@ export default {
     showQr () {
       this.isShowQr = true
 
+      this.$nextTick(() => {
+        import('qr-creator').then(({ default: Qr }) => {
+          if (this.$refs.qrCanvas) {
+            Qr.render({
+              text: `${document.location.origin}/p/${this.submitterSlug}?f=${this.field.uuid.split('-')[0]}`,
+              radius: 0.0,
+              ecLevel: 'H',
+              background: null,
+              size: 132
+            }, this.$refs.qrCanvas)
+          }
+        })
+      })
+
       this.startCheckSignature()
     },
     hideQr () {

app/javascript/template_builder/area.vue

@@ -9,7 +9,7 @@
     <div
       v-if="isSelected || isDraw"
       class="top-0 bottom-0 right-0 left-0 absolute border border-1.5 pointer-events-none"
-      :class="borderColors[submitterIndex]"
+      :class="field.type === 'heading' ? '' : borderColors[submitterIndex]"
     />
     <div
       v-if="field.type === 'cells' && (isSelected || isDraw)"
@@ -19,7 +19,7 @@
         v-for="(cellW, index) in cells"
         :key="index"
         class="absolute top-0 bottom-0 border-r"
-        :class="borderColors[submitterIndex]"
+        :class="field.type === 'heading' ? '' : borderColors[submitterIndex]"
         :style="{ left: (cellW / area.w * 100) + '%' }"
       >
         <span
@@ -31,14 +31,14 @@
       </div>
     </div>
     <div
-      v-if="field?.type"
-      class="absolute bg-white rounded-t border overflow-visible whitespace-nowrap group-hover:flex group-hover:z-10"
-      :class="{ 'flex z-10': isNameFocus || isSelected, invisible: !isNameFocus && !isSelected }"
+      v-if="field?.type && (isSelected || isNameFocus)"
+      class="absolute bg-white rounded-t border overflow-visible whitespace-nowrap flex z-10"
       style="top: -25px; height: 25px"
       @mousedown.stop
       @pointerdown.stop
     >
       <FieldSubmitter
+        v-if="field.type != 'heading'"
         v-model="field.submitter_uuid"
         class="border-r"
         :compact="true"
@@ -61,7 +61,7 @@
       <span
         v-if="field.type !== 'checkbox' || field.name"
         ref="name"
-        :contenteditable="editable && !defaultField"
+        :contenteditable="editable && !defaultField && field.type !== 'heading'"
         dir="auto"
         class="pr-1 cursor-text outline-none block"
         style="min-width: 2px"
@@ -71,11 +71,11 @@
         @blur="onNameBlur"
       >{{ optionIndexText }} {{ (defaultField ? (field.title || field.name) : field.name) || defaultName }}</span>
       <div
-        v-if="isSettingsFocus || isContenteditable || (isNameFocus && !['checkbox', 'phone'].includes(field.type))"
+        v-if="isSettingsFocus || (isValueInput && field.type !== 'heading') || (isNameFocus && !['checkbox', 'phone'].includes(field.type))"
         class="flex items-center ml-1.5"
       >
         <input
-          v-if="!isContenteditable"
+          v-if="!isValueInput"
           :id="`required-checkbox-${field.uuid}`"
           v-model="field.required"
           type="checkbox"
@@ -83,14 +83,14 @@
           @mousedown.prevent
         >
         <label
-          v-if="!isContenteditable"
+          v-if="!isValueInput"
           :for="`required-checkbox-${field.uuid}`"
           class="label text-xs"
           @click.prevent="field.required = !field.required"
           @mousedown.prevent
         >{{ t('required') }}</label>
         <input
-          v-if="isContenteditable"
+          v-if="isValueInput"
           :id="`readonly-checkbox-${field.uuid}`"
           type="checkbox"
           class="checkbox checkbox-xs no-animation rounded"
@@ -99,14 +99,14 @@
           @mousedown.prevent
         >
         <label
-          v-if="isContenteditable"
+          v-if="isValueInput"
           :for="`readonly-checkbox-${field.uuid}`"
           class="label text-xs"
           @click.prevent="field.readonly = !(field.readonly ?? true)"
           @mousedown.prevent
         >{{ t('editable') }}</label>
         <span
-          v-if="field.type !== 'payment' && !isContenteditable"
+          v-if="field.type !== 'payment' && !isValueInput"
           class="dropdown dropdown-end"
           @mouseenter="renderDropdown = true"
           @touchstart="renderDropdown = true"
@@ -157,18 +157,20 @@
       </button>
     </div>
     <div
+      ref="touchValueTarget"
       class="flex items-center h-full w-full"
       dir="auto"
-      :class="[isContenteditable ? 'bg-opacity-50' : 'bg-opacity-80', bgColors[submitterIndex], isDefaultValuePresent || isContenteditable ? (alignClasses[field.preferences?.align] || '') : 'justify-center']"
+      :class="[isValueInput ? 'bg-opacity-50' : 'bg-opacity-80', field.type === 'heading' ? 'bg-gray-50' : bgColors[submitterIndex], isDefaultValuePresent || isValueInput || (withFieldPlaceholder && field.areas) ? (alignClasses[field.preferences?.align] || '') : 'justify-center']"
+      @click="focusValueInput"
     >
       <span
         v-if="field"
-        class="flex justify-center items-center space-x-1 h-full"
-        :class="{ 'w-full h-full': ['cells', 'checkbox'].includes(field.type) }"
+        class="flex justify-center items-center space-x-1"
+        :class="{ 'w-full': ['cells', 'checkbox'].includes(field.type), 'h-full': !isValueInput }"
       >
         <div
-          v-if="isDefaultValuePresent || isContenteditable"
-          :class="{ 'w-full h-full': ['cells', 'checkbox'].includes(field.type), 'text-[1.5vw] lg:text-base': !textOverflowChars, 'text-[1.0vw] lg:text-xs': textOverflowChars }"
+          v-if="isDefaultValuePresent || isValueInput || (withFieldPlaceholder && field.areas && field.type !== 'checkbox')"
+          :class="{ 'w-full h-full': ['cells', 'checkbox'].includes(field.type), 'text-[1.6vw] lg:text-base': !textOverflowChars, 'text-[1.0vw] lg:text-xs': textOverflowChars }"
         >
           <div
             ref="textContainer"
@@ -181,7 +183,7 @@
               :class="{ '!w-auto !h-full': area.w > area.h, '!w-full !h-auto': area.w <= area.h }"
             />
             <span
-              v-else-if="field.type === 'number' && !isContenteditable"
+              v-else-if="field.type === 'number' && !isValueInput && (field.default_value || field.default_value == 0)"
               class="whitespace-pre-wrap"
             >{{ formatNumber(field.default_value, field.preferences?.format) }}</span>
             <span
@@ -205,13 +207,13 @@
             <span
               v-else
               ref="defaultValue"
-              :contenteditable="isContenteditable"
+              :contenteditable="isValueInput"
               class="whitespace-pre-wrap outline-none empty:before:content-[attr(placeholder)] before:text-gray-400"
-              :class="{ 'cursor-text': isContenteditable }"
-              :placeholder="t('type_value')"
+              :class="{ 'cursor-text': isValueInput }"
+              :placeholder="withFieldPlaceholder && !isValueInput ? field.name || defaultName : t('type_value')"
               @blur="onDefaultValueBlur"
               @paste.prevent="onPaste"
-              @keydown.enter.prevent="onDefaultValueEnter"
+              @keydown.enter="onDefaultValueEnter"
             >{{ field.default_value }}</span>
           </div>
         </div>
@@ -225,11 +227,12 @@
       </span>
     </div>
     <div
-      v-if="!isContenteditable"
+      v-if="!isValueInput"
       ref="touchTarget"
       class="absolute top-0 bottom-0 right-0 left-0"
       :class="isDragged ? 'cursor-grab' : 'cursor-pointer'"
       @dblclick="maybeToggleDefaultValue"
+      @click="maybeToggleCheckboxValue"
     />
     <span
       v-if="field?.type && editable"
@@ -302,6 +305,11 @@ export default {
       type: Object,
       required: true
     },
+    inputMode: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
     isDraw: {
       type: Boolean,
       required: false,
@@ -312,6 +320,11 @@ export default {
       required: false,
       default: null
     },
+    withFieldPlaceholder: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
     defaultSubmitters: {
       type: Array,
       required: false,
@@ -355,6 +368,9 @@ export default {
         return this.field?.default_value || this.field?.default_value === 0
       }
     },
+    isValueInput () {
+      return (this.field.type === 'heading' && this.isSelected) || this.isContenteditable || (this.inputMode && ['text', 'number', 'date'].includes(this.field.type))
+    },
     modalContainerEl () {
       return this.$el.getRootNode().querySelector('#docuseal_modal_container')
     },
@@ -481,16 +497,7 @@ export default {
       if (['text', 'number'].includes(this.field.type)) {
         this.isContenteditable = true
 
-        this.$nextTick(() => {
-          this.$refs.defaultValue.focus()
-
-          if (this.$refs.defaultValue.innerText.length) {
-            window.getSelection().collapse(
-              this.$refs.defaultValue.firstChild,
-              this.$refs.defaultValue.innerText.length
-            )
-          }
-        })
+        this.$nextTick(() => this.focusValueInput())
       } else if (this.field.type === 'checkbox') {
         this.field.readonly = !this.field.readonly
         this.field.default_value === true ? delete this.field.default_value : this.field.default_value = true
@@ -503,6 +510,26 @@ export default {
         this.save()
       }
     },
+    maybeToggleCheckboxValue () {
+      if (this.inputMode && this.field.type === 'checkbox') {
+        this.field.readonly = !this.field.readonly
+        this.field.default_value === true ? delete this.field.default_value : this.field.default_value = true
+
+        this.save()
+      }
+    },
+    focusValueInput (e) {
+      if (this.$refs.defaultValue !== document.activeElement) {
+        this.$refs.defaultValue.focus()
+
+        if (this.$refs.defaultValue.innerText.length && this.$refs.defaultValue !== e?.target) {
+          window.getSelection().collapse(
+            this.$refs.defaultValue.firstChild,
+            this.$refs.defaultValue.innerText.length
+          )
+        }
+      }
+    },
     formatNumber (number, format) {
       if (format === 'comma') {
         return new Intl.NumberFormat('en-US').format(number)
@@ -548,7 +575,7 @@ export default {
     onPaste (e) {
       const text = (e.clipboardData || window.clipboardData).getData('text/plain')
 
-      const selection = window.getSelection()
+      const selection = this.$el.getRootNode().getSelection()
 
       if (selection.rangeCount) {
         selection.deleteFromDocument()
@@ -572,6 +599,10 @@ export default {
         delete this.field.options
       }
 
+      if (['heading'].includes(this.field.type)) {
+        this.field.readonly = true
+      }
+
       if (['select', 'multiple', 'radio'].includes(this.field.type)) {
         this.field.options ||= [{ value: '', uuid: v4() }]
       }
@@ -633,7 +664,11 @@ export default {
       this.save()
     },
     onDefaultValueEnter (e) {
-      this.$refs.defaultValue.blur()
+      if (this.field.type !== 'heading') {
+        e.preventDefault()
+
+        this.$refs.defaultValue.blur()
+      }
     },
     onNameEnter (e) {
       this.$refs.name.blur()
@@ -652,24 +687,8 @@ export default {
         this.area.y = (e.offsetY - this.dragFrom.y) / e.target.clientHeight
       }
     },
-    startDrag (e) {
-      this.selectedAreaRef.value = this.area
-
-      if (!this.editable) {
-        return
-      }
-
-      const rect = e.target.getBoundingClientRect()
-
-      this.dragFrom = { x: e.clientX - rect.left, y: e.clientY - rect.top }
-
-      this.$el.getRootNode().addEventListener('mousemove', this.drag)
-      this.$el.getRootNode().addEventListener('mouseup', this.stopDrag)
-
-      this.$emit('start-drag')
-    },
     startTouchDrag (e) {
-      if (e.target !== this.$refs.touchTarget) {
+      if (e.target !== this.$refs.touchTarget && e.target !== this.$refs.touchValueTarget) {
         return
       }
 
@@ -714,11 +733,13 @@ export default {
       this.$emit('stop-drag')
     },
     startMouseMove (e) {
-      if (e.target !== this.$refs.touchTarget) {
+      if (e.target !== this.$refs.touchTarget && e.target !== this.$refs.touchValueTarget) {
         return
       }
 
-      document.activeElement?.blur()
+      if (document.activeElement !== this.$refs.defaultValue) {
+        document.activeElement?.blur()
+      }
 
       e.preventDefault()
 
@@ -728,6 +749,10 @@ export default {
 
       this.selectedAreaRef.value = this.area
 
+      if (this.field.type === 'heading') {
+        this.$nextTick(() => this.focusValueInput())
+      }
+
       this.dragFrom = { x: rect.left - e.clientX, y: rect.top - e.clientY }
 
       this.$el.getRootNode().addEventListener('mousemove', this.mouseMove)

app/javascript/template_builder/builder.vue

@@ -177,7 +177,7 @@
           @change="save"
         />
         <div
-          class="sticky bottom-0 py-2"
+          class="sticky bottom-0 py-2 space-y-2"
           :style="{ backgroundColor }"
         >
           <Upload
@@ -186,6 +186,22 @@
             :template-id="template.id"
             @success="updateFromUpload"
           />
+          <button
+            v-if="sortedDocuments.length && editable && withAddPageButton"
+            id="add_blank_page_button"
+            class="btn btn-outline w-full"
+            @click.prevent="addBlankPage"
+          >
+            <IconInnerShadowTop
+              v-if="isLoadingBlankPage"
+              class="animate-spin w-5 h-5"
+            />
+            <IconPlus
+              v-else
+              class="w-5 h-5"
+            />
+            {{ t('add_blank_page') }}
+          </button>
         </div>
       </div>
       <div
@@ -196,12 +212,30 @@
           ref="documents"
           class="pr-3.5 pl-0.5"
         >
-          <Dropzone
-            v-if="!sortedDocuments.length && withUploadButton"
-            :template-id="template.id"
-            :accept-file-types="acceptFileTypes"
-            @success="updateFromUpload"
-          />
+          <template v-if="!sortedDocuments.length && (withUploadButton || withAddPageButton)">
+            <Dropzone
+              v-if="withUploadButton"
+              :template-id="template.id"
+              :accept-file-types="acceptFileTypes"
+              @success="updateFromUpload"
+            />
+            <button
+              v-if="withAddPageButton"
+              id="add_blank_page_button"
+              class="btn btn-outline w-full mt-4"
+              @click.prevent="addBlankPage"
+            >
+              <IconInnerShadowTop
+                v-if="isLoadingBlankPage"
+                class="animate-spin w-5 h-5"
+              />
+              <IconPlus
+                v-else
+                class="w-5 h-5"
+              />
+              {{ t('add_blank_page') }}
+            </button>
+          </template>
           <template v-else>
             <template
               v-for="document in sortedDocuments"
@@ -213,9 +247,11 @@
                 :selected-submitter="selectedSubmitter"
                 :document="document"
                 :is-drag="!!dragField"
+                :input-mode="inputMode"
                 :default-fields="[...defaultRequiredFields, ...defaultFields]"
                 :allow-draw="!onlyDefinedFields"
                 :default-submitters="defaultSubmitters"
+                :with-field-placeholder="withFieldPlaceholder"
                 :draw-field="drawField"
                 :draw-field-type="drawFieldType"
                 :editable="editable"
@@ -242,7 +278,7 @@
             </template>
             <div
               v-if="sortedDocuments.length && isBreakpointLg && editable"
-              class="pb-4"
+              class="pb-4 space-y-2"
             >
               <Upload
                 v-if="withUploadButton"
@@ -250,6 +286,22 @@
                 :accept-file-types="acceptFileTypes"
                 @success="updateFromUpload"
               />
+              <button
+                v-if="withAddPageButton"
+                id="add_blank_page_button"
+                class="btn btn-outline w-full mt-4"
+                @click.prevent="addBlankPage"
+              >
+                <IconInnerShadowTop
+                  v-if="isLoadingBlankPage"
+                  class="animate-spin w-5 h-5"
+                />
+                <IconPlus
+                  v-else
+                  class="w-5 h-5"
+                />
+                {{ t('add_blank_page') }}
+              </button>
             </div>
           </template>
         </div>
@@ -277,7 +329,7 @@
                 {{ t('cancel') }}
               </button>
               <a
-                v-if="!drawField && !drawOption && !['stamp', 'signature', 'initials'].includes(drawField?.type || drawFieldType)"
+                v-if="!drawField && !drawOption && !['stamp', 'signature', 'initials', 'heading'].includes(drawField?.type || drawFieldType)"
                 href="#"
                 class="link block mt-3 text-sm"
                 @click.prevent="[addField(drawFieldType), drawField = null, drawOption = null, withSelectedFieldType ? '' : drawFieldType = '', showDrawField = false]"
@@ -350,7 +402,7 @@ import Contenteditable from './contenteditable'
 import DocumentPreview from './preview'
 import DocumentControls from './controls'
 import MobileFields from './mobile_fields'
-import { IconUsersPlus, IconDeviceFloppy, IconChevronDown, IconEye, IconWritingSign, IconInnerShadowTop, IconInfoCircle } from '@tabler/icons-vue'
+import { IconPlus, IconUsersPlus, IconDeviceFloppy, IconChevronDown, IconEye, IconWritingSign, IconInnerShadowTop, IconInfoCircle } from '@tabler/icons-vue'
 import { v4 } from 'uuid'
 import { ref, computed } from 'vue'
 import { en as i18nEn } from './i18n'
@@ -363,6 +415,7 @@ export default {
     Fields,
     IconInfoCircle,
     MobileDrawField,
+    IconPlus,
     IconWritingSign,
     MobileFields,
     Logo,
@@ -405,6 +458,11 @@ export default {
       required: false,
       default: () => ({})
     },
+    withFieldPlaceholder: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
     backgroundColor: {
       type: String,
       required: false,
@@ -415,11 +473,21 @@ export default {
       required: false,
       default: true
     },
+    inputMode: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
     withHelp: {
       type: Boolean,
       required: false,
       default: true
     },
+    withAddPageButton: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
     autosave: {
       type: Boolean,
       required: false,
@@ -566,6 +634,7 @@ export default {
     return {
       documentRefs: [],
       isBreakpointLg: false,
+      isLoadingBlankPage: false,
       isSaving: false,
       selectedSubmitter: null,
       showDrawField: false,
@@ -1063,7 +1132,7 @@ export default {
           field.options = [{ value: '', uuid: v4() }]
         }
 
-        if (field.type === 'stamp') {
+        if (['stamp', 'heading'].includes(field.type)) {
           field.readonly = true
         }
 
@@ -1147,6 +1216,44 @@ export default {
       this.save()
 
       document.activeElement?.blur()
+
+      if (field.type === 'heading') {
+        this.$nextTick(() => {
+          const documentRef = this.documentRefs.find((e) => e.document.uuid === area.attachment_uuid)
+          const areaRef = documentRef.pageRefs[area.page].areaRefs.find((ref) => ref.area === this.selectedAreaRef.value)
+
+          areaRef.focusValueInput()
+        })
+      }
+    },
+    addBlankPage () {
+      this.isLoadingBlankPage = true
+
+      const canvas = document.createElement('canvas')
+
+      canvas.width = 816
+      canvas.height = 1056
+
+      const ctx = canvas.getContext('2d')
+
+      ctx.fillStyle = 'white'
+      ctx.fillRect(0, 0, canvas.width, canvas.height)
+
+      canvas.toBlob((blob) => {
+        const file = new File([blob], `Page ${this.template.schema.length + 1}.png`, { type: blob.type, lastModified: Date.now() })
+
+        const formData = new FormData()
+        formData.append('files[]', file)
+
+        this.baseFetch(`/templates/${this.template.id}/documents`, {
+          method: 'POST',
+          body: formData
+        }).then(async (resp) => {
+          this.updateFromUpload(await resp.json())
+        }).finally(() => {
+          this.isLoadingBlankPage = false
+        })
+      }, 'image/png')
     },
     updateFromUpload (data) {
       this.template.schema.push(...data.schema)

app/javascript/template_builder/contenteditable.vue

@@ -101,7 +101,7 @@ export default {
     onPaste (e) {
       const text = (e.clipboardData || window.clipboardData).getData('text/plain')
 
-      const selection = window.getSelection()
+      const selection = this.$el.getRootNode().getSelection()
 
       if (selection.rangeCount) {
         selection.deleteFromDocument()

app/javascript/template_builder/document.vue

@@ -4,11 +4,13 @@
       v-for="(image, index) in sortedPreviewImages"
       :key="image.id"
       :ref="setPageRefs"
+      :input-mode="inputMode"
       :number="index"
       :editable="editable"
       :areas="areasIndex[index]"
       :allow-draw="allowDraw"
       :is-drag="isDrag"
+      :with-field-placeholder="withFieldPlaceholder"
       :default-fields="defaultFields"
       :default-submitters="defaultSubmitters"
       :draw-field="drawField"
@@ -35,6 +37,11 @@ export default {
       type: Object,
       required: true
     },
+    inputMode: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
     areasIndex: {
       type: Object,
       required: false,
@@ -45,6 +52,11 @@ export default {
       required: false,
       default: () => []
     },
+    withFieldPlaceholder: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
     drawFieldType: {
       type: String,
       required: false,

app/javascript/template_builder/dropzone.vue

@@ -5,6 +5,7 @@
     @drop.prevent="onDropFiles"
   >
     <label
+      id="document_dropzone"
       class="w-full relative hover:bg-base-200/30 rounded-md border border-2 border-base-content/10 border-dashed"
       :for="inputId"
       :class="{ 'opacity-50': isLoading || isProcessing }"

app/javascript/template_builder/field.vue

@@ -14,7 +14,7 @@
         <div class="flex items-center p-1 space-x-1">
           <FieldType
             v-model="field.type"
-            :editable="editable && !defaultField"
+            :editable="editable && !defaultField && field.type != 'heading'"
             :button-width="20"
             :menu-classes="'mt-1.5'"
             :menu-style="{ backgroundColor: dropdownBgColor }"
@@ -24,7 +24,7 @@
           <Contenteditable
             ref="name"
             :model-value="(defaultField ? (field.title || field.name) : field.name) || defaultName"
-            :editable="editable && !defaultField"
+            :editable="editable && !defaultField && field.type != 'heading'"
             :icon-inline="true"
             :icon-width="18"
             :icon-stroke-width="1.6"
@@ -94,9 +94,10 @@
             :field="field"
             @click-condition="isShowConditionsModal = true"
             @click-description="isShowDescriptionModal = true"
+            @click-formula="isShowFormulaModal = true"
           />
           <span
-            v-else
+            v-else-if="field.type !== 'heading'"
             class="dropdown dropdown-end"
             @mouseenter="renderDropdown = true"
             @touchstart="renderDropdown = true"
@@ -345,7 +346,7 @@ export default {
   },
   methods: {
     buildDefaultName (field, fields) {
-      if (field.type === 'payment' && field.preferences?.price) {
+      if (field.type === 'payment' && field.preferences?.price && !field.preferences?.formula) {
         const { price, currency } = field.preferences || {}
 
         const formattedPrice = new Intl.NumberFormat([], {
@@ -357,9 +358,12 @@ export default {
       } else {
         const typeIndex = fields.filter((f) => f.type === field.type).indexOf(field)
 
-        const suffix = { multiple: this.t('select'), radio: this.t('group') }[field.type] || this.t('field')
-
-        return `${this.fieldNames[field.type]} ${suffix} ${typeIndex + 1}`
+        if (this.field.type === 'heading') {
+          return `${this.fieldNames[field.type]} ${typeIndex + 1}`
+        } else {
+          const suffix = { multiple: this.t('select'), radio: this.t('group') }[field.type] || this.t('field')
+          return `${this.fieldNames[field.type]} ${suffix} ${typeIndex + 1}`
+        }
       }
     },
     onNameFocus (e) {
@@ -417,6 +421,10 @@ export default {
         this.field.options ||= [{ value: '', uuid: v4() }]
       }
 
+      if (['heading'].includes(this.field.type)) {
+        this.field.readonly = true
+      }
+
       (this.field.areas || []).forEach((area) => {
         if (this.field.type === 'cells') {
           area.cell_w = area.w * 2 / Math.floor(area.w / area.h)

app/javascript/template_builder/field_type.vue

@@ -51,7 +51,7 @@
 </template>
 
 <script>
-import { IconTextSize, IconWritingSign, IconCalendarEvent, IconPhoto, IconCheckbox, IconPaperclip, IconSelect, IconCircleDot, IconChecks, IconColumns3, IconPhoneCheck, IconLetterCaseUpper, IconCreditCard, IconRubberStamp, IconSquareNumber1 } from '@tabler/icons-vue'
+import { IconTextSize, IconWritingSign, IconCalendarEvent, IconPhoto, IconCheckbox, IconPaperclip, IconSelect, IconCircleDot, IconChecks, IconColumns3, IconPhoneCheck, IconLetterCaseUpper, IconCreditCard, IconRubberStamp, IconSquareNumber1, IconHeading } from '@tabler/icons-vue'
 
 export default {
   name: 'FiledTypeDropdown',
@@ -96,6 +96,7 @@ export default {
   computed: {
     fieldNames () {
       return {
+        heading: this.t('heading'),
         text: this.t('text'),
         signature: this.t('signature'),
         initials: this.t('initials'),
@@ -115,6 +116,7 @@ export default {
     },
     fieldIcons () {
       return {
+        heading: IconHeading,
         text: IconTextSize,
         signature: IconWritingSign,
         initials: IconLetterCaseUpper,
@@ -140,7 +142,7 @@ export default {
           return acc
         }, {})
       } else {
-        return this.fieldIcons
+        return Object.fromEntries(Object.entries(this.fieldIcons).filter(([key]) => key !== 'heading'))
       }
     }
   },

app/javascript/template_builder/fields.vue

@@ -277,7 +277,7 @@ export default {
           return acc
         }, {})
       } else {
-        return this.fieldIcons
+        return Object.fromEntries(Object.entries(this.fieldIcons).filter(([key]) => key !== 'heading'))
       }
     },
     submitterFields () {

app/javascript/template_builder/formula_modal.vue

@@ -204,7 +204,10 @@ export default {
         alert('Some fields are missing in the formula.')
       } else {
         this.field.preferences.formula = normalizedFormula
-        this.field.readonly = !!normalizedFormula
+
+        if (this.field.type !== 'payment') {
+          this.field.readonly = !!normalizedFormula
+        }
 
         this.save()
 

app/javascript/template_builder/i18n.js

@@ -8,13 +8,16 @@ const en = {
   uploaded_pdf_contains_form_fields_keep_or_remove_them: 'Uploaded PDF contains form fields. Keep or remove them?',
   keep: 'Keep',
   left: 'Left',
+  heading: 'Heading',
   validation: 'Validation',
+  add_blank_page: 'Add blank page',
   right: 'Right',
   center: 'Center',
   description: 'Description',
   display_title: 'Display title',
   with_logo: 'With logo',
   unchecked: 'Unchecked',
+  price: 'Price',
   type_value: 'Type value',
   equal: 'Equal',
   not_equal: 'Not equal',

app/javascript/template_builder/page.vue

@@ -21,8 +21,10 @@
         :key="i"
         :ref="setAreaRefs"
         :area="item.area"
+        :input-mode="inputMode"
         :field="item.field"
         :editable="editable"
+        :with-field-placeholder="withFieldPlaceholder"
         :default-field="defaultFields.find((f) => f.name === item.field.name)"
         :default-submitters="defaultSubmitters"
         @start-resize="resizeDirection = $event"
@@ -71,11 +73,21 @@ export default {
       required: false,
       default: () => []
     },
+    inputMode: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
     defaultFields: {
       type: Array,
       required: false,
       default: () => []
     },
+    withFieldPlaceholder: {
+      type: Boolean,
+      required: false,
+      default: false
+    },
     drawFieldType: {
       type: String,
       required: false,

app/javascript/template_builder/payment_settings.vue

@@ -1,7 +1,7 @@
 <template>
   <span
     class="dropdown dropdown-end"
-    :class="{ 'dropdown-open': (!field.preferences?.price || !isConnected) && !isLoading }"
+    :class="{ 'dropdown-open': ((!field.preferences?.price && !field.preferences?.formula) || !isConnected) && !isLoading }"
   >
     <label
       tabindex="0"
@@ -26,7 +26,7 @@
       >
         <select
           v-model="field.preferences.currency"
-          placeholder="Price"
+          :placeholder="t('price')"
           class="select select-bordered select-xs font-normal w-full max-w-xs !h-7 !outline-0"
           @change="save"
         >
@@ -51,14 +51,23 @@
         @click.stop
       >
         <input
+          v-if="field.preferences.formula"
+          type="number"
+          :placeholder="t('price')"
+          disabled="true"
+          class="input input-bordered input-xs w-full max-w-xs h-7 !outline-0"
+          @blur="save"
+        >
+        <input
+          v-else
           v-model="field.preferences.price"
           type="number"
-          placeholder="Price"
+          :placeholder="t('price')"
           class="input input-bordered input-xs w-full max-w-xs h-7 !outline-0"
           @blur="save"
         >
         <label
-          v-if="field.preferences.price"
+          v-if="field.preferences.price && !field.preferences.formula"
           :style="{ backgroundColor: backgroundColor }"
           class="absolute -top-1 left-2.5 px-1 h-4"
           style="font-size: 8px"
@@ -149,8 +158,21 @@
           data-turbo="false"
         >Learn more</a>
       </div>
+      <li class="mb-1">
+        <label
+          class="label-text cursor-pointer text-center w-full flex items-center"
+          @click="$emit('click-formula')"
+        >
+          <IconMathFunction
+            width="18"
+          />
+          <span class="text-sm">
+            {{ t('formula') }}
+          </span>
+        </label>
+      </li>
       <hr>
-      <li class="mt-1">
+      <li>
         <label
           class="label-text cursor-pointer text-center w-full flex items-center"
           @click="$emit('click-description')"
@@ -181,7 +203,7 @@
 </template>
 
 <script>
-import { IconSettings, IconCircleCheck, IconInfoCircle, IconBrandStripe, IconInnerShadowTop, IconRouteAltLeft } from '@tabler/icons-vue'
+import { IconMathFunction, IconSettings, IconCircleCheck, IconInfoCircle, IconBrandStripe, IconInnerShadowTop, IconRouteAltLeft } from '@tabler/icons-vue'
 import { ref } from 'vue'
 
 const isConnected = ref(false)
@@ -193,6 +215,7 @@ export default {
     IconCircleCheck,
     IconRouteAltLeft,
     IconInfoCircle,
+    IconMathFunction,
     IconInnerShadowTop,
     IconBrandStripe
   },
@@ -203,7 +226,7 @@ export default {
       required: true
     }
   },
-  emits: ['click-condition', 'click-description'],
+  emits: ['click-condition', 'click-description', 'click-formula'],
   data () {
     return {
       isLoading: false

app/javascript/template_builder/upload.vue

@@ -1,6 +1,7 @@
 <template>
   <div>
     <label
+      id="add_document_button"
       :for="inputId"
       class="btn btn-outline w-full"
       :class="{ 'btn-disabled': isLoading || isProcessing }"

app/jobs/process_submitter_completion_job.rb

@@ -20,9 +20,25 @@ class ProcessSubmitterCompletionJob
       enqueue_completed_emails(submitter)
     end
 
-    return if Accounts.load_webhook_url(submitter.account).blank?
+    enqueue_completed_webhooks(submitter)
+  end
 
-    SendFormCompletedWebhookRequestJob.perform_async({ 'submitter_id' => submitter.id })
+  def enqueue_completed_webhooks(submitter)
+    webhook_config = Accounts.load_webhook_config(submitter.account)
+
+    if webhook_config
+      SendFormCompletedWebhookRequestJob.perform_async({ 'submitter_id' => submitter.id,
+                                                         'encrypted_config_id' => webhook_config.id })
+    end
+
+    webhook_ids = submitter.account.webhook_urls.where(
+      Arel::Table.new(:webhook_urls)[:events].matches('%"form.completed"%')
+    ).pluck(:id)
+
+    webhook_ids.each do |webhook_id|
+      SendFormCompletedWebhookRequestJob.perform_async({ 'submitter_id' => submitter.id,
+                                                         'webhook_url_id' => webhook_id })
+    end
   end
 
   def enqueue_completed_emails(submitter)

app/jobs/send_form_completed_webhook_request_job.rb

@@ -13,14 +13,11 @@ class SendFormCompletedWebhookRequestJob
     submitter = Submitter.find(params['submitter_id'])
 
     attempt = params['attempt'].to_i
-    url = Accounts.load_webhook_url(submitter.submission.account)
+
+    url, secret = load_url_and_secret(submitter, params)
 
     return if url.blank?
 
-    preferences = Accounts.load_webhook_preferences(submitter.submission.account)
-
-    return if preferences['form.completed'] == false
-
     Submissions::EnsureResultGenerated.call(submitter)
 
     ActiveStorage::Current.url_options = Docuseal.default_url_options
@@ -32,6 +29,7 @@ class SendFormCompletedWebhookRequestJob
                      timestamp: Time.current,
                      data: Submitters::SerializeForWebhook.call(submitter)
                    }.to_json,
+                   **secret.to_h,
                    'Content-Type' => 'application/json',
                    'User-Agent' => USER_AGENT)
     rescue Faraday::Error
@@ -41,10 +39,33 @@ class SendFormCompletedWebhookRequestJob
     if (resp.nil? || resp.status.to_i >= 400) && attempt <= MAX_ATTEMPTS &&
        (!Docuseal.multitenant? || submitter.account.account_configs.exists?(key: :plan))
       SendFormCompletedWebhookRequestJob.perform_in((2**attempt).minutes, {
-                                                      'submitter_id' => submitter.id,
+                                                      **params,
                                                       'attempt' => attempt + 1,
                                                       'last_status' => resp&.status.to_i
                                                     })
     end
   end
+
+  def load_url_and_secret(submitter, params)
+    if params['encrypted_config_id']
+      config = EncryptedConfig.find(params['encrypted_config_id'])
+
+      url = config.value
+
+      return if url.blank?
+
+      preferences = Accounts.load_webhook_preferences(submitter.submission.account)
+
+      return if preferences['form.completed'] == false
+
+      secret = EncryptedConfig.find_or_initialize_by(account_id: config.account_id,
+                                                     key: EncryptedConfig::WEBHOOK_SECRET_KEY)&.value.to_h
+
+      [url, secret]
+    elsif params['webhook_url_id']
+      webhook_url = submitter.account.webhook_urls.find(params['webhook_url_id'])
+
+      webhook_url.url if webhook_url.events.include?('form.completed')
+    end
+  end
 end

app/jobs/send_form_started_webhook_request_job.rb

@@ -13,7 +13,8 @@ class SendFormStartedWebhookRequestJob
     submitter = Submitter.find(params['submitter_id'])
 
     attempt = params['attempt'].to_i
-    url = Accounts.load_webhook_url(submitter.submission.account)
+    config = Accounts.load_webhook_config(submitter.submission.account)
+    url = config&.value.presence
 
     return if url.blank?
 
@@ -30,6 +31,8 @@ class SendFormStartedWebhookRequestJob
                      timestamp: Time.current,
                      data: Submitters::SerializeForWebhook.call(submitter)
                    }.to_json,
+                   **EncryptedConfig.find_or_initialize_by(account_id: config.account_id,
+                                                           key: EncryptedConfig::WEBHOOK_SECRET_KEY)&.value.to_h,
                    'Content-Type' => 'application/json',
                    'User-Agent' => USER_AGENT)
     rescue Faraday::Error

app/jobs/send_form_viewed_webhook_request_job.rb

@@ -13,7 +13,8 @@ class SendFormViewedWebhookRequestJob
     submitter = Submitter.find(params['submitter_id'])
 
     attempt = params['attempt'].to_i
-    url = Accounts.load_webhook_url(submitter.submission.account)
+    config = Accounts.load_webhook_config(submitter.submission.account)
+    url = config&.value.presence
 
     return if url.blank?
 
@@ -30,6 +31,8 @@ class SendFormViewedWebhookRequestJob
                      timestamp: Time.current,
                      data: Submitters::SerializeForWebhook.call(submitter)
                    }.to_json,
+                   **EncryptedConfig.find_or_initialize_by(account_id: config.account_id,
+                                                           key: EncryptedConfig::WEBHOOK_SECRET_KEY)&.value.to_h,
                    'Content-Type' => 'application/json',
                    'User-Agent' => USER_AGENT)
     rescue Faraday::Error

app/jobs/send_submission_archived_webhook_request_job.rb

@@ -13,7 +13,9 @@ class SendSubmissionArchivedWebhookRequestJob
     submission = Submission.find(params['submission_id'])
 
     attempt = params['attempt'].to_i
-    url = Accounts.load_webhook_url(submission.account)
+
+    config = Accounts.load_webhook_config(submission.account)
+    url = config&.value.presence
 
     return if url.blank?
 
@@ -28,6 +30,8 @@ class SendSubmissionArchivedWebhookRequestJob
                      timestamp: Time.current,
                      data: submission.as_json(only: %i[id archived_at])
                    }.to_json,
+                   **EncryptedConfig.find_or_initialize_by(account_id: config.account_id,
+                                                           key: EncryptedConfig::WEBHOOK_SECRET_KEY)&.value.to_h,
                    'Content-Type' => 'application/json',
                    'User-Agent' => USER_AGENT)
     rescue Faraday::Error

app/jobs/send_submission_created_webhook_request_job.rb

@@ -13,7 +13,9 @@ class SendSubmissionCreatedWebhookRequestJob
     submission = Submission.find(params['submission_id'])
 
     attempt = params['attempt'].to_i
-    url = Accounts.load_webhook_url(submission.account)
+
+    config = Accounts.load_webhook_config(submission.account)
+    url = config&.value.presence
 
     return if url.blank?
 
@@ -28,6 +30,8 @@ class SendSubmissionCreatedWebhookRequestJob
                      timestamp: Time.current,
                      data: Submissions::SerializeForApi.call(submission)
                    }.to_json,
+                   **EncryptedConfig.find_or_initialize_by(account_id: config.account_id,
+                                                           key: EncryptedConfig::WEBHOOK_SECRET_KEY)&.value.to_h,
                    'Content-Type' => 'application/json',
                    'User-Agent' => USER_AGENT)
     rescue Faraday::Error

app/jobs/send_submitter_invitation_email_job.rb

@@ -6,11 +6,7 @@ class SendSubmitterInvitationEmailJob
   def perform(params = {})
     submitter = Submitter.find(params['submitter_id'])
 
-    if submitter.submission.source == 'invite' && !Accounts.can_send_emails?(submitter.account, on_events: true)
-      Rollbar.error("Skip email: #{submitter.id}") if defined?(Rollbar)
-
-      return
-    end
+    return if submitter.submission.source == 'invite' && !Accounts.can_send_emails?(submitter.account, on_events: true)
 
     mail = SubmitterMailer.invitation_email(submitter)
 

app/jobs/send_template_created_webhook_request_job.rb

@@ -13,7 +13,9 @@ class SendTemplateCreatedWebhookRequestJob
     template = Template.find(params['template_id'])
 
     attempt = params['attempt'].to_i
-    url = Accounts.load_webhook_url(template.account)
+
+    config = Accounts.load_webhook_config(template.account)
+    url = config&.value.presence
 
     return if url.blank?
 
@@ -28,6 +30,8 @@ class SendTemplateCreatedWebhookRequestJob
                      timestamp: Time.current,
                      data: Templates::SerializeForApi.call(template)
                    }.to_json,
+                   **EncryptedConfig.find_or_initialize_by(account_id: config.account_id,
+                                                           key: EncryptedConfig::WEBHOOK_SECRET_KEY)&.value.to_h,
                    'Content-Type' => 'application/json',
                    'User-Agent' => USER_AGENT)
     rescue Faraday::Error

app/jobs/send_template_updated_webhook_request_job.rb

@@ -13,7 +13,9 @@ class SendTemplateUpdatedWebhookRequestJob
     template = Template.find(params['template_id'])
 
     attempt = params['attempt'].to_i
-    url = Accounts.load_webhook_url(template.account)
+
+    config = Accounts.load_webhook_config(template.account)
+    url = config&.value.presence
 
     return if url.blank?
 
@@ -28,6 +30,8 @@ class SendTemplateUpdatedWebhookRequestJob
                      timestamp: Time.current,
                      data: Templates::SerializeForApi.call(template)
                    }.to_json,
+                   **EncryptedConfig.find_or_initialize_by(account_id: config.account_id,
+                                                           key: EncryptedConfig::WEBHOOK_SECRET_KEY)&.value.to_h,
                    'Content-Type' => 'application/json',
                    'User-Agent' => USER_AGENT)
     rescue Faraday::Error

app/mailers/submitter_mailer.rb

@@ -6,6 +6,8 @@ class SubmitterMailer < ApplicationMailer
 
   DEFAULT_INVITATION_SUBJECT = 'You are invited to submit a form'
 
+  NO_REPLY_REGEXP = /no-?reply@/i
+
   def invitation_email(submitter)
     @current_account = submitter.submission.account
     @submitter = submitter
@@ -28,12 +30,13 @@ class SubmitterMailer < ApplicationMailer
 
     assign_message_metadata('submitter_invitation', @submitter)
 
+    reply_to = build_submitter_reply_to(@submitter)
+
     mail(
       to: @submitter.friendly_name,
       from: from_address_for_submitter(submitter),
       subject:,
-      reply_to: submitter.preferences['reply_to'].presence ||
-                (submitter.submission.created_by_user || submitter.template.author)&.friendly_name&.sub(/\+\w+@/, '@')
+      reply_to:
     )
   end
 
@@ -48,8 +51,11 @@ class SubmitterMailer < ApplicationMailer
     @email_config = AccountConfigs.find_for_account(@current_account, AccountConfig::SUBMITTER_COMPLETED_EMAIL_KEY)
 
     add_completed_email_attachments!(
-      submitter, with_audit_log: (@email_config.nil? || @email_config.value['attach_audit_log'] != false) &&
-                                 @submitter.template.preferences['completed_notification_email_attach_audit'] != false
+      submitter,
+      with_documents: @email_config&.value&.dig('attach_documents') != false &&
+                      @submitter.template.preferences['completed_notification_email_attach_documents'] != false,
+      with_audit_log: @email_config&.value&.dig('attach_audit_log') != false &&
+                      @submitter.template.preferences['completed_notification_email_attach_audit'] != false
     )
 
     @subject = @submitter.template.preferences['completed_notification_email_subject'].presence
@@ -101,24 +107,34 @@ class SubmitterMailer < ApplicationMailer
 
     assign_message_metadata('submitter_documents_copy', @submitter)
 
+    reply_to = build_submitter_reply_to(submitter)
+
     mail(from: from_address_for_submitter(submitter),
          to: to || @submitter.friendly_name,
-         reply_to: @submitter.preferences['reply_to'].presence ||
-                   (@submitter.submission.created_by_user ||
-                    @submitter.template.author)&.friendly_name&.sub(/\+\w+@/, '@'),
+         reply_to:,
          subject:)
   end
 
   private
 
+  def build_submitter_reply_to(submitter)
+    reply_to =
+      submitter.preferences['reply_to'].presence ||
+      (submitter.submission.created_by_user || submitter.template.author)&.friendly_name&.sub(/\+\w+@/, '@')
+
+    return nil if reply_to.to_s.match?(NO_REPLY_REGEXP)
+
+    reply_to
+  end
+
   def build_completed_subject(submitter)
     submitters = submitter.submission.submitters.order(:completed_at)
                           .map { |e| e.name || e.email || e.phone }.join(', ')
     %(#{submitter.submission.template.name} has been completed by #{submitters})
   end
 
-  def add_completed_email_attachments!(submitter, with_audit_log: true)
-    documents = Submitters.select_attachments_for_download(submitter)
+  def add_completed_email_attachments!(submitter, with_audit_log: true, with_documents: true)
+    documents = with_documents ? Submitters.select_attachments_for_download(submitter) : []
 
     total_size = 0
     audit_trail_data = nil
@@ -133,13 +149,15 @@ class SubmitterMailer < ApplicationMailer
 
     attachments[submitter.submission.audit_trail.filename.to_s.tr('"', "'")] = audit_trail_data if audit_trail_data
 
-    file_fields = submitter.submission.template_fields.select { |e| e['type'].in?(%w[file payment]) }
+    if with_documents
+      file_fields = submitter.submission.template_fields.select { |e| e['type'].in?(%w[file payment]) }
 
-    if file_fields.pluck('submitter_uuid').uniq.size == 1
-      storage_attachments =
-        submitter.attachments.where(uuid: submitter.values.values_at(*file_fields.pluck('uuid')).flatten)
+      if file_fields.pluck('submitter_uuid').uniq.size == 1
+        storage_attachments =
+          submitter.attachments.where(uuid: submitter.values.values_at(*file_fields.pluck('uuid')).flatten)
 
-      add_attachments_with_size_limit(storage_attachments, total_size)
+        add_attachments_with_size_limit(storage_attachments, total_size)
+      end
     end
 
     documents

app/models/account.rb

@@ -32,6 +32,7 @@ class Account < ApplicationRecord
   has_many :submitters, through: :submissions
   has_many :account_linked_accounts, dependent: :destroy
   has_many :email_events, dependent: :destroy
+  has_many :webhook_urls, dependent: :destroy
   has_many :account_testing_accounts, -> { testing }, dependent: :destroy,
                                                       class_name: 'AccountLinkedAccount',
                                                       inverse_of: :account

app/models/account_config.rb

@@ -38,6 +38,7 @@ class AccountConfig < ApplicationRecord
   DOWNLOAD_LINKS_AUTH_KEY = 'download_links_auth'
   FORCE_SSO_AUTH_KEY = 'force_sso_auth'
   FLATTEN_RESULT_PDF_KEY = 'flatten_result_pdf'
+  WITH_SIGNATURE_ID = 'with_signature_id'
 
   DEFAULT_VALUES = {
     SUBMITTER_INVITATION_EMAIL_KEY => {

app/models/email_event.rb

@@ -19,6 +19,7 @@
 # Indexes
 #
 #  index_email_events_on_account_id  (account_id)
+#  index_email_events_on_email       (email)
 #  index_email_events_on_emailable   (emailable_type,emailable_id)
 #  index_email_events_on_message_id  (message_id)
 #

app/models/encrypted_config.rb

@@ -27,7 +27,8 @@ class EncryptedConfig < ApplicationRecord
     ESIGN_CERTS_KEY = 'esign_certs',
     TIMESTAMP_SERVER_URL_KEY = 'timestamp_server_url',
     APP_URL_KEY = 'app_url',
-    WEBHOOK_URL_KEY = 'webhook_url'
+    WEBHOOK_URL_KEY = 'webhook_url',
+    WEBHOOK_SECRET_KEY = 'webhook_secret'
   ].freeze
 
   belongs_to :account

app/models/submission.rb

@@ -6,6 +6,7 @@
 #
 #  id                  :bigint           not null, primary key
 #  archived_at         :datetime
+#  expire_at           :datetime
 #  preferences         :text             not null
 #  slug                :string           not null
 #  source              :text             not null
@@ -75,6 +76,10 @@ class Submission < ApplicationRecord
     preserved: 'preserved'
   }, scope: false, prefix: true
 
+  def expired?
+    expire_at && expire_at <= Time.current
+  end
+
   def audit_trail_url
     return if audit_trail.blank?
 

app/models/webhook_url.rb

@@ -0,0 +1,38 @@
+# frozen_string_literal: true
+
+# == Schema Information
+#
+# Table name: webhook_urls
+#
+#  id         :bigint           not null, primary key
+#  events     :text             not null
+#  sha1       :string           not null
+#  url        :text             not null
+#  created_at :datetime         not null
+#  updated_at :datetime         not null
+#  account_id :bigint           not null
+#
+# Indexes
+#
+#  index_webhook_urls_on_account_id  (account_id)
+#  index_webhook_urls_on_sha1        (sha1)
+#
+# Foreign Keys
+#
+#  fk_rails_...  (account_id => accounts.id)
+#
+class WebhookUrl < ApplicationRecord
+  belongs_to :account
+
+  attribute :events, :string, default: -> { [] }
+
+  serialize :events, coder: JSON
+
+  before_validation :set_sha1
+
+  encrypts :url
+
+  def set_sha1
+    self.sha1 = Digest::SHA1.hexdigest(url)
+  end
+end

app/views/accounts/show.html.erb

@@ -51,6 +51,18 @@
             </div>
           <% end %>
         <% end %>
+        <% account_config = AccountConfig.find_or_initialize_by(account: current_account, key: AccountConfig::WITH_SIGNATURE_ID) %>
+        <% if can?(:manage, account_config) %>
+          <%= form_for account_config, url: account_configs_path, method: :post do |f| %>
+            <%= f.hidden_field :key %>
+            <div class="flex items-center justify-between py-2.5">
+              <span>
+                Add signature ID to the documents
+              </span>
+              <%= f.check_box :value, class: 'toggle', checked: account_config.value, onchange: 'this.form.requestSubmit()' %>
+            </div>
+          <% end %>
+        <% end %>
         <% account_config = AccountConfig.find_or_initialize_by(account: current_account, key: AccountConfig::ALLOW_TYPED_SIGNATURE) %>
         <% if can?(:manage, account_config) %>
           <%= form_for account_config, url: account_configs_path, method: :post do |f| %>

app/views/devise/shared/_links.html.erb

@@ -14,6 +14,6 @@
     <% if params[:redir].present? %>
       <%= hidden_field_tag :redir, params[:redir] %>
     <% end %>
-    <%= select_tag :lang, options_for_select((I18n.available_locales - %i[en pt-PT de-DE fr-FR es-ES]).map { |code| [t("language_#{code}"), code] }, I18n.locale), onchange: 'this.form.requestSubmit();', class: 'select select-sm border-base-content/30 text-base' %>
+    <%= select_tag :lang, options_for_select((I18n.available_locales - %i[en pt-PT de-DE fr-FR it-IT es-ES]).map { |code| [t("language_#{code}"), code] }, I18n.locale), onchange: 'this.form.requestSubmit();', class: 'select select-sm border-base-content/30 text-base' %>
   <% end %>
 </div>

app/views/icons/_alert_circle.html.erb

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="<%= local_assigns[:class] %>" width="44" height="44" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+  <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+  <path d="M3 12a9 9 0 1 0 18 0a9 9 0 0 0 -18 0" />
+  <path d="M12 8v4" />
+  <path d="M12 16h.01" />
+</svg>

app/views/icons/_eye.html.erb

@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="<%= local_assigns[:class] %>" width="44" height="44" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+  <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+  <path d="M10 12a2 2 0 1 0 4 0a2 2 0 0 0 -4 0" />
+  <path d="M21 12c-2.4 4 -5.4 6 -9 6c-3.6 0 -6.6 -2 -9 -6c2.4 -4 5.4 -6 9 -6c3.6 0 6.6 2 9 6" />
+</svg>

app/views/icons/_eye_off.html.erb

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="<%= local_assigns[:class] %>" width="44" height="44" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+  <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+  <path d="M10.585 10.587a2 2 0 0 0 2.829 2.828" />
+  <path d="M16.681 16.673a8.717 8.717 0 0 1 -4.681 1.327c-3.6 0 -6.6 -2 -9 -6c1.272 -2.12 2.712 -3.678 4.32 -4.674m2.86 -1.146a9.055 9.055 0 0 1 1.82 -.18c3.6 0 6.6 2 9 6c-.666 1.11 -1.379 2.067 -2.138 2.87" />
+  <path d="M3 3l18 18" />
+</svg>

app/views/icons/_lock_open.html.erb

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" class="<%= local_assigns[:class] %>" width="44" height="44" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
+  <path stroke="none" d="M0 0h24v24H0z" fill="none" />
+  <path d="M5 11m0 2a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v6a2 2 0 0 1 -2 2h-10a2 2 0 0 1 -2 -2z" />
+  <path d="M12 16m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0" />
+  <path d="M8 11v-5a4 4 0 0 1 8 0" />
+</svg>

app/views/personalization_settings/_submitter_completed_email_form.html.erb

@@ -8,7 +8,7 @@
   <div class="collapse-content">
     <%= form_for AccountConfigs.find_or_initialize_for_key(current_account, AccountConfig::SUBMITTER_COMPLETED_EMAIL_KEY), url: settings_personalization_path, method: :post, html: { autocomplete: 'off', class: 'space-y-4' } do |f| %>
       <%= f.hidden_field :key %>
-      <%= f.fields_for :value, Struct.new(:subject, :body, :attach_audit_log).new(*f.object.value.values_at('subject', 'body', 'attach_audit_log')) do |ff| %>
+      <%= f.fields_for :value, Struct.new(:subject, :body, :attach_audit_log, :attach_documents).new(*f.object.value.values_at('subject', 'body', 'attach_audit_log', 'attach_documents')) do |ff| %>
         <div class="form-control">
           <div class="flex items-center">
             <%= ff.label :subject, class: 'label' %>
@@ -29,7 +29,13 @@
             <%= ff.text_area :body, required: true, class: 'base-input w-full py-2', dir: 'auto' %>
           </autoresize-textarea>
         </div>
-        <div class="flex items-center justify-between py-2.5 mx-1">
+        <div class="flex items-center justify-between pt-2.5 mx-1">
+          <span>
+            Attach documents
+          </span>
+          <%= ff.check_box :attach_documents, { checked: ff.object.attach_documents != false, class: 'toggle' }, 'true', 'false' %>
+        </div>
+        <div class="flex items-center justify-between pb-2.5 mx-1">
           <span>
             Attach audit log PDF
           </span>

app/views/scripts/_autosize_field.html.erb

@@ -3,7 +3,7 @@
     window.customElements.define('autosize-field', class extends HTMLElement {
       connectedCallback() {
         if (this.field.scrollHeight > this.field.clientHeight) {
-          this.field.classList.remove('text-[1.5vw]', 'lg:text-base');
+          this.field.classList.remove('text-[1.6vw]', 'lg:text-base');
           this.field.classList.add('text-[1.0vw]', 'lg:text-[0.70rem]');
 
           if (this.field.scrollHeight > this.field.clientHeight) {

app/views/setup/index.html.erb

@@ -34,7 +34,17 @@
       <%= fields_for @user do |ff| %>
         <div class="form-control">
           <%= ff.label :password, class: 'label' %>
-          <%= ff.password_field :password, required: true, placeholder: '************', class: 'base-input' %>
+          <password-input class="block relative">
+            <%= ff.password_field :password, required: true, placeholder: '************', class: 'base-input w-full pr-10', data: { target: 'password-input.passwordInput' } %>
+            <button data-target="password-input.togglePasswordVisibility" type="button" class="absolute inset-y-0 h-12 right-0 pr-3 flex items-center">
+              <span data-target="password-input.hiddenPasswordIcon">
+                <%= svg_icon('eye', class: 'w-6 h-6 shrink-0 bg-white') %>
+              </span>
+              <span data-target="password-input.visiblePasswordIcon" class="hidden">
+                <%= svg_icon('eye_off', class: 'w-6 h-6 shrink-0 bg-white') %>
+              </span>
+            </button>
+          </password-input>
         </div>
       <% end %>
       <%= fields_for @encrypted_config do |ff| %>

app/views/submissions/_value.html.erb

@@ -1,13 +1,35 @@
 <% align = field.dig('preferences', 'align') %>
-<field-value dir="auto" class="flex absolute text-[1.5vw] lg:text-base <%= align == 'right' ? 'justify-end' : (align == 'center' ? 'justify-center' : '') %>" style="width: <%= area['w'] * 100 %>%; height: <%= area['h'] * 100 %>%; left: <%= area['x'] * 100 %>%; top: <%= area['y'] * 100 %>%; <%= "font-size: #{field['preferences']['font_size']}pt" if field.dig('preferences', 'font_size') %>">
-  <% if field['type'].in?(['signature', 'image', 'initials', 'stamp']) %>
+<field-value dir="auto" class="flex absolute text-[1.6vw] lg:text-base <%= align == 'right' ? 'justify-end' : (align == 'center' ? 'justify-center' : '') %>" style="width: <%= area['w'] * 100 %>%; height: <%= area['h'] * 100 %>%; left: <%= area['x'] * 100 %>%; top: <%= area['y'] * 100 %>%; <%= "font-size: #{field['preferences']['font_size']}pt" if field.dig('preferences', 'font_size') %>">
+  <% if field['type'] == 'signature' %>
+    <div class="flex flex-col justify-between h-full overflow-hidden">
+      <div class="flex-grow flex overflow-hidden" style="min-height: 50%">
+        <img class="object-contain mx-auto" src="<%= attachments_index[value].url %>">
+      </div>
+      <% if local_assigns[:with_signature_id] && attachment = attachments_index[value] %>
+        <div class="w-full mt-1 text-[1vw] lg:text-[0.55rem] lg:leading-[0.65rem]">
+          <div class="truncate uppercase">
+            ID: <%= attachment.uuid %>
+          </div>
+          <div>
+            <%= t('reason') %>: <%= t('digitally_signed_by') %> <%= submitter.name %>
+            <% if submitter.email %>
+              &lt;<%= submitter.email %>&gt;
+            <% end %>
+          </div>
+          <div>
+            <%= l(attachment.created_at.in_time_zone(local_assigns[:timezone]), format: :long, locale: local_assigns[:locale]) %> <%= TimeUtils.timezone_abbr(local_assigns[:timezone], attachment.created_at) %>
+          </div>
+        </div>
+      <% end %>
+    </div>
+  <% elsif field['type'].in?(['image', 'initials', 'stamp']) %>
     <img class="object-contain mx-auto" src="<%= attachments_index[value].url %>" loading="lazy">
   <% elsif field['type'].in?(['file', 'payment']) %>
     <autosize-field></autosize-field>
     <div class="px-0.5 flex flex-col justify-center">
       <% Array.wrap(value).each do |val| %>
         <a target="_blank" href="<%= attachments_index[val].url %>">
-          <%= svg_icon('paperclip', class: 'inline w-[1.5vw] h-[1.5vw] lg:w-4 lg:h-4') %>
+          <%= svg_icon('paperclip', class: 'inline w-[1.6vw] h-[1.6vw] lg:w-4 lg:h-4') %>
           <%= attachments_index[val].filename %>
         </a>
       <% end %>
@@ -24,7 +46,7 @@
         <%= svg_icon('check', class: "aspect-square #{area['w'] > area['h'] ? '!w-auto !h-full' : '!w-full !h-auto'}") %>
       </div>
     <% end %>
-  <% elsif field['type'] == 'cells' && area['cell_w'] %>
+  <% elsif field['type'] == 'cells' && area['cell_w'].to_f > 0.0 %>
     <% cell_width = area['cell_w'] / area['w'] * 100 %>
     <div class="w-full flex items-center">
       <% (0..(area['w'] / area['cell_w']).ceil).each do |index| %>

app/views/submissions/show.html.erb

@@ -1,6 +1,7 @@
 <% if params[:controller] == 'submissions_preview' %>
   <%= render 'submissions/preview_tags' %>
 <% end %>
+<% with_signature_id = @submission.account.account_configs.exists?(key: AccountConfig::WITH_SIGNATURE_ID, value: true) %>
 <div style="max-width: 1600px" class="mx-auto pl-4">
   <div class="flex justify-between py-1.5 items-center pr-4 sticky top-0 md:relative z-10 bg-base-100">
     <a href="<%= signed_in? && @submission.account_id == current_account&.id ? template_path(@submission.template) : '/' %>" class="flex items-center space-x-3 py-1">
@@ -53,7 +54,7 @@
             </div>
           <% end %>
         </div>
-      <% elsif @submission.submitters.to_a.size == 1 %>
+      <% elsif @submission.submitters.to_a.size == 1 && !@submission.expired? %>
         <%= render 'shared/clipboard_copy', text: start_form_url(slug: @submission.template.slug), class: 'base-button', icon_class: 'w-6 h-6 text-white', copy_title: 'Copy Share Link', copied_title: 'Copied to Clipboard' %>
       <% end %>
     </div>
@@ -73,6 +74,7 @@
     <div id="document_view" class="w-full overflow-y-auto overflow-x-hidden mt-0.5 pt-0.5">
       <div class="pr-3.5 pl-0.5">
         <% fields_index = Templates.build_field_areas_index(@submission.template_fields || @submission.template.fields) %>
+        <% submitters_index = @submission.submitters.index_by(&:uuid) %>
         <% values = @submission.submitters.reduce({}) { |acc, sub| acc.merge(sub.values) } %>
         <% 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) %>
@@ -92,7 +94,7 @@
                 <% fields_index.dig(document.uuid, index)&.each do |(area, field)| %>
                   <% value = values[field['uuid']] %>
                   <% next if value.blank? %>
-                  <%= render 'submissions/value', area:, field:, attachments_index:, value:, locale: @submission.account.locale, timezone: @submission.account.timezone %>
+                  <%= render 'submissions/value', area:, field:, attachments_index:, value:, locale: @submission.account.locale, timezone: @submission.account.timezone, submitter: submitters_index[field['submitter_uuid']], with_signature_id: %>
                 <% end %>
               </div>
             </div>
@@ -144,15 +146,15 @@
                 <%= submitter&.completed_at? ? l(submitter.completed_at.in_time_zone(@submission.account.timezone), format: :long, locale: @submission.account.locale) : 'Not completed yet' %>
               </span>
             </div>
-            <% if signed_in? && submitter && submitter.email && !submitter.completed_at && !@submission.archived_at? && can?(:update, submitter) && Accounts.can_send_emails?(current_account) %>
+            <% if signed_in? && submitter && submitter.email && !submitter.completed_at && !@submission.archived_at? && can?(:update, submitter) && Accounts.can_send_emails?(current_account) && !@submission.expired? %>
               <div class="mt-2 mb-1">
                 <%= button_to button_title(title: submitter.sent_at? ? 'Re-send Email' : 'Send Email', disabled_with: 'Sending'), submitter_send_email_index_path(submitter_slug: submitter.slug), class: 'btn btn-sm btn-primary w-full' %>
               </div>
             <% end %>
-            <% if signed_in? && submitter && submitter.phone && !submitter.completed_at && !@submission.archived_at? && can?(:update, submitter) %>
+            <% if signed_in? && submitter && submitter.phone && !submitter.completed_at && !@submission.archived_at? && can?(:update, submitter) && !@submission.expired? %>
               <%= render 'submissions/send_sms_button', submitter: %>
             <% end %>
-            <% if signed_in? && submitter && !submitter.completed_at? && !@submission.archived_at? && can?(:create, submitter) %>
+            <% if signed_in? && submitter && !submitter.completed_at? && !@submission.archived_at? && can?(:create, submitter) && !@submission.expired? %>
               <div class="mt-2 mb-1">
                 <a class="btn btn-sm btn-primary w-full" target="_blank" href="<%= submit_form_path(slug: submitter.slug) %>">
                   Sign In-person

app/views/submissions_archived/index.html.erb

@@ -12,7 +12,7 @@
 </div>
 <% if @pagy.count > 0 %>
   <div class="space-y-4">
-    <%= render partial: 'templates/submission', collection: @submissions, locals: { with_template: true } %>
+    <%= render partial: 'templates/submission', collection: @submissions, locals: { with_template: true, archived: true } %>
   </div>
 <% elsif params[:q].present? %>
   <div class="text-center">

app/views/submit_form/_submission_form.html.erb

@@ -1,3 +1,3 @@
-<% data_attachments = attachments_index.values.select { |e| e.record_id == submitter.id }.to_json(only: %i[uuid], methods: %i[url filename content_type]) %>
+<% data_attachments = attachments_index.values.select { |e| e.record_id == submitter.id }.to_json(only: %i[uuid created_at], methods: %i[url filename content_type]) %>
 <% data_fields = (submitter.submission.template_fields || submitter.submission.template.fields).select { |f| f['submitter_uuid'] == submitter.uuid }.to_json %>
-<submission-form data-is-demo="<%= Docuseal.demo? %>" data-with-confetti="<%= configs[:with_confetti] %>" data-completed-redirect-url="<%= submitter.preferences['completed_redirect_url'] %>" data-completed-message="<%= configs[:completed_message].to_json %>" data-completed-button="<%= configs[:completed_button].to_json %>" data-go-to-last="<%= submitter.preferences.key?('go_to_last') ? submitter.preferences['go_to_last'] : submitter.opened_at? %>" data-submitter="<%= submitter.to_json(only: %i[uuid slug name phone email]) %>" data-can-send-email="<%= Accounts.can_send_emails?(submitter.submission.account) %>" data-attachments="<%= data_attachments %>" data-fields="<%= data_fields %>" data-values="<%= submitter.values.to_json %>" data-with-typed-signature="<%= configs[:with_typed_signature] %>" data-previous-signature-value="<%= local_assigns[:signature_attachment]&.uuid %>" data-remember-signature="<%= configs[:prefill_signature] %>" data-dry-run="<%= local_assigns[:dry_run] %>" data-expand="<%= local_assigns[:expand] %>" data-scroll-padding="<%= local_assigns[:scroll_padding] %>"></submission-form>
+<submission-form data-is-demo="<%= Docuseal.demo? %>" data-with-signature-id="<%= configs[:with_signature_id] %>" data-with-confetti="<%= configs[:with_confetti] %>" data-completed-redirect-url="<%= submitter.preferences['completed_redirect_url'] %>" data-completed-message="<%= configs[:completed_message].to_json %>" data-completed-button="<%= configs[:completed_button].to_json %>" data-go-to-last="<%= submitter.preferences.key?('go_to_last') ? submitter.preferences['go_to_last'] : submitter.opened_at? %>" data-submitter="<%= submitter.to_json(only: %i[uuid slug name phone email]) %>" data-can-send-email="<%= Accounts.can_send_emails?(submitter.submission.account) %>" data-attachments="<%= data_attachments %>" data-fields="<%= data_fields %>" data-values="<%= submitter.values.to_json %>" data-with-typed-signature="<%= configs[:with_typed_signature] %>" data-previous-signature-value="<%= local_assigns[:signature_attachment]&.uuid %>" data-remember-signature="<%= configs[:prefill_signature] %>" data-dry-run="<%= local_assigns[:dry_run] %>" data-expand="<%= local_assigns[:expand] %>" data-scroll-padding="<%= local_assigns[:scroll_padding] %>"></submission-form>

app/views/submit_form/expired.html.erb

@@ -0,0 +1,21 @@
+<div class="max-w-md mx-auto px-2 mt-12 mb-4">
+  <div class="space-y-6 mx-auto">
+    <div class="space-y-6">
+      <div class="flex items-center justify-center">
+        <%= render 'start_form/banner' %>
+      </div>
+      <div class="flex items-center bg-base-200 rounded-xl p-4 mb-4">
+        <div class="flex items-center">
+          <div class="mr-3">
+            <%= svg_icon('writing_sign', class: 'w-10 h-10') %>
+          </div>
+          <div dir="auto">
+            <p class="text-lg font-bold mb-1"><%= @submitter.submission.template.name %></p>
+            <p class="text-sm"><%= t('form_expired_at_html', time: l(@submitter.submission.expire_at, format: :long)) %></p>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+<%= render 'shared/attribution', link_path: '/start', account: @submitter.account %>

app/views/submit_form/show.html.erb

@@ -27,8 +27,8 @@
                 <% next if !field['readonly'] && field['submitter_uuid'] == @submitter.uuid %>
                 <% next if field['redacted'] && field['submitter_uuid'] != @submitter.uuid %>
                 <% next if value == '{{date}}' && field['submitter_uuid'] != @submitter.uuid %>
-                <% next if field.dig('preferences', 'formula') && field['submitter_uuid'] == @submitter.uuid %>
-                <%= render 'submissions/value', area:, field:, attachments_index: @attachments_index, value:, locale: @submitter.account.locale, timezone: @submitter.account.timezone %>
+                <% next if field.dig('preferences', 'formula').present? && field['submitter_uuid'] == @submitter.uuid %>
+                <%= render 'submissions/value', area:, field:, attachments_index: @attachments_index, value:, locale: @submitter.account.locale, timezone: @submitter.account.timezone, submitter: @submitter, with_signature_id: @form_configs[:with_signature_id] %>
               <% end %>
             </div>
           </div>

app/views/templates/_submission.html.erb

@@ -34,11 +34,19 @@
         <% submitter = submitters.first %>
         <div class="flex items-center space-x-4">
           <span class="flex flex-col md:flex-row md:items-center gap-3">
-            <div class="tooltip flex" data-tip="<%= l(submitter.status_event_at.in_time_zone(current_account.timezone), format: :short, locale: current_account.locale) %>">
-              <span class="badge <%= status_badges[submitter.status] %> md:w-32 badge-lg bg-opacity-50 uppercase text-sm font-semibold">
-                <%= submitter.status %>
-              </span>
-            </div>
+            <% if submission.expired? %>
+              <div class="tooltip flex" data-tip="<%= l(submission.expire_at.in_time_zone(current_account.timezone), format: :short, locale: current_account.locale) %>">
+                <span class="badge badge-error md:w-32 bg-opacity-50 badge-lg uppercase text-sm font-semibold">
+                  Expired
+                </span>
+              </div>
+            <% else %>
+              <div class="tooltip flex" data-tip="<%= l(submitter.status_event_at.in_time_zone(current_account.timezone), format: :short, locale: current_account.locale) %>">
+                <span class="badge <%= status_badges[submitter.status] %> md:w-32 badge-lg bg-opacity-50 uppercase text-sm font-semibold">
+                  <%= submitter.status %>
+                </span>
+              </div>
+            <% end %>
             <span class="text-lg break-all flex items-center">
               <%= submitter.name || submitter.email || submitter.phone %>
             </span>
@@ -61,7 +69,7 @@
               </download-button>
             </button>
           </form>
-        <% elsif !submission.archived_at? && !template.archived_at? %>
+        <% elsif !submission.archived_at? && !template.archived_at? && !submission.expired? %>
           <% if current_user.email == submitter.email %>
             <form data-turbo="false" method="get" action="<%= submit_form_url(slug: submitter.slug) %>" class="flex-1 md:flex-none">
               <button onclick="event.stopPropagation()" class="btn btn-sm btn-neutral btn-outline bg-white w-full md:w-36 flex">
@@ -82,7 +90,12 @@
         </div>
         <% if !submission.archived_at? && !template.archived_at? && can?(:destroy, submission) %>
           <span data-tip="Archive" class="sm:tooltip tooltip-top">
-            <%= button_to button_title(title: nil, disabled_with: 'Arch', icon: svg_icon('archive', class: 'w-6 h-6')), submission_path(submission), class: 'btn btn-outline btn-sm w-full md:w-fit', form: { class: 'flex' }, title: 'Archive', method: :delete, data: { turbo_confirm: 'Are you sure?' }, onclick: 'event.stopPropagation()' %>
+            <%= button_to button_title(title: nil, disabled_with: 'Arch', icon: svg_icon('archive', class: 'w-6 h-6')), submission_path(submission), class: 'btn btn-outline btn-sm w-full md:w-fit', form: { class: 'flex' }, title: 'Archive', method: :delete, onclick: 'event.stopPropagation()' %>
+          </span>
+        <% end %>
+        <% if local_assigns[:archived] && can?(:destroy, submission) %>
+          <span data-tip="Remove" class="sm:tooltip tooltip-top">
+            <%= button_to button_title(title: nil, disabled_with: 'Rem', icon: svg_icon('trash', class: 'w-6 h-6')), submission_path(submission, permanently: true), class: 'btn btn-outline btn-sm w-full md:w-fit', form: { class: 'flex' }, title: 'Remove', method: :delete, data: { turbo_confirm: 'Submission deletion is irreversible and will permanently remove all associated signed documents with it. Are you sure?' }, onclick: 'event.stopPropagation()' %>
           </span>
         <% end %>
       </div>
@@ -96,12 +109,18 @@
                 <%= latest_submitter.status %>
               </span>
             </div>
+          <% elsif submission.expired? %>
+            <div class="tooltip flex" data-tip="<%= l(submission.expire_at.in_time_zone(current_account.timezone), format: :short, locale: current_account.locale) %>">
+              <span class="badge badge-error md:w-32 bg-opacity-50 badge-lg uppercase text-sm font-semibold">
+                Expired
+              </span>
+            </div>
           <% end %>
           <div class="w-full <%= is_submission_completed ? 'space-y-1' : 'space-y-4' %> md:space-y-0">
             <% submitters.each_with_index do |submitter, index| %>
               <div class="relative flex justify-between items-start md:items-center space-x-3">
                 <span class="flex flex-col md:flex-row md:items-center gap-2">
-                  <% unless is_submission_completed %>
+                  <% if !is_submission_completed && !submission.expired? %>
                     <div class="tooltip flex" data-tip="<%= l(submitter.status_event_at.in_time_zone(current_account.timezone), format: :short, locale: current_account.locale) %>">
                       <span class="badge md:w-24 <%= status_badges[submitter.status] %> bg-opacity-50 uppercase text-xs font-semibold">
                         <%= submitter.status %>
@@ -127,7 +146,7 @@
                       </download-button>
                     </button>
                   </form>
-                <% elsif !template.archived_at? && !submission.archived_at? && !is_submission_completed %>
+                <% elsif !template.archived_at? && !submission.archived_at? && !is_submission_completed && !submission.expired? %>
                   <div class="relative flex items-center space-x-3">
                     <% if current_user.email == submitter.email %>
                       <form data-turbo="false" method="get" action="<%= submit_form_url(slug: submitter.slug) %>">
@@ -173,7 +192,7 @@
         </div>
         <% if !submission.archived_at? && !template.archived_at? %>
           <span data-tip="Archive" class="sm:tooltip tooltip-top">
-            <%= button_to button_title(title: nil, disabled_with: 'Arch', icon: svg_icon('archive', class: 'w-6 h-6')), submission_path(submission), class: 'btn btn-outline btn-sm w-full md:w-fit', form: { class: 'flex' }, title: 'Archive', method: :delete, data: { turbo_confirm: 'Are you sure?' }, onclick: 'event.stopPropagation()' %>
+            <%= button_to button_title(title: nil, disabled_with: 'Arch', icon: svg_icon('archive', class: 'w-6 h-6')), submission_path(submission), class: 'btn btn-outline btn-sm w-full md:w-fit', form: { class: 'flex' }, title: 'Archive', method: :delete, onclick: 'event.stopPropagation()' %>
           </span>
         <% end %>
       </div>

app/views/templates/_template.html.erb

@@ -57,7 +57,7 @@
       <% end %>
       <% if can?(:destroy, template) %>
         <span class="tooltip tooltip-left" data-tip="<%= template.archived_at? ? 'Delete' : 'Archive' %>">
-          <%= button_to template_path(template), data: { turbo_confirm: template.archived_at? ? 'Template deletion is irreversible and will permanently remove all associated signed documents with it. Are you sure?' : 'Are you sure?' }, params: { permanently: template.archived_at? }.compact_blank, method: :delete, class: 'btn btn-xs hover:btn-outline bg-base-200 btn-circle', aria_label: 'Restore' do %>
+          <%= button_to template_path(template), data: template.archived_at? ? { turbo_confirm: 'Template deletion is irreversible and will permanently remove all associated signed documents with it. Are you sure?' } : {}, params: { permanently: template.archived_at? }.compact_blank, method: :delete, class: 'btn btn-xs hover:btn-outline bg-base-200 btn-circle', aria_label: 'Restore' do %>
             <%= svg_icon(template.archived_at? ? 'trash' : 'archive', class: 'w-4 h-4 enabled') %>
             <%= svg_icon('loader', class: 'w-4 h-4 animate-spin disabled') %>
           <% end %>

app/views/templates/_title.html.erb

@@ -54,7 +54,7 @@
     <% if !template.archived_at? && can?(:destroy, template) %>
       <%= button_to button_title(title: 'Archive', disabled_with: 'Archiving', title_class: 'inline', icon: svg_icon('archive', class: 'w-6 h-6')), template_path(template), class: 'btn btn-outline btn-sm w-full', form_class: 'flex-1', method: :delete, data: { turbo_confirm: 'Are you sure?' } %>
     <% end %>
-    <% if can?(:create, template) %>
+    <% if can?(:create, current_account.templates.new(author: current_user)) %>
       <%= link_to new_template_path(base_template_id: template.id), class: 'btn btn-outline btn-sm flex-1', data: { turbo_frame: :modal } do %>
         <span class="flex items-center justify-center space-x-2">
           <%= svg_icon('copy', class: 'w-6 h-6') %>

app/views/templates_archived_submissions/index.html.erb

@@ -19,7 +19,7 @@
 </div>
 <% if @pagy.count > 0 %>
   <div class="space-y-4">
-    <%= render partial: 'templates/submission', collection: @submissions, locals: { template: @template } %>
+    <%= render partial: 'templates/submission', collection: @submissions, locals: { template: @template, archived: true } %>
   </div>
 <% elsif params[:q].present? %>
   <div class="text-center">

app/views/templates_preferences/show.html.erb

@@ -130,7 +130,7 @@
           <%= form_for @template, url: template_preferences_path(@template), method: :post, html: { autocomplete: 'off', class: 'mt-1' } do |f| %>
             <toggle-on-submit data-element-id="email_saved_alert3"></toggle-on-submit>
             <% configs = AccountConfigs.find_or_initialize_for_key(current_account, AccountConfig::SUBMITTER_COMPLETED_EMAIL_KEY).value %>
-            <%= f.fields_for :preferences, Struct.new(:completed_notification_email_subject, :completed_notification_email_body, :completed_notification_email_enabled, :completed_notification_email_attach_audit).new(@template.preferences['completed_notification_email_subject'].presence || configs['subject'], @template.preferences['completed_notification_email_body'].presence || configs['body'], @template.preferences['completed_notification_email_enabled'], configs['attach_audit_log'] != false && @template.preferences['completed_notification_email_attach_audit'] != false) do |ff| %>
+            <%= f.fields_for :preferences, Struct.new(:completed_notification_email_subject, :completed_notification_email_body, :completed_notification_email_enabled, :completed_notification_email_attach_audit, :completed_notification_email_attach_documents).new(@template.preferences['completed_notification_email_subject'].presence || configs['subject'], @template.preferences['completed_notification_email_body'].presence || configs['body'], @template.preferences['completed_notification_email_enabled'], configs['attach_audit_log'] != false && @template.preferences['completed_notification_email_attach_audit'] != false, configs['attach_documents'] != false && @template.preferences['completed_notification_email_attach_documents'] != false) do |ff| %>
               <div class="form-control">
                 <%= ff.label :completed_notification_email_subject, 'Email subject', class: 'label' %>
                 <%= ff.text_field :completed_notification_email_subject, required: true, class: 'base-input', dir: 'auto' %>
@@ -147,17 +147,23 @@
                 </autoresize-textarea>
               </div>
               <div class="flex items-center justify-between pt-2.5 px-1 mb-2">
-                <span>
-                  Attach Audit Log PDF to the email
-                </span>
-                <%= ff.check_box :completed_notification_email_attach_audit, { checked: ff.object.completed_notification_email_attach_audit != false, class: 'toggle', onchange: 'this.form.requestSubmit()', disabled: configs['attach_audit_log'] == false }, 'true', 'false' %>
-              </div>
-              <div class="flex items-center justify-between py-2.5 px-1 mb-2">
                 <span>
                   Send emails automatically on completion
                 </span>
                 <%= ff.check_box :completed_notification_email_enabled, { checked: ff.object.completed_notification_email_enabled != false, class: 'toggle', onchange: 'this.form.requestSubmit()' }, 'true', 'false' %>
               </div>
+              <div class="flex items-center justify-between pt-2.5 px-1 mb-2">
+                <span>
+                  Attach documents to the email
+                </span>
+                <%= ff.check_box :completed_notification_email_attach_documents, { checked: ff.object.completed_notification_email_attach_documents != false, class: 'toggle', onchange: 'this.form.requestSubmit()', disabled: configs['attach_documents'] == false }, 'true', 'false' %>
+              </div>
+              <div class="flex items-center justify-between py-2.5 px-1 mb-2">
+                <span>
+                  Attach Audit Log PDF to the email
+                </span>
+                <%= ff.check_box :completed_notification_email_attach_audit, { checked: ff.object.completed_notification_email_attach_audit != false, class: 'toggle', onchange: 'this.form.requestSubmit()', disabled: configs['attach_audit_log'] == false }, 'true', 'false' %>
+              </div>
             <% end %>
             <div class="form-control pt-2">
               <%= f.button button_title(title: 'Save', disabled_with: 'Saving'), class: 'base-button' %>

app/views/webhook_secret/index.html.erb

@@ -0,0 +1,19 @@
+<%= render 'shared/turbo_modal', title: 'Webhook Secret' do %>
+  <%= form_for @encrypted_config, url: webhook_secret_index_path, method: :post, html: { class: 'space-y-4' }, data: { turbo_frame: :_top } do |f| %>
+    <div class="space-y-2">
+      <%= f.fields_for :value, Struct.new(:key, :value).new(*@encrypted_config.value.to_a.first) do |ff| %>
+        <div class="form-control">
+          <%= ff.label :key, class: 'label' %>
+          <%= ff.text_field :key, class: 'base-input', placeholder: 'X-Example-Header' %>
+        </div>
+        <div class="form-control">
+          <%= ff.label :value, class: 'label' %>
+          <%= ff.text_field :value, class: 'base-input' %>
+        </div>
+      <% end %>
+    </div>
+    <div class="form-control pt-2">
+      <%= f.button button_title, class: 'base-button' %>
+    </div>
+  <% end %>
+<% end %>

app/views/webhook_settings/show.html.erb

@@ -9,9 +9,12 @@
       <div class="card-body p-6">
         <%= form_for @encrypted_config, url: settings_webhooks_path, method: :post, html: { autocomplete: 'off' } do |f| %>
           <%= f.label :value, 'Webhook URL', class: 'text-sm font-semibold' %>
-          <div class="flex flex-row flex-wrap space-y-2 md:space-y-0 md:flex-nowrap md:space-x-4 mt-2">
+          <div class="flex flex-row flex-wrap space-y-2 md:space-y-0 md:flex-nowrap md:space-x-2 mt-2">
             <%= f.url_field :value, class: 'input font-mono input-bordered w-full', placeholder: 'https://example.com/hook' %>
             <%= f.button button_title(title: 'Save', disabled_with: 'Saving'), class: 'base-button w-full md:w-32' %>
+            <a href="<%= webhook_secret_index_path %>" data-turbo-frame="modal" class="white-button w-full md:w-auto">
+              Add Secret
+            </a>
           </div>
         <% end %>
         <% preference = current_account.account_configs.find_by(key: AccountConfig::WEBHOOK_PREFERENCES_KEY)&.value || {} %>

config/application.rb

@@ -25,7 +25,7 @@ module DocuSeal
 
     config.active_storage.draw_routes = ENV['MULTITENANT'] != 'true'
 
-    config.i18n.available_locales = %i[en en-US en-GB es-ES fr-FR pt-PT de-DE es it de fr pl uk cs pt he nl ar ko]
+    config.i18n.available_locales = %i[en en-US en-GB es-ES fr-FR pt-PT de-DE it-IT es it de fr pl uk cs pt he nl ar ko]
     config.i18n.fallbacks = [:en]
 
     config.exceptions_app = ->(env) { ErrorsController.action(:show).call(env) }

config/locales/en.yml

@@ -19,9 +19,11 @@ en: &en
   language_ar: العربية
   language_ko: 한국어
   email: Email
+  form_expired_at_html: 'Form expired on <span class="font-semibold">%{time}</span>'
   verification_code_code: 'Verification code: %{code}'
   digitally_signed_by: Digitally signed by
   role: Role
+  reason: Reason
   provide_your_email_to_start: Provide your email to start
   start: Start
   starting: Starting
@@ -57,9 +59,15 @@ en: &en
   sign_up_with_microsoft: Sign up with Microsoft
   by_creating_an_account_you_agree_to_our_html: 'By creating an account, you agree to our <a target="_blank" href="https://www.docuseal.co/privacy">Privacy Policy</a> and <a target="_blank" href="https://www.docuseal.co/terms">Terms of Service</a>.'
   enter_email_to_continue: Enter email to continue
+  doorkeeper:
+    scopes:
+      write: Update your data
+      read: Read your data
 
 es: &es
   role: Rol
+  reason: Razón
+  form_expired_at_html: 'El formulario expiró el <span class="font-semibold">%{time}</span>'
   verification_code_code: 'Código de verificación: %{code}'
   email: Correo electrónico
   digitally_signed_by: Firmado digitalmente por
@@ -100,10 +108,12 @@ es: &es
   by_creating_an_account_you_agree_to_our_html: 'Al crear una cuenta, aceptas nuestra <a target="_blank" href="https://www.docuseal.co/privacy">Política de Privacidad</a> y <a target="_blank" href="https://www.docuseal.co/terms">Términos de Servicio</a>.'
   enter_email_to_continue: Ingresa tu correo electrónico para continuar
 
-it:
+it: &it
   role: Rôle
+  reason: Ragione
   verification_code_code: 'Codice di verifica: %{code}'
   email: Email
+  form_expired_at_html: 'Il modulo è scaduto il <span class="font-semibold">%{time}</span>'
   digitally_signed_by: Firmato digitalmente da
   role: Ruolo
   provide_your_email_to_start: Fornisci la tua email per iniziare
@@ -145,7 +155,9 @@ fr: &fr
   email: Email
   verification_code_code: 'Code de vérification: %{code}'
   digitally_signed_by: Signé numériquement par
+  reason: Raison
   role: Rôle
+  form_expired_at_html: 'Le formulaire a expiré le <span class="font-semibold">%{time}</span>'
   provide_your_email_to_start: Entrez votre adresse email pour commencer
   start: Démarrer
   starting: Démarrage
@@ -185,8 +197,10 @@ fr: &fr
 pt: &pt
   role: Função
   email: Email
+  reason: Razão
   verification_code_code: 'Código de verificação: %{code}'
   digitally_signed_by: Assinado digitalmente por
+  form_expired_at_html: 'O formulário expirou em <span class="font-semibold">%{time}</span>'
   role: Função
   provide_your_email_to_start: Forneça o seu email para começar
   start: Iniciar
@@ -226,7 +240,9 @@ pt: &pt
 de: &de
   role: Rolle
   verification_code_code: 'Verifizierungscode: %{code}'
+  reason: Grund
   email: E-Mail
+  form_expired_at_html: 'Das Formular ist am <span class="font-semibold">%{time}</span> abgelaufen'
   digitally_signed_by: Digital signiert von
   role: Rolle
   provide_your_email_to_start: Gib deine E-Mail-Adresse ein, um zu starten
@@ -268,9 +284,11 @@ pl:
   email: Email
   verification_code_code: 'Kod weryfikacyjny: %{code}'
   digitally_signed_by: Podpis cyfrowy przez
+  form_expired_at_html: 'Formularz wygasł o <span class="font-semibold">%{time}</span>'
   role: Rola
   provide_your_email_to_start: Podaj swój adres email, aby rozpocząć
   start: Rozpocznij
+  reason: Powód
   starting: Rozpoczynanie
   form_has_been_deleted_by_html: 'Formularz został usunięty przez <span class="font-semibold">%{name}</span>.'
   invited_by_html: 'Zaproszony przez <span class="font-semibold">%{name}</span>'
@@ -310,7 +328,9 @@ uk:
   verification_code_code: 'Код підтвердження: %{code}'
   role: Роль
   provide_your_email_to_start: Введіть свій email, щоб почати
+  form_expired_at_html: 'Строк подачі завершився о <span class="font-semibold">%{time}</span>'
   start: Почати
+  reason: Причина
   starting: Початок
   form_has_been_deleted_by_html: 'Форму було видалено користувачем <span class="font-semibold">%{name}</span>.'
   invited_by_html: 'Запрошений користувачем <span class="font-semibold">%{name}</span>'
@@ -350,6 +370,8 @@ cs:
   verification_code_code: 'Ověřovací kód: %{code}'
   role: Role
   provide_your_email_to_start: Zadejte svůj email pro zahájení
+  reason: Důvod
+  form_expired_at_html: 'Formulář vypršel <span class="font-semibold">%{time}</span>'
   start: Zahájit
   starting: Zahajování
   form_has_been_deleted_by_html: 'Formulář byl smazán uživatelem <span class="font-semibold">%{name}</span>.'
@@ -388,10 +410,12 @@ he:
   email: דוא"ל
   digitally_signed_by: חתום דיגיטלית על ידי
   role: תפקיד
+  reason: סיבה
   verification_code_code: 'קוד אימות: %{code}'
   provide_your_email_to_start: ספק את כתובת הדוא"ל שלך כדי להתחיל
   start: התחל
   starting: מתחיל
+  form_expired_at_html: 'הטופס פג תוקף ב- <span class="font-semibold">%{time}</span>'
   form_has_been_deleted_by_html: 'הטופס נמחק על ידי <span class="font-semibold">%{name}</span>.'
   invited_by_html: 'הוזמן על ידי <span class="font-semibold">%{name}</span>'
   you_have_been_invited_to_submit_a_form: הוזמנת להגיש טופס
@@ -431,6 +455,8 @@ nl:
   verification_code_code: 'Verificatiecode: %{code}'
   provide_your_email_to_start: Geef uw e-mailadres om te beginnen
   start: Start
+  reason: Reden
+  form_expired_at_html: 'Formulier is verlopen op <span class="font-semibold">%{time}</span>'
   starting: Starten
   form_has_been_deleted_by_html: 'Formulier is verwijderd door <span class="font-semibold">%{name}</span>.'
   invited_by_html: 'Uitgenodigd door <span class="font-semibold">%{name}</span>'
@@ -474,7 +500,9 @@ ar:
   starting: بداية
   verification_code_code: 'رمز التحقق: %{code}'
   form_has_been_deleted_by_html: 'تم حذف الاستمارة بواسطة <span class="font-semibold">%{name}</span>.'
+  reason: سبب
   invited_by_html: 'تمت الدعوة بواسطة <span class="font-semibold">%{name}</span>'
+  form_expired_at_html: 'استمارة انتهت صلاحيتها في <span class="font-semibold">%{time}</span>'
   you_have_been_invited_to_submit_a_form: تمت دعوتك لتقديم استمارة
   signed_on_time: 'تم التوقيع في %{time}'
   form_has_been_submitted_already: تم تقديم الاستمارة بالفعل
@@ -512,7 +540,9 @@ ko:
   role: 역할
   provide_your_email_to_start: 시작하려면 이메일을 제공하세요
   start: 시작
+  reason: 이유
   starting: 시작 중
+  form_expired_at_html: '양식이 만료되었습니다 <span class="font-semibold">%{time}</span>'
   form_has_been_deleted_by_html: '<span class="font-semibold">%{name}</span>에 의해 양식이 삭제되었습니다.'
   invited_by_html: '<span class="font-semibold">%{name}</span>에 의해 초대되었습니다.'
   you_have_been_invited_to_submit_a_form: 양식을 제출하도록 초대되었습니다.
@@ -570,3 +600,6 @@ pt-PT:
 
 de-DE:
   <<: *de
+
+it-IT:
+  <<: *it

config/routes.rb

@@ -28,12 +28,14 @@ Rails.application.routes.draw do
   end
 
   namespace :api, defaults: { format: :json } do
+    resource :user, only: %i[show]
     resources :attachments, only: %i[create]
     resources :submitter_email_clicks, only: %i[create]
     resources :submitter_form_views, only: %i[create]
     resources :submitters, only: %i[index show update]
     resources :submissions, only: %i[index show create destroy] do
       collection do
+        resources :init, only: %i[create], controller: 'submissions'
         resources :emails, only: %i[create], controller: 'submissions', as: :submissions_emails
       end
     end
@@ -41,6 +43,12 @@ Rails.application.routes.draw do
       resources :clone, only: %i[create], controller: 'templates_clone'
       resources :submissions, only: %i[index create]
     end
+    resources :tools, only: %i[] do
+      post :merge, on: :collection
+    end
+    scope 'events' do
+      resources :form_events, only: %i[index], path: 'form/:type'
+    end
   end
 
   resources :verify_pdf_signature, only: %i[create]
@@ -67,6 +75,7 @@ Rails.application.routes.draw do
   resources :submitters_autocomplete, only: %i[index]
   resources :template_folders_autocomplete, only: %i[index]
   resources :webhook_preferences, only: %i[create]
+  resources :webhook_secret, only: %i[index create]
   resource :templates_upload, only: %i[create]
   authenticated do
     resource :templates_upload, only: %i[show], path: 'new'
@@ -158,5 +167,7 @@ Rails.application.routes.draw do
     end
   end
 
+  get '/js/:filename', to: 'embed_scripts#show', as: :embed_script
+
   ActiveSupport.run_load_hooks(:routes, self)
 end

db/migrate/20240714172222_create_webhook_urls.rb

@@ -0,0 +1,14 @@
+# frozen_string_literal: true
+
+class CreateWebhookUrls < ActiveRecord::Migration[7.1]
+  def change
+    create_table :webhook_urls do |t|
+      t.references :account, null: false, foreign_key: true, index: true
+      t.text :url, null: false
+      t.text :events, null: false
+      t.string :sha1, null: false, index: true
+
+      t.timestamps
+    end
+  end
+end

db/migrate/20240720063826_add_index_on_email_email_events.rb

@@ -0,0 +1,7 @@
+# frozen_string_literal: true
+
+class AddIndexOnEmailEmailEvents < ActiveRecord::Migration[7.1]
+  def change
+    add_index :email_events, :email
+  end
+end

db/migrate/20240720063827_create_doorkeeper_tables.rb

@@ -0,0 +1,50 @@
+# frozen_string_literal: true
+
+class CreateDoorkeeperTables < ActiveRecord::Migration[7.1]
+  def change
+    create_table :oauth_applications do |t|
+      t.string  :name,    null: false
+      t.string  :uid,     null: false
+      t.string  :secret,  null: false
+      t.text    :redirect_uri
+      t.string  :scopes,       null: false, default: ''
+      t.boolean :confidential, null: false, default: true
+      t.timestamps             null: false
+    end
+
+    add_index :oauth_applications, :uid, unique: true
+
+    create_table :oauth_access_grants do |t|
+      t.references :resource_owner,  null: false
+      t.references :application,     null: false
+      t.string   :token,             null: false
+      t.integer  :expires_in,        null: false
+      t.text     :redirect_uri,      null: false
+      t.string   :scopes,            null: false, default: ''
+      t.datetime :created_at,        null: false
+      t.datetime :revoked_at
+    end
+
+    add_index :oauth_access_grants, :token, unique: true
+    add_foreign_key :oauth_access_grants, :oauth_applications, column: :application_id
+
+    create_table :oauth_access_tokens do |t|
+      t.references :resource_owner, index: true
+      t.references :application,    null: false
+      t.string :token, null: false
+      t.string   :refresh_token
+      t.integer  :expires_in
+      t.string   :scopes
+      t.datetime :created_at, null: false
+      t.datetime :revoked_at
+      t.string   :previous_refresh_token, null: false, default: ''
+    end
+
+    add_index :oauth_access_tokens, :token, unique: true
+    add_index :oauth_access_tokens, :refresh_token, unique: true
+
+    add_foreign_key :oauth_access_tokens, :oauth_applications, column: :application_id
+    add_foreign_key :oauth_access_grants, :users, column: :resource_owner_id
+    add_foreign_key :oauth_access_tokens, :users, column: :resource_owner_id
+  end
+end

db/migrate/20240801125558_add_expire_at_to_submissions.rb

@@ -0,0 +1,7 @@
+# frozen_string_literal: true
+
+class AddExpireAtToSubmissions < ActiveRecord::Migration[7.1]
+  def change
+    add_column :submissions, :expire_at, :datetime
+  end
+end

db/schema.rb

@@ -10,7 +10,7 @@
 #
 # It's strongly recommended that you check this file into your version control system.
 
-ActiveRecord::Schema[7.1].define(version: 2024_06_24_102526) do
+ActiveRecord::Schema[7.1].define(version: 2024_08_01_125558) do
   # These are extensions that must be enabled in order to support this database
   enable_extension "plpgsql"
 
@@ -110,6 +110,7 @@ ActiveRecord::Schema[7.1].define(version: 2024_06_24_102526) do
     t.datetime "event_datetime", null: false
     t.datetime "created_at", null: false
     t.index ["account_id"], name: "index_email_events_on_account_id"
+    t.index ["email"], name: "index_email_events_on_email"
     t.index ["emailable_type", "emailable_id"], name: "index_email_events_on_emailable"
     t.index ["message_id"], name: "index_email_events_on_message_id"
   end
@@ -148,6 +149,48 @@ ActiveRecord::Schema[7.1].define(version: 2024_06_24_102526) do
     t.index ["user_id"], name: "index_encrypted_user_configs_on_user_id"
   end
 
+  create_table "oauth_access_grants", force: :cascade do |t|
+    t.bigint "resource_owner_id", null: false
+    t.bigint "application_id", null: false
+    t.string "token", null: false
+    t.integer "expires_in", null: false
+    t.text "redirect_uri", null: false
+    t.string "scopes", default: "", null: false
+    t.datetime "created_at", null: false
+    t.datetime "revoked_at"
+    t.index ["application_id"], name: "index_oauth_access_grants_on_application_id"
+    t.index ["resource_owner_id"], name: "index_oauth_access_grants_on_resource_owner_id"
+    t.index ["token"], name: "index_oauth_access_grants_on_token", unique: true
+  end
+
+  create_table "oauth_access_tokens", force: :cascade do |t|
+    t.bigint "resource_owner_id"
+    t.bigint "application_id", null: false
+    t.string "token", null: false
+    t.string "refresh_token"
+    t.integer "expires_in"
+    t.string "scopes"
+    t.datetime "created_at", null: false
+    t.datetime "revoked_at"
+    t.string "previous_refresh_token", default: "", null: false
+    t.index ["application_id"], name: "index_oauth_access_tokens_on_application_id"
+    t.index ["refresh_token"], name: "index_oauth_access_tokens_on_refresh_token", unique: true
+    t.index ["resource_owner_id"], name: "index_oauth_access_tokens_on_resource_owner_id"
+    t.index ["token"], name: "index_oauth_access_tokens_on_token", unique: true
+  end
+
+  create_table "oauth_applications", force: :cascade do |t|
+    t.string "name", null: false
+    t.string "uid", null: false
+    t.string "secret", null: false
+    t.text "redirect_uri"
+    t.string "scopes", default: "", null: false
+    t.boolean "confidential", default: true, null: false
+    t.datetime "created_at", null: false
+    t.datetime "updated_at", null: false
+    t.index ["uid"], name: "index_oauth_applications_on_uid", unique: true
+  end
+
   create_table "submission_events", force: :cascade do |t|
     t.bigint "submission_id", null: false
     t.bigint "submitter_id"
@@ -175,6 +218,7 @@ ActiveRecord::Schema[7.1].define(version: 2024_06_24_102526) do
     t.string "slug", null: false
     t.text "preferences", null: false
     t.bigint "account_id", null: false
+    t.datetime "expire_at"
     t.index ["account_id"], name: "index_submissions_on_account_id"
     t.index ["created_by_user_id"], name: "index_submissions_on_created_by_user_id"
     t.index ["slug"], name: "index_submissions_on_slug", unique: true
@@ -290,6 +334,17 @@ ActiveRecord::Schema[7.1].define(version: 2024_06_24_102526) do
     t.index ["uuid"], name: "index_users_on_uuid", unique: true
   end
 
+  create_table "webhook_urls", force: :cascade do |t|
+    t.bigint "account_id", null: false
+    t.text "url", null: false
+    t.text "events", null: false
+    t.string "sha1", null: false
+    t.datetime "created_at", null: false
+    t.datetime "updated_at", null: false
+    t.index ["account_id"], name: "index_webhook_urls_on_account_id"
+    t.index ["sha1"], name: "index_webhook_urls_on_sha1"
+  end
+
   add_foreign_key "access_tokens", "users"
   add_foreign_key "account_configs", "accounts"
   add_foreign_key "account_linked_accounts", "accounts"
@@ -302,6 +357,10 @@ ActiveRecord::Schema[7.1].define(version: 2024_06_24_102526) do
   add_foreign_key "email_messages", "users", column: "author_id"
   add_foreign_key "encrypted_configs", "accounts"
   add_foreign_key "encrypted_user_configs", "users"
+  add_foreign_key "oauth_access_grants", "oauth_applications", column: "application_id"
+  add_foreign_key "oauth_access_grants", "users", column: "resource_owner_id"
+  add_foreign_key "oauth_access_tokens", "oauth_applications", column: "application_id"
+  add_foreign_key "oauth_access_tokens", "users", column: "resource_owner_id"
   add_foreign_key "submission_events", "submissions"
   add_foreign_key "submission_events", "submitters"
   add_foreign_key "submissions", "templates"
@@ -315,4 +374,5 @@ ActiveRecord::Schema[7.1].define(version: 2024_06_24_102526) do
   add_foreign_key "templates", "users", column: "author_id"
   add_foreign_key "user_configs", "users"
   add_foreign_key "users", "accounts"
+  add_foreign_key "webhook_urls", "accounts"
 end

docker-compose.yml

@@ -7,7 +7,7 @@ services:
     ports:
       - 3000:3000
     volumes:
-      - .:/data
+      - ./docuseal:/data/docuseal
     environment:
       - FORCE_SSL=${HOST}
       - DATABASE_URL=postgresql://postgres:postgres@postgres:5432/docuseal

lib/accounts.rb

@@ -79,13 +79,17 @@ module Accounts
   end
 
   def load_webhook_url(account)
+    load_webhook_config(account)&.value.presence
+  end
+
+  def load_webhook_config(account)
     configs = account.encrypted_configs.find_by(key: EncryptedConfig::WEBHOOK_URL_KEY)
 
     if !configs && !Docuseal.multitenant? && !account.testing?
       configs = Account.order(:id).first.encrypted_configs.find_by(key: EncryptedConfig::WEBHOOK_URL_KEY)
     end
 
-    configs&.value.presence
+    configs
   end
 
   def load_webhook_preferences(account)

lib/pdf_utils.rb

@@ -26,4 +26,19 @@ module PdfUtils
 
     decrypted_io.tap(&:rewind).read
   end
+
+  def merge(files)
+    merged_pdf = HexaPDF::Document.new
+
+    files.each do |file|
+      pdf = HexaPDF::Document.new(io: file)
+      pdf.pages.each { |page| merged_pdf.pages << merged_pdf.import(page) }
+    end
+
+    merged_content = StringIO.new
+    merged_pdf.write(merged_content)
+    merged_content.rewind
+
+    merged_content
+  end
 end

lib/submissions.rb

@@ -80,10 +80,10 @@ module Submissions
     emails
   end
 
-  def create_from_submitters(template:, user:, submissions_attrs:, source:, mark_as_sent: false,
+  def create_from_submitters(template:, user:, submissions_attrs:, source:,
                              submitters_order: DEFAULT_SUBMITTERS_ORDER, params: {})
     Submissions::CreateFromSubmitters.call(
-      template:, user:, submissions_attrs:, source:, mark_as_sent:, submitters_order:, params:
+      template:, user:, submissions_attrs:, source:, submitters_order:, params:
     )
   end
 
@@ -107,6 +107,8 @@ module Submissions
     return email.downcase if email.to_s.include?(',')
     return email.downcase if email.to_s.include?('.gob')
     return email.downcase if email.to_s.include?('.om')
+    return email.downcase if email.to_s.include?('.mm')
+    return email.downcase if email.to_s.include?('.cm')
     return email.downcase unless email.to_s.include?('.')
 
     fixed_email = EmailTypo.call(email.delete_prefix('<'))

lib/submissions/create_from_submitters.rb

@@ -4,7 +4,7 @@ module Submissions
   module CreateFromSubmitters
     module_function
 
-    def call(template:, user:, submissions_attrs:, source:, submitters_order:, mark_as_sent: false, params: {})
+    def call(template:, user:, submissions_attrs:, source:, submitters_order:, params: {})
       preferences = Submitters.normalize_preferences(user.account, user, params)
 
       Array.wrap(submissions_attrs).filter_map do |attrs|
@@ -17,6 +17,7 @@ module Submissions
         submission = template.submissions.new(created_by_user: user, source:,
                                               account_id: user.account_id,
                                               preferences: set_submission_preferences,
+                                              expire_at: attrs[:expire_at],
                                               template_submitters: [], submitters_order:)
 
         maybe_set_template_fields(submission, attrs[:submitters])
@@ -32,7 +33,7 @@ module Submissions
           is_order_sent = submitters_order == 'random' || index.zero?
 
           build_submitter(submission:, attrs: submitter_attrs, uuid:,
-                          is_order_sent:, mark_as_sent:, user:,
+                          is_order_sent:, user:,
                           preferences: preferences.merge(submission_preferences))
         end
 
@@ -149,7 +150,7 @@ module Submissions
       uuid || template.submitters[index]&.dig('uuid')
     end
 
-    def build_submitter(submission:, attrs:, uuid:, is_order_sent:, mark_as_sent:, user:, preferences:)
+    def build_submitter(submission:, attrs:, uuid:, is_order_sent:, user:, preferences:)
       email = Submissions.normalize_email(attrs[:email])
       submitter_preferences = Submitters.normalize_preferences(submission.account, user, attrs)
       values = attrs[:values] || {}
@@ -166,7 +167,6 @@ module Submissions
           name: attrs[:name],
           external_id: attrs[:external_id].presence || attrs[:application_key],
           completed_at: attrs[:completed].present? ? Time.current : nil,
-          sent_at: mark_as_sent && email.present? && is_order_sent ? Time.current : nil,
           values: values.except(phone_field_uuid),
           metadata: attrs[:metadata] || {},
           preferences: preferences.merge(submitter_preferences)
@@ -175,6 +175,9 @@ module Submissions
           uuid:
         )
 
+      submitter.sent_at =
+        submitter.preferences['send_email'] != false && email.present? && is_order_sent ? Time.current : nil
+
       assign_completed_attributes(submitter) if submitter.completed_at?
 
       submitter

lib/submissions/generate_audit_trail.rb

@@ -48,9 +48,11 @@ module Submissions
 
       document.sign(io, **sign_params)
 
+      Submissions::GenerateResultAttachments.maybe_enable_ltv(io, sign_params)
+
       ActiveStorage::Attachment.create!(
         blob: ActiveStorage::Blob.create_and_upload!(
-          io: StringIO.new(io.string), filename: "Audit Log - #{submission.template.name}.pdf"
+          io: io.tap(&:rewind), filename: "Audit Log - #{submission.template.name}.pdf"
         ),
         name: 'audit_trail',
         record: submission
@@ -100,6 +102,8 @@ module Submissions
                 .rectangle(0, 0, box.width, 20)
                 .rectangle(0, box.height - 20, box.width, 20)
                 .fill
+
+          maybe_add_background(canvas, submission, page_size)
         end
         style.frame = style.create_frame(canvas.context, 50)
       end
@@ -222,6 +226,7 @@ module Submissions
 
         submission.template_fields.filter_map do |field|
           next if field['submitter_uuid'] != submitter.uuid
+          next if field['type'] == 'heading'
 
           submitter_field_counters[field['type']] += 1
 
@@ -333,6 +338,8 @@ module Submissions
       'Signed with DocuSeal.co'
     end
 
+    def maybe_add_background(_canvas, _submission, _page_size); end
+
     def add_logo(column, _submission = nil)
       column.image(PdfIcons.logo_io, width: 40, height: 40, position: :float)
 

lib/submissions/generate_combined_attachment.rb

@@ -24,9 +24,11 @@ module Submissions
 
       pdf.sign(io, **sign_params)
 
+      Submissions::GenerateResultAttachments.maybe_enable_ltv(io, sign_params)
+
       ActiveStorage::Attachment.create!(
         blob: ActiveStorage::Blob.create_and_upload!(
-          io: StringIO.new(io.string), filename: "#{submission.template.name}.pdf"
+          io: io.tap(&:rewind), filename: "#{submission.template.name}.pdf"
         ),
         name: 'combined_document',
         record: submission