diff --git a/src/storybook/__snapshots__/Stories.test.ts.snap b/src/storybook/__snapshots__/Stories.test.ts.snap
index 1781099b3..c0e8d3ff8 100644
--- a/src/storybook/__snapshots__/Stories.test.ts.snap
+++ b/src/storybook/__snapshots__/Stories.test.ts.snap
@@ -44386,7 +44386,7 @@ exports[`Storyshots Views / Discounts / Sale create form errors 1`] = `
                 <p
                   class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id"
                 >
-                  Generic form error
+                  Invalid value
                 </p>
               </div>
             </div>
@@ -44598,7 +44598,7 @@ exports[`Storyshots Views / Discounts / Sale create form errors 1`] = `
                   <p
                     class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id"
                   >
-                    Generic form error
+                    Invalid value
                   </p>
                 </div>
                 <div
@@ -44638,7 +44638,7 @@ exports[`Storyshots Views / Discounts / Sale create form errors 1`] = `
                   <p
                     class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id"
                   >
-                    Generic form error
+                    Invalid value
                   </p>
                 </div>
               </div>
@@ -46628,7 +46628,7 @@ exports[`Storyshots Views / Discounts / Sale details form errors 1`] = `
                 <p
                   class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
                 >
-                  Generic form error
+                  Invalid value
                 </p>
               </div>
             </div>
@@ -46838,7 +46838,7 @@ exports[`Storyshots Views / Discounts / Sale details form errors 1`] = `
                 <p
                   class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
                 >
-                  Generic form error
+                  Invalid value
                 </p>
               </div>
             </div>
@@ -47152,7 +47152,7 @@ exports[`Storyshots Views / Discounts / Sale details form errors 1`] = `
                   <p
                     class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
                   >
-                    Generic form error
+                    Invalid value
                   </p>
                 </div>
                 <div
@@ -47192,7 +47192,7 @@ exports[`Storyshots Views / Discounts / Sale details form errors 1`] = `
                   <p
                     class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
                   >
-                    Generic form error
+                    Invalid value
                   </p>
                 </div>
               </div>
@@ -51345,7 +51345,7 @@ exports[`Storyshots Views / Discounts / Voucher create form errors 1`] = `
                 <p
                   class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id"
                 >
-                  Generic form error
+                  Invalid value
                 </p>
               </div>
             </div>
@@ -51543,7 +51543,7 @@ exports[`Storyshots Views / Discounts / Voucher create form errors 1`] = `
                   <p
                     class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id"
                   >
-                    Generic form error
+                    Invalid value
                   </p>
                 </div>
               </div>
@@ -51983,7 +51983,7 @@ exports[`Storyshots Views / Discounts / Voucher create form errors 1`] = `
                   <p
                     class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id"
                   >
-                    Generic form error
+                    Invalid value
                   </p>
                 </div>
                 <div
@@ -52023,7 +52023,7 @@ exports[`Storyshots Views / Discounts / Voucher create form errors 1`] = `
                   <p
                     class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id"
                   >
-                    Generic form error
+                    Invalid value
                   </p>
                 </div>
               </div>
@@ -53223,7 +53223,7 @@ exports[`Storyshots Views / Discounts / Voucher details form errors 1`] = `
                 <p
                   class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-disabled-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
                 >
-                  Generic form error
+                  Invalid value
                 </p>
               </div>
             </div>
@@ -53421,7 +53421,7 @@ exports[`Storyshots Views / Discounts / Voucher details form errors 1`] = `
                   <p
                     class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id"
                   >
-                    Generic form error
+                    Invalid value
                   </p>
                 </div>
               </div>
@@ -53501,7 +53501,7 @@ exports[`Storyshots Views / Discounts / Voucher details form errors 1`] = `
                 <p
                   class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
                 >
-                  Generic form error
+                  Invalid value
                 </p>
               </div>
               <div
