Merge from docusealco/wip

Author: AlexBTurchyn

app/javascript/application.js

@@ -164,6 +164,7 @@ safeRegisterElement('template-builder', class extends HTMLElement {
     this.app = createApp(TemplateBuilder, {
       template,
       customFields: reactive(JSON.parse(this.dataset.customFields || '[]')),
+      dateFormats: JSON.parse(this.dataset.dateFormats || '[]'),
       dynamicDocuments: reactive(JSON.parse(this.dataset.dynamicDocuments || '[]')),
       backgroundColor: '#faf7f5',
       locale: this.dataset.locale,

app/javascript/submission_form/form.vue

@@ -1575,6 +1575,7 @@ export default {
       }
     },
     goToStep (stepIndex, scrollToArea = false, clickUpload = false) {
+      this.isInvite = false
       this.currentStep = stepIndex
       this.showFillAllRequiredFields = false
 
@@ -1599,6 +1600,10 @@ export default {
       })
     },
     saveStep (formData) {
+      if (!formData && !this.$refs.form) {
+        return
+      }
+
       const currentFieldUuids = this.currentStepFields.map((f) => f.uuid)
       const currentFieldType = this.currentField.type
 

app/javascript/template_builder/area.vue

@@ -319,7 +319,7 @@ export default {
       default: false
     }
   },
-  emits: ['start-resize', 'stop-resize', 'start-drag', 'stop-drag', 'remove', 'scroll-to', 'add-custom-field', 'click-title'],
+  emits: ['start-resize', 'stop-resize', 'start-drag', 'stop-drag', 'remove', 'scroll-to', 'add-custom-field', 'click-title', 'multi-select'],
   data () {
     return {
       isContenteditable: false,
@@ -798,6 +798,8 @@ export default {
           this.selectedAreasRef.value.splice(this.selectedAreasRef.value.indexOf(this.area), 1)
         }
 
+        this.$emit('multi-select', e)
+
         return
       }
 

app/javascript/template_builder/page.vue

@@ -57,6 +57,7 @@
         @scroll-to="$emit('scroll-to', $event)"
         @add-custom-field="$emit('add-custom-field', $event)"
         @contextmenu="openAreaContextMenu($event, item.area, item.field)"
+        @multi-select="openMultiSelectContextMenu"
         @click-title="closeContextMenu"
       />
       <FieldArea
@@ -408,6 +409,12 @@ export default {
         return
       }
 
+      if (this.selectedAreasRef.value.length >= 2) {
+        this.openSelectionContextMenu(event)
+
+        return
+      }
+
       event.preventDefault()
       event.stopPropagation()
 
@@ -443,6 +450,13 @@ export default {
         areas: this.selectedAreasRef.value
       }
     },
+    openMultiSelectContextMenu (event) {
+      if (this.selectedAreasRef.value.length >= 2) {
+        this.openSelectionContextMenu(event)
+      } else {
+        this.closeContextMenu()
+      }
+    },
     handleSelectionCopy () {
       this.$emit('copy-selected-areas')
 

app/javascript/template_builder/selection_context_menu.vue

@@ -9,6 +9,62 @@
       @mousedown.stop
       @pointerdown.stop
     >
+      <label
+        v-if="requiredFields.length"
+        class="field-settings-required w-full px-2 py-1 rounded-md hover:bg-neutral-100 flex items-center space-x-2 text-sm cursor-pointer"
+        @click.stop
+      >
+        <input
+          :checked="isAllRequired"
+          :indeterminate="isMixedRequired"
+          type="checkbox"
+          class="toggle toggle-xs"
+          :disabled="!editable"
+          @change="handleToggleRequired($event.target.checked)"
+          @click.stop
+        >
+        <span>{{ t('required') }}</span>
+      </label>
+      <label
+        v-if="readOnlyFields.length"
+        class="field-settings-read-only w-full px-2 py-1 rounded-md hover:bg-neutral-100 flex items-center space-x-2 text-sm cursor-pointer"
+        @click.stop
+      >
+        <input
+          :checked="isAllReadOnly"
+          :indeterminate="isMixedReadOnly"
+          type="checkbox"
+          class="toggle toggle-xs"
+          :disabled="!editable"
+          @change="handleToggleReadOnly($event.target.checked)"
+          @click.stop
+        >
+        <span>{{ t('read_only') }}</span>
+      </label>
+      <hr
+        v-if="requiredFields.length || readOnlyFields.length"
+        class="my-1 border-neutral-200"
+      >
+      <button
+        v-if="showFont"
+        class="w-full px-2 py-1 rounded-md hover:bg-neutral-100 flex items-center space-x-2 text-sm"
+        @click.stop="openFontModal"
+      >
+        <IconTypography class="w-4 h-4" />
+        <span>{{ t('font') }}</span>
+      </button>
+      <button
+        v-if="showCondition"
+        class="w-full px-2 py-1 rounded-md hover:bg-neutral-100 flex items-center space-x-2 text-sm"
+        @click.stop="openConditionModal"
+      >
+        <IconRouteAltLeft class="w-4 h-4" />
+        <span>{{ t('condition') }}</span>
+      </button>
+      <hr
+        v-if="showFont || showCondition"
+        class="my-1 border-neutral-200"
+      >
       <ContextSubmenu
         :icon="IconLayoutAlignMiddle"
         :label="t('align')"
@@ -61,26 +117,6 @@
           <span>{{ t('height') }}</span>
         </button>
       </ContextSubmenu>
-      <hr
-        v-if="showFont || showCondition"
-        class="my-1 border-neutral-200"
-      >
-      <button
-        v-if="showFont"
-        class="w-full px-2 py-1 rounded-md hover:bg-neutral-100 flex items-center space-x-2 text-sm"
-        @click.stop="openFontModal"
-      >
-        <IconTypography class="w-4 h-4" />
-        <span>{{ t('font') }}</span>
-      </button>
-      <button
-        v-if="showCondition"
-        class="w-full px-2 py-1 rounded-md hover:bg-neutral-100 flex items-center space-x-2 text-sm"
-        @click.stop="openConditionModal"
-      >
-        <IconRouteAltLeft class="w-4 h-4" />
-        <span>{{ t('condition') }}</span>
-      </button>
       <hr class="my-1 border-neutral-200">
       <button
         class="w-full px-2 py-1 rounded-md hover:bg-neutral-100 flex items-center justify-between text-sm"
@@ -192,6 +228,24 @@ export default {
         return this.template.fields.find((f) => f.areas?.includes(area))
       }).filter(Boolean)
     },
+    requiredFields () {
+      return this.selectedFields.filter((f) => !['phone', 'stamp', 'verification', 'strikethrough', 'heading'].includes(f.type))
+    },
+    readOnlyFields () {
+      return this.selectedFields.filter((f) => ['text', 'number', 'radio', 'multiple', 'select'].includes(f.type))
+    },
+    isAllRequired () {
+      return this.requiredFields.every((f) => f.required)
+    },
+    isMixedRequired () {
+      return !this.isAllRequired && this.requiredFields.some((f) => f.required)
+    },
+    isAllReadOnly () {
+      return this.readOnlyFields.every((f) => f.readonly)
+    },
+    isMixedReadOnly () {
+      return !this.isAllReadOnly && this.readOnlyFields.some((f) => f.readonly)
+    },
     isMac () {
       return (navigator.userAgentData?.platform || navigator.platform)?.toLowerCase()?.includes('mac')
     },
@@ -234,6 +288,16 @@ export default {
         }
       }
     },
