Feature/auto confirm barcode scanner (#12859)

* Add autoConfirm scan

* Don't auto confirm if validation fails

* Set status light to red if invalid

packages/client/manifest.json

@@ -3969,6 +3969,12 @@
         "key": "allowManualEntry",
         "defaultValue": false
       },
+      {
+        "type": "boolean",
+        "label": "Auto confirm",
+        "key": "autoConfirm",
+        "defaultValue": false
+      },
       {
         "type": "boolean",
         "label": "Play sound on scan",

packages/client/src/components/app/forms/CodeScanner.svelte

@@ -14,11 +14,13 @@
   export let value
   export let disabled = false
   export let allowManualEntry = false
+  export let autoConfirm = false
   export let scanButtonText = "Scan code"
   export let beepOnScan = false
   export let beepFrequency = 2637
   export let customFrequency = 1046
   export let preferredCamera = "environment"
+  export let validator
 
   const dispatch = createEventDispatcher()
 
@@ -41,6 +43,9 @@
         beep()
       }
       dispatch("change", decodedText)
+      if (autoConfirm && !validator?.(decodedText)) {
+        camModal?.hide()
+      }
     }
   }
 
@@ -127,7 +132,11 @@
 <div class="scanner-video-wrapper">
   {#if value && !manualMode}
     <div class="scanner-value field-display">
-      <StatusLight positive />
+      {#if validator?.(value)}
+        <StatusLight negative />
+      {:else}
+        <StatusLight positive />
+      {/if}
       {value}
     </div>
   {/if}
@@ -183,11 +192,16 @@
       </div>
       {#if cameraEnabled === true}
         <div class="code-wrap">
-          {#if value}
+          {#if value && !validator?.(value)}
             <div class="scanner-value">
               <StatusLight positive />
               {value}
             </div>
+          {:else if value && validator?.(value)}
+            <div class="scanner-value">
+              <StatusLight negative />
+              {value}
+            </div>
           {:else}
             <div class="scanner-value">
               <StatusLight neutral />

packages/client/src/components/app/forms/CodeScannerField.svelte

@@ -11,6 +11,7 @@
   export let defaultValue = ""
   export let onChange
   export let allowManualEntry
+  export let autoConfirm
   export let scanButtonText
   export let beepOnScan
   export let beepFrequency
@@ -49,11 +50,13 @@
       on:change={handleUpdate}
       disabled={fieldState.disabled || fieldState.readonly}
       {allowManualEntry}
+      {autoConfirm}
       scanButtonText={scanText}
       {beepOnScan}
       {beepFrequency}
       {customFrequency}
       {preferredCamera}
+      validator={fieldState.validator}
     />
   {/if}
 </Field>