@@ -53628,7 +53628,7 @@ exports[`Storyshots Views / Discounts / Voucher details form errors 1`] = `
                 <p
                   class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id"
                 >
-                  Generic form error
+                  Invalid value
                 </p>
               </div>
               <hr
@@ -53899,7 +53899,7 @@ exports[`Storyshots Views / Discounts / Voucher details form errors 1`] = `
                 <p
                   class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
                 >
-                  Generic form error
+                  Invalid value
                 </p>
               </div>
             </div>
@@ -54042,7 +54042,7 @@ exports[`Storyshots Views / Discounts / Voucher details form errors 1`] = `
                   <p
                     class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
                   >
-                    Generic form error
+                    Invalid value
                   </p>
                 </div>
                 <div
@@ -54082,7 +54082,7 @@ exports[`Storyshots Views / Discounts / Voucher details form errors 1`] = `
                   <p
                     class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
                   >
-                    Generic form error
+                    Invalid value
                   </p>
                 </div>
               </div>
@@ -120764,9 +120764,8 @@ exports[`Storyshots Views / Shipping / Shipping zone details default 1`] = `
                 class="CardTitle-toolbar-id"
               >
                 <button
-                  class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id MuiButton-disabled-id MuiButtonBase-disabled-id"
-                  disabled=""
-                  tabindex="-1"
+                  class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id"
+                  tabindex="0"
                   type="button"
                 >
                   <span
@@ -121087,9 +121086,8 @@ exports[`Storyshots Views / Shipping / Shipping zone details form errors 1`] = `
                 class="CardTitle-toolbar-id"
               >
                 <button
-                  class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id MuiButton-disabled-id MuiButtonBase-disabled-id"
-                  disabled=""
-                  tabindex="-1"
+                  class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id"
+                  tabindex="0"
                   type="button"
                 >
                   <span
@@ -121175,9 +121173,8 @@ exports[`Storyshots Views / Shipping / Shipping zone details form errors 1`] = `
                 class="CardTitle-toolbar-id"
               >
                 <button
-                  class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id MuiButton-disabled-id MuiButtonBase-disabled-id"
-                  disabled=""
-                  tabindex="-1"
+                  class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id"
+                  tabindex="0"
                   type="button"
                 >
                   <span
@@ -121715,8 +121712,9 @@ exports[`Storyshots Views / Shipping / Shipping zone details loading 1`] = `
                 class="CardTitle-toolbar-id"
               >
                 <button
-                  class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id"
-                  tabindex="0"
+                  class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id MuiButton-disabled-id MuiButtonBase-disabled-id"
+                  disabled=""
+                  tabindex="-1"
                   type="button"
                 >
                   <span
@@ -121802,8 +121800,9 @@ exports[`Storyshots Views / Shipping / Shipping zone details loading 1`] = `
                 class="CardTitle-toolbar-id"
               >
                 <button
-                  class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id"
-                  tabindex="0"
+                  class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id MuiButton-disabled-id MuiButtonBase-disabled-id"
+                  disabled=""
+                  tabindex="-1"
                   type="button"
                 >
                   <span
@@ -121968,8 +121967,9 @@ exports[`Storyshots Views / Shipping / Shipping zone details loading 1`] = `
                 class="CardTitle-toolbar-id"
               >
                 <button
-                  class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id"
-                  tabindex="0"
+                  class="MuiButtonBase-root-id MuiButton-root-id MuiButton-text-id MuiButton-textPrimary-id MuiButton-disabled-id MuiButtonBase-disabled-id"
+                  disabled=""
+                  tabindex="-1"
                   type="button"
                 >
                   <span
@@ -131353,16 +131353,16 @@ exports[`Storyshots Views / Webhooks / Create webhook default 1`] = `
                 class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
               >
                 <label
-                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id"
+                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id"
                   data-shrink="false"
                 >
                   Webhook Name
                 </label>
                 <div
-                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-error-id MuiOutlinedInput-error-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
+                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
                 >
                   <input
-                    aria-invalid="true"
+                    aria-invalid="false"
                     class="MuiInputBase-input-id MuiOutlinedInput-input-id"
                     name="name"
                     type="text"
@@ -131383,11 +131383,6 @@ exports[`Storyshots Views / Webhooks / Create webhook default 1`] = `
                     </legend>
                   </fieldset>
                 </div>