+    handleToggleRequired (value) {
+      this.requiredFields.forEach((field) => { field.required = value })
+
+      this.save()
+    },
+    handleToggleReadOnly (value) {
+      this.readOnlyFields.forEach((field) => { field.readonly = value })
+
+      this.save()
+    },
     onKeyDown (event) {
       if (event.key === 'Escape') {
         event.preventDefault()

app/models/account_config.rb

@@ -48,6 +48,7 @@ class AccountConfig < ApplicationRecord
   WITH_SIGNATURE_ID = 'with_signature_id'
   WITH_FILE_LINKS_KEY = 'with_file_links'
   WITH_SIGNATURE_ID_REASON_KEY = 'with_signature_id_reason'
+  WITH_SIGNATURE_ID_COMPLETED_AT_KEY = 'with_signature_id_completed_at'
   RECIPIENT_FORM_FIELDS_KEY = 'recipient_form_fields'
   WITH_AUDIT_VALUES_KEY = 'with_audit_values'
   WITH_AUDIT_SENDER_KEY = 'with_audit_sender'
@@ -59,6 +60,7 @@ class AccountConfig < ApplicationRecord
   COMBINE_PDF_RESULT_KEY = 'combine_pdf_result_key'
   DOCUMENT_FILENAME_FORMAT_KEY = 'document_filename_format'
   TEMPLATE_CUSTOM_FIELDS_KEY = 'template_custom_fields'
+  TEMPLATE_DATE_FORMATS_KEY = 'template_date_formats'
   POLICY_LINKS_KEY = 'policy_links'
   ENABLE_MCP_KEY = 'enable_mcp'
 

app/views/icons/_message.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="M8 9h8" />
+  <path d="M8 13h6" />
+  <path d="M18 4a3 3 0 0 1 3 3v8a3 3 0 0 1 -3 3h-5l-5 3v-3h-2a3 3 0 0 1 -3 -3v-8a3 3 0 0 1 3 -3h12" />
+</svg>

app/views/shared/_navbar.html.erb

@@ -75,7 +75,7 @@
               <%= svg_icon('logout', class: 'w-5 h-5 flex-shrink-0 stroke-2 inline') %>
               <span class="whitespace-nowrap"><%= t('sign_out') %></span>
             </button>
-            <%= button_to '', destroy_user_session_path, method: :delete, data: { turbo: false }, form: { id: 'destroy_user_session_form' }, form_class: 'hidden' %>
+            <%= button_to '', destroy_user_session_path, method: :delete, form: { id: 'destroy_user_session_form', data: { turbo: false } }, form_class: 'hidden' %>
           </li>
         </ul>
       </div>

app/views/shared/_settings_nav.html.erb

@@ -132,7 +132,7 @@
         <%= capture do %>
           <div class="tooltip" data-tip="<%= t('ai_assistant') %>">
             <a href="<%= Docuseal::CHATGPT_URL %>" target="_blank" class="btn btn-circle btn-primary btn-md">
-              <%= svg_icon('brand_openai', class: 'w-8 h-8') %>
+              <%= svg_icon('message', class: 'w-8 h-8') %>
             </a>
           </div>
         <% end %>

app/views/submissions/_send_email_base.html.erb

@@ -47,7 +47,7 @@
 <% is_edit_viewer = local_assigns[:submitter] && local_assigns[:viewer_submitter_uuids].include?(local_assigns[:submitter].uuid) %>
 <div id="<%= message_field_id %>" class="card card-compact bg-base-300/40 hidden">
   <div class="card-body">
-    <%= tag.input id: toggle_uuid = SecureRandom.uuid, value: '1', name: 'request_email_per_submitter', class: 'peer', type: 'checkbox', hidden: true, checked: local_assigns[:message_per_submitter] != false && template_submitters.size < 5 && template&.preferences&.dig('submitters').to_a.size > 1 %>
+    <%= tag.input id: toggle_uuid = SecureRandom.uuid, value: '1', name: 'request_email_per_submitter', class: 'peer', type: 'checkbox', hidden: true, checked: local_assigns[:message_per_submitter] != false && template_submitters.size < 11 && template&.preferences&.dig('submitters').to_a.size > 1 %>
     <% if local_assigns[:viewer_submitter_uuids].present? && local_assigns[:submitter].blank? %>
       <% (template_submitters.pluck('uuid') - local_assigns[:viewer_submitter_uuids].to_a).each do |signer_uuid| %>
         <%= hidden_field_tag 'email_message_submitter_uuids[]', signer_uuid %>
@@ -57,7 +57,7 @@
       <div class="form-control">
         <div class="flex justify-between">
           <%= f.label :subject, t('subject'), class: 'label' %>
-          <% if template_submitters.size > 1 && template_submitters.size < 5 && local_assigns[:message_per_submitter] != false %>
+          <% if template_submitters.size > 1 && template_submitters.size < 11 && local_assigns[:message_per_submitter] != false %>
             <label for="<%= toggle_uuid %>" class="label underline">
               <%= t('edit_per_party') %>
             </label>
@@ -78,16 +78,18 @@
       </div>
       <%= render 'submissions/message_fields' %>
     </div>
-    <% if template_submitters.size > 1 && template_submitters.size < 5 && local_assigns[:message_per_submitter] != false %>
+    <% if template_submitters.size > 1 && template_submitters.size < 11 && local_assigns[:message_per_submitter] != false %>
       <div class="hidden peer-checked:block form-control space-y-2">
         <% uuid = SecureRandom.uuid %>
         <% options = template_submitters.map { |e| [e['name'], "request_email_#{uuid}_#{e['uuid']}"] } %>
         <toggle-visible data-element-ids="<%= options.map(&:last).to_json %>" class="flex relative px-1">
-          <ul class="tabs w-full flex flex-nowrap">
+          <ul class="tabs w-full min-w-0 flex flex-nowrap">
             <% options.each_with_index do |(label, val), index| %>
-              <div class="w-full">
+              <div class="w-full min-w-0 has-[:checked]:min-w-fit">
                 <%= f.radio_button :selected, val, checked: index.zero?, id: "#{val}_radio", data: { action: 'click:toggle-visible#trigger' }, class: 'hidden peer' %>
-                <%= f.label :selected, label, value: val, for: "#{val}_radio", class: 'tab w-full tab-lifted peer-checked:tab-active !bg-transparent' %>
+                <%= f.label :selected, value: val, for: "#{val}_radio", class: 'tab w-full tab-lifted peer-checked:tab-active !bg-transparent !px-2' do %>
+                  <span class="truncate" title="<%= label %>"><%= label %></span>
+                <% end %>
               </div>
             <% end %>
           </ul>