ESC-539 - Refactor SignatureInput Component for Consistency and Enhanced Logic (#749)

* Refactor SignatureInput Component for Consistency and Enhanced Logic

- Updated the `SignatureInput.vue` component to use `InputWrapper` instead of `input-wrapper` for consistency with naming conventions.
- Added logic to reset the signature field value when the model value is an array, improving handling of Notion database data.
- Enhanced the `mounted` lifecycle hook to ensure the signature pad canvas is resized correctly after rendering.
- Improved error handling in the file upload process by capturing the error in the catch block.

These changes aim to enhance the maintainability and functionality of the `SignatureInput` component, ensuring better user experience and consistency across the codebase.

* Refactor SignatureInput Component to Remove Unused ModelValue Logic

- Removed the modelValue handler logic from the `SignatureInput.vue` component, simplifying the component's state management.
- Cleaned up the created lifecycle hook by eliminating unnecessary checks related to Notion array data handling.

These changes aim to enhance the maintainability of the `SignatureInput` component by streamlining its logic and improving overall code clarity.

* fix lint

---------

Co-authored-by: Julien Nahum <julien@nahum.net>

client/components/forms/SignatureInput.vue

@@ -1,5 +1,5 @@
 <template>
-  <input-wrapper v-bind="inputWrapperProps">
+  <InputWrapper v-bind="inputWrapperProps">
     <template #label>
       <slot name="label" />
     </template>
@@ -7,6 +7,7 @@
     <div
       v-if="loading || file"
       :class="[
+        theme.default.input,
         theme.SignatureInput.input,
         theme.SignatureInput.spacing.horizontal,
         theme.SignatureInput.spacing.vertical,
@@ -43,6 +44,7 @@
       ref="signaturePad"
       class="not-draggable"
       :class="[
+        theme.default.input,
         theme.SignatureInput.input,
         theme.SignatureInput.spacing.horizontal,
         theme.SignatureInput.spacing.vertical,
@@ -91,17 +93,17 @@
     <template #error>
       <slot name="error" />
     </template>
-  </input-wrapper>
+  </InputWrapper>
 </template>
 
 <script>
-import { inputProps, useFormInput } from "./useFormInput.js"
+import { VueSignaturePad } from 'vue-signature-pad'
-import InputWrapper from "./components/InputWrapper.vue"
+import { inputProps, useFormInput } from './useFormInput.js'
-import { VueSignaturePad } from "vue-signature-pad"
+import InputWrapper from './components/InputWrapper.vue'
-import { storeFile } from "~/lib/file-uploads.js"
+import { storeFile } from '~/lib/file-uploads.js'
 
 export default {
-  name: "SignatureInput",
+  name: 'SignatureInput',
   components: { InputWrapper, VueSignaturePad },
 
   props: {
@@ -126,6 +128,14 @@ export default {
       }
     }
   },
+  
+  mounted() {
+    this.$nextTick(() => {
+      if (this.$refs.signaturePad) {
+        this.$refs.signaturePad.resizeCanvas()
+      }
+    })
+  },
 
   methods: {
     clear() {
@@ -138,7 +148,7 @@ export default {
         this.form[this.name] = null
         return
       }
-      
+
       if (this.disabled) {
         this.$refs.signaturePad.clearSignature()
       } else {