-                <p
-                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id"
-                >
-                  Invalid value
-                </p>
               </div>
               <div
                 class="FormSpacer-spacer-id"
@@ -131469,16 +131464,16 @@ exports[`Storyshots Views / Webhooks / Create webhook default 1`] = `
                 class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
               >
                 <label
-                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id"
+                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id"
                   data-shrink="false"
                 >
                   Target URL
                 </label>
                 <div
-                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-error-id MuiOutlinedInput-error-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
+                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
                 >
                   <input
-                    aria-invalid="true"
+                    aria-invalid="false"
                     class="MuiInputBase-input-id MuiOutlinedInput-input-id"
                     name="targetUrl"
                     type="text"
@@ -131500,9 +131495,9 @@ exports[`Storyshots Views / Webhooks / Create webhook default 1`] = `
                   </fieldset>
                 </div>
                 <p
-                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id"
+                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id"
                 >
-                  Invalid value
+                  This URL will receive webhook POST requests
                 </p>
               </div>
               <div
@@ -131512,16 +131507,16 @@ exports[`Storyshots Views / Webhooks / Create webhook default 1`] = `
                 class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
               >
                 <label
-                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id"
+                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id"
                   data-shrink="false"
                 >
                   Secrect Key
                 </label>
                 <div
-                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-error-id MuiOutlinedInput-error-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
+                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
                 >
                   <input
-                    aria-invalid="true"
+                    aria-invalid="false"
                     class="MuiInputBase-input-id MuiOutlinedInput-input-id"
                     name="secretKey"
                     type="text"
@@ -131543,9 +131538,9 @@ exports[`Storyshots Views / Webhooks / Create webhook default 1`] = `
                   </fieldset>
                 </div>
                 <p
-                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id"
+                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id"
                 >
-                  Invalid value
+                  secret key is used to create a hash signature with each payload. *optional field
                 </p>
               </div>
             </div>
@@ -131937,16 +131932,16 @@ exports[`Storyshots Views / Webhooks / Create webhook form errors 1`] = `
                 class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
               >
                 <label
-                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id"
+                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id"
                   data-shrink="false"
                 >
                   Webhook Name
                 </label>
                 <div
-                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
+                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-error-id MuiOutlinedInput-error-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
                 >
                   <input
-                    aria-invalid="false"
+                    aria-invalid="true"
                     class="MuiInputBase-input-id MuiOutlinedInput-input-id"
                     name="name"
                     type="text"
@@ -131967,6 +131962,11 @@ exports[`Storyshots Views / Webhooks / Create webhook form errors 1`] = `
                     </legend>
                   </fieldset>
                 </div>
+                <p
+                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id"
+                >
+                  Invalid value
+                </p>
               </div>
               <div
                 class="FormSpacer-spacer-id"
@@ -132053,16 +132053,16 @@ exports[`Storyshots Views / Webhooks / Create webhook form errors 1`] = `
                 class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
               >
                 <label
-                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id"
+                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id"
                   data-shrink="false"
                 >
                   Target URL
                 </label>
                 <div
-                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
+                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-error-id MuiOutlinedInput-error-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
                 >
                   <input
-                    aria-invalid="false"
+                    aria-invalid="true"
                     class="MuiInputBase-input-id MuiOutlinedInput-input-id"
                     name="targetUrl"
                     type="text"
@@ -132084,9 +132084,9 @@ exports[`Storyshots Views / Webhooks / Create webhook form errors 1`] = `
                   </fieldset>
                 </div>
                 <p
-                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id"
+                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id"
                 >
-                  This URL will receive webhook POST requests
+                  Invalid value
                 </p>
               </div>
               <div
