fix completed page

README.md

@@ -26,6 +26,8 @@ DocuSeal is an open source platform that provides secure and efficient digital d
 </p>
 <h2 align="center">
   <a href="https://demo.docuseal.co">✨ Live Demo</a>
+  <span>|</span>
+  <a href="https://docuseal.co/sign_up">☁️ Try in Cloud</a>
 </h2>
 
 [![Demo](https://github.com/docusealco/docuseal/assets/5418788/d8703ea3-361a-423f-8bfe-eff1bd9dbe14)](https://demo.docuseal.co)
@@ -42,11 +44,20 @@ DocuSeal is an open source platform that provides secure and efficient digital d
 - [x] Mobile-optimized
 - [x] Easy to deploy in minutes
 
+## For Companies
+### Integrate seamless document signing into your web or mobile apps with DocuSeal!
+
+At DocuSeal we have expertise and technologies to make documents creation, filling, signing and processing seamlessly integrated with your product. We specialize in working with various industries, including **Banking, Healthcare, Transport, eCommerce, KYC, CRM, and other software products** that require bulk document signing. By leveraging DocuSeal, we can assist in reducing the overall cost of developing and processing electronic documents while ensuring security and compliance with local electronic document laws.
+
+[![Book an Integration Demo](https://cal.com/book-with-cal-dark.svg)](https://cal.com/docuseal)
+
 ## Deploy
 
-| Heroku                                                                       | Railway                                                                      | DigitalOcean                                                                 |
+|Heroku|Railway|
-| ---------------------------------------------------------------------------- | --------------------------------------------------------------------------- | --------------------------------------------------------------------------- |
+|:--:|:---:|
-| [<img alt="Deploy on Heroku" src="https://www.herokucdn.com/deploy/button.svg" height="40">](https://heroku.com/deploy?template=https://github.com/docusealco/docuseal-heroku)   | [<img alt="Deploy on Railway" src="https://railway.app/button.svg" height="40">](https://railway.app/template/IGoDnc?referralCode=ruU7JR)             | [<img alt="Deploy on DigitalOcean" src="https://www.deploytodo.com/do-btn-blue.svg" height="40">](https://cloud.digitalocean.com/apps/new?repo=https://github.com/docusealco/docuseal-digitalocean/tree/master&refcode=421d50f53990) |
+| [<img alt="Deploy on Heroku" src="https://www.herokucdn.com/deploy/button.svg" height="40">](https://heroku.com/deploy?template=https://github.com/docusealco/docuseal-heroku) | [<img alt="Deploy on Railway" src="https://railway.app/button.svg" height="40">](https://railway.app/template/IGoDnc?referralCode=ruU7JR)|
+|**DigitalOcean**|**Render**|
+| [<img alt="Deploy on DigitalOcean" src="https://www.deploytodo.com/do-btn-blue.svg" height="40">](https://cloud.digitalocean.com/apps/new?repo=https://github.com/docusealco/docuseal-digitalocean/tree/master&refcode=421d50f53990) | [<img alt="Deploy to Render" src="https://render.com/images/deploy-to-render-button.svg" height="40">](https://render.com/deploy?repo=https://github.com/docusealco/docuseal-render)
 
 
 #### Docker

app/controllers/submissions_controller.rb

@@ -22,14 +22,16 @@ class SubmissionsController < ApplicationController
         create_submissions_from_submitters
       end
 
+    submitters = submissions.flat_map(&:submitters)
+
     if params[:send_email] == '1'
-      submissions.flat_map(&:submitters).each do |submitter|
+      submitters.each do |submitter|
         SubmitterMailer.invitation_email(submitter, message: params[:message]).deliver_later!
       end
     end
 
     redirect_to template_path(@template),
-                notice: "#{submissions.size} #{'recipient'.pluralize(submissions.size)} added"
+                notice: "#{submitters.size} #{'recipient'.pluralize(submitters.size)} added"
   end
 
   def destroy

app/javascript/submission_form/area.vue

@@ -25,10 +25,10 @@
       class="absolute -top-7 rounded bg-base-content text-base-100 px-2 text-sm whitespace-nowrap"
     >
       {{ field.name || fieldNames[field.type] }}
-      <template v-if="field.type === 'checkbox'">
+      <template v-if="field.type === 'checkbox' && !field.name">
         {{ fieldIndex + 1 }}
       </template>
-      <template v-else-if="!field.required">
+      <template v-else-if="!field.required && field.type !== 'checkbox'">
         (optional)
       </template>
     </div>

app/javascript/submission_form/completed.vue

@@ -51,6 +51,16 @@
           Star on Github
         </span>
       </a>
+      <a
+        v-if="isDemo"
+        href="https://docuseal.co/sign_up"
+        class="white-button flex items-center space-x-1 w-full"
+      >
+        <IconLogin />
+        <span>
+          Create a Free Account
+        </span>
+      </a>
     </div>
     <div class="text-center mt-4">
       Signed with
@@ -64,7 +74,7 @@
 </template>
 
 <script>
-import { IconCircleCheck, IconBrandGithub, IconMail, IconDownload, IconInnerShadowTop } from '@tabler/icons-vue'
+import { IconCircleCheck, IconBrandGithub, IconMail, IconDownload, IconInnerShadowTop, IconLogin } from '@tabler/icons-vue'
 
 export default {
   name: 'FormCompleted',
@@ -73,6 +83,7 @@ export default {
     IconInnerShadowTop,
     IconBrandGithub,
     IconMail,
+    IconLogin,
     IconDownload
   },
   props: {

app/javascript/submission_form/form.vue

@@ -5,7 +5,7 @@
     :values="values"
     :attachments-index="attachmentsIndex"
     :current-step="currentStepFields"
-    @focus-step="[saveStep(), goToStep($event, false, true)]"
+    @focus-step="[saveStep(), goToStep($event, false, true), currentField.type !== 'checkbox' ? isFormVisible = true : '']"
   />
   <button
     v-if="!isFormVisible"
@@ -20,7 +20,7 @@
     />
   </button>
   <div
-    v-else
+    v-show="isFormVisible"
     id="form_container"
     class="shadow-md bg-base-100 absolute bottom-0 md:bottom-4 w-full border-base-200 border p-4 rounded"
   >
@@ -213,7 +213,7 @@
                     @click="[$refs.areas.scrollIntoField(field), values[field.uuid] = !values[field.uuid]]"
                   >
                   <span class="text-xl">
-                    {{ currentField.name || currentField.type + ' ' + (index + 1) }}
+                    {{ field.name || field.type + ' ' + (index + 1) }}
                   </span>
                 </label>
               </div>
@@ -430,7 +430,7 @@ export default {
 
         this.$refs.form.querySelector('input[type="date"], input[type="text"], select')?.focus()
 
-        if (clickUpload && !this.values[this.currentField.uuid]) {
+        if (clickUpload && !this.values[this.currentField.uuid] && ['file', 'image'].includes(this.currentField.type)) {
           this.$refs.form.querySelector('input[type="file"]')?.click()
         }
       })

app/javascript/template_builder/area.vue

@@ -65,7 +65,7 @@
         @blur="onNameBlur"
       >{{ field.name || defaultName }}</span>
       <div
-        v-if="isNameFocus"
+        v-if="isNameFocus && field.type !== 'checkbox'"
         class="flex items-center ml-1.5"
       >
         <input

app/javascript/template_builder/builder.vue

@@ -314,7 +314,7 @@ export default {
         const field = {
           name: '',
           uuid: v4(),
-          required: true,
+          required: type !== 'checkbox',
           type,
           submitter_uuid: this.selectedSubmitter.uuid,
           areas: [area]
@@ -333,7 +333,7 @@ export default {
         type: this.dragFieldType,
         uuid: v4(),
         submitter_uuid: this.selectedSubmitter.uuid,
-        required: true
+        required: this.dragFieldType !== 'checkbox'
       }
 
       if (['select', 'multiple', 'radio'].includes(this.dragFieldType)) {

app/javascript/template_builder/field.vue

@@ -31,19 +31,21 @@
           v-if="isNameFocus"
           class="flex items-center relative"
         >
-          <input
+          <template v-if="field.type !== 'checkbox'">
-            :id="`required-checkbox-${field.uuid}`"
+            <input
-            v-model="field.required"
+              :id="`required-checkbox-${field.uuid}`"
-            type="checkbox"
+              v-model="field.required"
-            class="checkbox checkbox-xs no-animation rounded"
+              type="checkbox"
-            @mousedown.prevent
+              class="checkbox checkbox-xs no-animation rounded"
-          >
+              @mousedown.prevent
-          <label
+            >
-            :for="`required-checkbox-${field.uuid}`"
+            <label
-            class="label text-xs"
+              :for="`required-checkbox-${field.uuid}`"
-            @click.prevent="field.required = !field.required"
+              class="label text-xs"
-            @mousedown.prevent
+              @click.prevent="field.required = !field.required"
-          >Required</label>
+              @mousedown.prevent
+            >Required</label>
+          </template>
         </div>
         <div
           v-else

app/javascript/template_builder/fields.vue

@@ -171,7 +171,7 @@ export default {
       const field = {
         name: '',
         uuid: v4(),
-        required: true,
+        required: type !== 'checkbox',
         submitter_uuid: this.selectedSubmitter.uuid,
         type
       }

app/views/pages/landing.html.erb

@@ -8,7 +8,7 @@
             DocuSeal
           </h1>
         </div>
-        <h2 class="mb-16 text-lg text-center text-gray-500">
+        <h2 class="mb-16 text-lg text-center text-gray-600">
           A self-hosted and open-source web platform that provides secure and efficient digital document signing and processing.
         </h2>
       </div>
@@ -22,7 +22,7 @@
             </div>
             <h3 class="mb-4 text-2xl font-semibold">Easy to Start</h3>
             <p class="text-base text-gray-500">
-              Run on your own host using <a href="https://hub.docker.com/r/docuseal/docuseal" class="link link-neutral font-bold" target="_blank">Docker</a> container, or deploy on  your favorite managed PaaS with a single <a href="https:///www.docuseal.co/install" class="link link-neutral font-bold">click</a>.
+              Run on your own host using <a href="https://hub.docker.com/r/docuseal/docuseal" class="link link-neutral font-bold" target="_blank">Docker</a> container, or deploy on  your favorite managed PaaS with a single <a href="https://www.docuseal.co/install" class="link link-neutral font-bold">click</a>.
             </p>
           </div>
         </div>
@@ -70,3 +70,4 @@
     </div>
   </div>
 </section>
+<%= render 'shared/attribution' %>

app/views/shared/_turbo_modal.html.erb

@@ -1,7 +1,7 @@
 <turbo-frame id="modal">
-  <turbo-modal class="modal modal-open items-start !animate-none">
+  <turbo-modal class="modal modal-open items-start !animate-none overflow-y-auto">
     <div class="absolute top-0 bottom-0 right-0 left-0" data-action="click:turbo-modal#close"></div>
-    <div class="modal-box pt-4 pb-6 px-6 mt-20">
+    <div class="modal-box pt-4 pb-6 px-6 mt-20 max-h-none">
       <% if local_assigns[:title] %>
         <div class="flex justify-between items-center border-b pb-2 mb-2 font-medium">
           <span>

app/views/start_form/completed.html.erb

@@ -9,7 +9,7 @@
           <h1 class="text-5xl font-bold text-center">DocuSeal</h1>
         </a>
       </div>
-      <div class="flex items-center bg-base-300 rounded-xl p-4 mb-4">
+      <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') %>

app/views/start_form/show.html.erb

@@ -2,7 +2,7 @@
   <div class="space-y-6 mx-auto">
     <div class="space-y-6">
       <div class="text-center w-full space-y-6">
-        <a href="/" class="flex justify-center">
+        <a href="/" class="flex justify-center items-center">
           <span class="mr-3">
             <%= render 'shared/logo', width: '50px', height: '50px' %>
           </span>
@@ -10,14 +10,14 @@
         </a>
         <p class="text-xl font-semibold text-center">You have been invited to submit a form</p>
       </div>
-      <div class="flex items-center bg-base-300 rounded-xl p-4 mb-4">
+      <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>
             <p class="text-lg font-bold mb-1"><%= @template.name %></p>
-            <p class="text-sm">Invited by <%= @template.account.name %></p>
+            <p class="text-sm">Invited by <span class="font-semibold"><%= @template.account.name %></span></p>
           </div>
         </div>
       </div>

app/views/submit_form/completed.html.erb

@@ -9,7 +9,7 @@
           <h1 class="text-5xl font-bold text-center">DocuSeal</h1>
         </a>
       </div>
-      <div class="flex items-center bg-base-300 rounded-xl p-4 mb-4">
+      <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') %>
@@ -23,7 +23,7 @@
     </div>
     <div>
       <% if Accounts.can_send_emails?(@submitter.submission.template.account) %>
-        <%= button_to button_title(title: 'Send copy to Email', disabled_with: 'Sending', icon: svg_icon('mail_forward', class: 'w-6 h-6')), send_submission_email_index_path, params: { submitter_slug: @submitter.slug }, form: { onsubmit: 'event.submitter.disabled = true' }, class: 'base-button w-full' %>
+        <%= button_to button_title(title: 'Send copy to Email', disabled_with: 'Sending', icon: svg_icon('mail_forward', class: 'w-6 h-6')), send_submission_email_index_path, params: { submitter_slug: @submitter.slug }, form: { onsubmit: 'event.submitter.disabled = true' }, class: 'white-button w-full' %>
         <div class="divider">OR</div>
       <% end %>
       <download-button data-src="<%= submitter_download_index_path(@submitter.slug) %>" class="base-button w-full">

package.json

@@ -19,7 +19,7 @@
     "compression-webpack-plugin": "10.0.0",
     "css-loader": "^6.7.3",
     "css-minimizer-webpack-plugin": "^5.0.0",
-    "daisyui": "^3.1.5",
+    "daisyui": "^3.2.1",
     "mini-css-extract-plugin": "^2.7.5",
     "postcss": "^8.4.23",
     "postcss-import": "^15.1.0",

yarn.lock

@@ -2300,13 +2300,14 @@ csstype@^3.1.1:
   resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.2.tgz#1d4bf9d572f11c14031f0436e1c10bc1f571f50b"
   integrity sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==
 
-daisyui@^3.1.5:
+daisyui@^3.2.1:
-  version "3.1.5"
+  version "3.2.1"
-  resolved "https://registry.yarnpkg.com/daisyui/-/daisyui-3.1.5.tgz#49cb961d03504beebd238d58f0169dbe81103c95"
+  resolved "https://registry.yarnpkg.com/daisyui/-/daisyui-3.2.1.tgz#7fac542b03023adbde2afc869518840dbef509ee"
-  integrity sha512-3nk5L//IU31ISzsonKEFG8ris8hS/MRAc+PrOTOyRbssjv1fYmNKSdIrOhG6op2ED3RyJL4p6I81JUwd7RWqTw==
+  integrity sha512-gIqE6wiqoJt9G8+n3R/SwLeUnpNCE2eDhT73rP0yZYVaM7o6zVcakBH3aEW5RGpx3UkonPiLuvcgxRcb2lE8TA==
   dependencies:
     colord "^2.9"
     css-selector-tokenizer "^0.8"
+    postcss "^8"
     postcss-js "^4"
     tailwindcss "^3"
 
@@ -4448,6 +4449,15 @@ postcss-value-parser@^4.0.0, postcss-value-parser@^4.1.0, postcss-value-parser@^
   resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz#723c09920836ba6d3e5af019f92bc0971c02e514"
   integrity sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==
 
+postcss@^8:
+  version "8.4.26"
+  resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.26.tgz#1bc62ab19f8e1e5463d98cf74af39702a00a9e94"
+  integrity sha512-jrXHFF8iTloAenySjM/ob3gSj7pCu0Ji49hnjqzsgSRa50hkWCKD0HQ+gMNJkW38jBI68MpAAg7ZWwHwX8NMMw==
+  dependencies:
+    nanoid "^3.3.6"
+    picocolors "^1.0.0"
+    source-map-js "^1.0.2"
+
 postcss@^8.1.10, postcss@^8.4.21, postcss@^8.4.23:
   version "8.4.23"
   resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.23.tgz#df0aee9ac7c5e53e1075c24a3613496f9e6552ab"