[SM-628] Add trim validator to SM dialogs (#4993)

* Add trim validator to SM dialogs

* Swap to creating a generic component

* Swap to BitValidators.trimValidator

* Fix storybook

* update validator to auto trim whitespace

* update storybook copy

* fix copy

* update trim validator to run on submit

* add validator to project name in secret dialog; update secret name validation to on submit

---------

Co-authored-by: William Martin <contact@willmartian.com>

libs/components/src/form-field/bit-validators.stories.ts

@@ -8,6 +8,7 @@ import { InputModule } from "../input/input.module";
 import { I18nMockService } from "../utils/i18n-mock.service";
 
 import { forbiddenCharacters } from "./bit-validators/forbidden-characters.validator";
+import { trimValidator } from "./bit-validators/trim.validator";
 import { BitFormFieldComponent } from "./form-field.component";
 import { FormFieldModule } from "./form-field.module";
 
@@ -24,6 +25,7 @@ export default {
             return new I18nMockService({
               inputForbiddenCharacters: (chars) =>
                 `The following characters are not allowed: ${chars}`,
+              inputTrimValidator: "Input must not contain only whitespace.",
             });
           },
         },
@@ -56,3 +58,20 @@ export const ForbiddenCharacters: StoryObj<BitFormFieldComponent> = {
     template,
   }),
 };
+
+export const TrimValidator: StoryObj<BitFormFieldComponent> = {
+  render: (args: BitFormFieldComponent) => ({
+    props: {
+      formObj: new FormBuilder().group({
+        name: [
+          "",
+          {
+            updateOn: "submit",
+            validators: [trimValidator],
+          },
+        ],
+      }),
+    },
+    template,
+  }),
+};