@@ -132096,16 +132096,16 @@ exports[`Storyshots Views / Webhooks / Create webhook form errors 1`] = `
                 class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
               >
                 <label
-                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id"
+                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id"
                   data-shrink="false"
                 >
                   Secrect Key
                 </label>
                 <div
-                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
+                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-error-id MuiOutlinedInput-error-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
                 >
                   <input
-                    aria-invalid="false"
+                    aria-invalid="true"
                     class="MuiInputBase-input-id MuiOutlinedInput-input-id"
                     name="secretKey"
                     type="text"
@@ -132127,9 +132127,9 @@ exports[`Storyshots Views / Webhooks / Create webhook form errors 1`] = `
                   </fieldset>
                 </div>
                 <p
-                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id"
+                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id"
                 >
-                  secret key is used to create a hash signature with each payload. *optional field
+                  Invalid value
                 </p>
               </div>
             </div>
@@ -132552,11 +132552,6 @@ exports[`Storyshots Views / Webhooks / Create webhook loading 1`] = `
                     </legend>
                   </fieldset>
                 </div>
-                <p
-                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
-                >
-                  Invalid value
-                </p>
               </div>
               <div
                 class="FormSpacer-spacer-id"
@@ -133143,16 +133138,16 @@ exports[`Storyshots Views / Webhooks / Webhook details default 1`] = `
                 class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
               >
                 <label
-                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id MuiFormLabel-filled-id"
+                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-filled-id"
                   data-shrink="true"
                 >
                   Webhook Name
                 </label>
                 <div
-                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-error-id MuiOutlinedInput-error-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
+                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
                 >
                   <input
-                    aria-invalid="true"
+                    aria-invalid="false"
                     class="MuiInputBase-input-id MuiOutlinedInput-input-id"
                     name="name"
                     type="text"
@@ -133254,16 +133249,16 @@ exports[`Storyshots Views / Webhooks / Webhook details default 1`] = `
                 class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
               >
                 <label
-                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id MuiFormLabel-filled-id"
+                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-filled-id"
                   data-shrink="true"
                 >
                   Target URL
                 </label>
                 <div
-                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-error-id MuiOutlinedInput-error-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
+                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
                 >
                   <input
-                    aria-invalid="true"
+                    aria-invalid="false"
                     class="MuiInputBase-input-id MuiOutlinedInput-input-id"
                     name="targetUrl"
                     type="text"
@@ -133285,9 +133280,9 @@ exports[`Storyshots Views / Webhooks / Webhook details default 1`] = `
                   </fieldset>
                 </div>
                 <p
-                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
+                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-filled-id"
                 >
-                  Invalid value
+                  This URL will receive webhook POST requests
                 </p>
               </div>
               <div
@@ -133297,16 +133292,16 @@ exports[`Storyshots Views / Webhooks / Webhook details default 1`] = `
                 class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
               >
                 <label
-                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id MuiFormLabel-filled-id"
+                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-filled-id"
                   data-shrink="true"
                 >
                   Secrect Key
                 </label>
                 <div
-                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-error-id MuiOutlinedInput-error-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
+                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
                 >
                   <input
-                    aria-invalid="true"
+                    aria-invalid="false"
                     class="MuiInputBase-input-id MuiOutlinedInput-input-id"
                     name="secretKey"
                     type="text"
@@ -133328,9 +133323,9 @@ exports[`Storyshots Views / Webhooks / Webhook details default 1`] = `
                   </fieldset>
                 </div>
                 <p
-                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
+                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-filled-id"
                 >
-                  Invalid value
+                  secret key is used to create a hash signature with each payload. *optional field
                 </p>
               </div>
             </div>
@@ -133722,16 +133717,16 @@ exports[`Storyshots Views / Webhooks / Webhook details form errors 1`] = `
                 class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
               >
                 <label
-                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-filled-id"
+                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id MuiFormLabel-filled-id"
                   data-shrink="true"
                 >
                   Webhook Name
                 </label>
                 <div
-                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
+                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-error-id MuiOutlinedInput-error-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
                 >
                   <input
-                    aria-invalid="false"
+                    aria-invalid="true"
                     class="MuiInputBase-input-id MuiOutlinedInput-input-id"
                     name="name"
                     type="text"
@@ -133752,6 +133747,11 @@ exports[`Storyshots Views / Webhooks / Webhook details form errors 1`] = `
                     </legend>
                   </fieldset>
                 </div>
+                <p
+                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
+                >
+                  Invalid value
+                </p>
               </div>
               <div
                 class="FormSpacer-spacer-id"
@@ -133838,16 +133838,16 @@ exports[`Storyshots Views / Webhooks / Webhook details form errors 1`] = `
                 class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
               >
                 <label
-                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-filled-id"
+                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id MuiFormLabel-filled-id"
                   data-shrink="true"
                 >
                   Target URL
                 </label>
                 <div
-                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
+                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-error-id MuiOutlinedInput-error-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
                 >
                   <input
-                    aria-invalid="false"
+                    aria-invalid="true"
                     class="MuiInputBase-input-id MuiOutlinedInput-input-id"
                     name="targetUrl"
                     type="text"
@@ -133869,9 +133869,9 @@ exports[`Storyshots Views / Webhooks / Webhook details form errors 1`] = `
                   </fieldset>
                 </div>
                 <p
-                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-filled-id"
+                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
                 >
-                  This URL will receive webhook POST requests
+                  Invalid value
                 </p>
               </div>
               <div
@@ -133881,16 +133881,16 @@ exports[`Storyshots Views / Webhooks / Webhook details form errors 1`] = `
                 class="MuiFormControl-root-id MuiTextField-root-id MuiFormControl-fullWidth-id"
               >
                 <label
-                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-filled-id"
+                  class="MuiFormLabel-root-id MuiInputLabel-root-id MuiInputLabel-formControl-id MuiInputLabel-animated-id MuiInputLabel-shrink-id MuiInputLabel-outlined-id MuiFormLabel-error-id MuiInputLabel-error-id MuiFormLabel-filled-id"
                   data-shrink="true"
                 >
                   Secrect Key
                 </label>
                 <div
-                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
+                  class="MuiInputBase-root-id MuiOutlinedInput-root-id MuiInputBase-error-id MuiOutlinedInput-error-id MuiInputBase-fullWidth-id MuiInputBase-formControl-id"
                 >
                   <input
-                    aria-invalid="false"
+                    aria-invalid="true"
                     class="MuiInputBase-input-id MuiOutlinedInput-input-id"
                     name="secretKey"
                     type="text"
@@ -133912,9 +133912,9 @@ exports[`Storyshots Views / Webhooks / Webhook details form errors 1`] = `
                   </fieldset>
                 </div>
                 <p
-                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-filled-id"
+                  class="MuiFormHelperText-root-id MuiFormHelperText-contained-id MuiFormHelperText-error-id MuiFormHelperText-filled-id"
                 >
-                  secret key is used to create a hash signature with each payload. *optional field
+                  Invalid value
                 </p>
               </div>
             </div>
diff --git a/src/storybook/stories/discounts/SaleCreatePage.tsx b/src/storybook/stories/discounts/SaleCreatePage.tsx
index acfc27863..39c793d2d 100644
--- a/src/storybook/stories/discounts/SaleCreatePage.tsx
+++ b/src/storybook/stories/discounts/SaleCreatePage.tsx
@@ -1,11 +1,11 @@
 import { storiesOf } from "@storybook/react";
 import React from "react";
 
+import { DiscountErrorCode } from "@saleor/types/globalTypes";
 import SaleCreatePage, {
   SaleCreatePageProps
 } from "../../../discounts/components/SaleCreatePage";
 import Decorator from "../../Decorator";
-import { formError } from "../../misc";
 
 const props: SaleCreatePageProps = {
   defaultCurrency: "USD",
@@ -23,6 +23,10 @@ storiesOf("Views / Discounts / Sale create", module)
   .add("form errors", () => (
     <SaleCreatePage
       {...props}
-      errors={["name", "startDate", "endDate", "value"].map(formError)}
+      errors={["name", "startDate", "endDate", "value"].map(field => ({
+        __typename: "DiscountError",
+        code: DiscountErrorCode.INVALID,
+        field
+      }))}
     />
   ));
diff --git a/src/storybook/stories/discounts/SaleDetailsPage.tsx b/src/storybook/stories/discounts/SaleDetailsPage.tsx
index 941b49a1e..51e1ad3bf 100644
--- a/src/storybook/stories/discounts/SaleDetailsPage.tsx
+++ b/src/storybook/stories/discounts/SaleDetailsPage.tsx
@@ -1,6 +1,7 @@
 import { storiesOf } from "@storybook/react";
 import React from "react";
 
+import { DiscountErrorCode } from "@saleor/types/globalTypes";
 import SaleDetailsPage, {
   SaleDetailsPageProps,
   SaleDetailsPageTab
@@ -8,7 +9,6 @@ import SaleDetailsPage, {
 import { sale } from "../../../discounts/fixtures";
 import { listActionsProps } from "../../../fixtures";
 import Decorator from "../../Decorator";
-import { formError } from "../../misc";
 
 const props: SaleDetailsPageProps = {
   activeTab: SaleDetailsPageTab.categories,
@@ -51,7 +51,11 @@ storiesOf("Views / Discounts / Sale details", module)
   .add("form errors", () => (
     <SaleDetailsPage
       {...props}
-      errors={["name", "startDate", "endDate", "value"].map(formError)}
+      errors={["name", "startDate", "endDate", "value"].map(field => ({
+        __typename: "DiscountError",
+        code: DiscountErrorCode.INVALID,
+        field
+      }))}
     />
   ))
   .add("collections", () => (
diff --git a/src/storybook/stories/discounts/VoucherCreatePage.tsx b/src/storybook/stories/discounts/VoucherCreatePage.tsx
index 613c49e92..ee544169d 100644
--- a/src/storybook/stories/discounts/VoucherCreatePage.tsx
+++ b/src/storybook/stories/discounts/VoucherCreatePage.tsx
@@ -1,12 +1,12 @@
 import { storiesOf } from "@storybook/react";
 import React from "react";
 
+import { DiscountErrorCode } from "@saleor/types/globalTypes";
 import VoucherCreatePage, {
   FormData,
   VoucherCreatePageProps
 } from "../../../discounts/components/VoucherCreatePage";
 import Decorator from "../../Decorator";
-import { formError } from "../../misc";
 
 const props: VoucherCreatePageProps = {
   defaultCurrency: "USD",
@@ -34,6 +34,10 @@ storiesOf("Views / Discounts / Voucher create", module)
         "type",
         "usageLimit",
         "value"
-      ] as Array<keyof FormData>).map(formError)}
+      ] as Array<keyof FormData>).map(field => ({
+        __typename: "DiscountError",
+        code: DiscountErrorCode.INVALID,
+        field
+      }))}
     />
   ));
diff --git a/src/storybook/stories/discounts/VoucherDetailsPage.tsx b/src/storybook/stories/discounts/VoucherDetailsPage.tsx
index 352db773e..4e75b28d6 100644
--- a/src/storybook/stories/discounts/VoucherDetailsPage.tsx
+++ b/src/storybook/stories/discounts/VoucherDetailsPage.tsx
@@ -1,6 +1,7 @@
 import { storiesOf } from "@storybook/react";
 import React from "react";
 
+import { DiscountErrorCode } from "@saleor/types/globalTypes";
 import VoucherDetailsPage, {
   FormData,
   VoucherDetailsPageProps,
@@ -9,7 +10,6 @@ import VoucherDetailsPage, {
 import { voucherDetails } from "../../../discounts/fixtures";
 import { listActionsProps, pageListProps } from "../../../fixtures";
 import Decorator from "../../Decorator";
-import { formError } from "../../misc";
 
 const props: VoucherDetailsPageProps = {
   ...listActionsProps,
@@ -59,6 +59,10 @@ storiesOf("Views / Discounts / Voucher details", module)
         "type",
         "usageLimit",
         "discountValue"
-      ] as Array<keyof FormData>).map(formError)}
+      ] as Array<keyof FormData>).map(field => ({
+        __typename: "DiscountError",
+        code: DiscountErrorCode.INVALID,
+        field
+      }))}
     />
   ));