[EDR Workflows][Osquery] Prevent pack creation on shards field error (e…

…lastic#191186)

It was observed that even though we display an error on Shard policy
field if the field is left empty we still proceed with displaying
confirmation modal which does nothing on selecting "Save and deploy
changes".



https://github.com/user-attachments/assets/0506894d-9e93-4233-8ac3-442968b6f848



With this change form behaves as expected, with a field error it won't
proceed with form submission.


https://github.com/user-attachments/assets/0168ccf7-4137-43d4-8005-589be3ae0e35

x-pack/plugins/osquery/public/packs/form/shards/shards_policy_field.tsx

@@ -28,15 +28,17 @@ const ShardsPolicyFieldComponent = ({
 }: ShardsPolicyFieldComponent) => {
   const { data: { agentPoliciesById } = {} } = useAgentPolicies();
 
+  const missingValueError = i18n.translate(
+    'xpack.osquery.pack.form.shardsPolicyFieldMissingErrorMessage',
+    {
+      defaultMessage: 'Policy is a required field',
+    }
+  );
+
   const policyFieldValidator = useCallback(
-    (policy: { key: string; label: string }) =>
-      !policy
-        ? i18n.translate('xpack.osquery.pack.form.shardsPolicyFieldMissingErrorMessage', {
-            defaultMessage: 'Policy is a required field',
-          })
-        : undefined,
+    (policy: { key: string; label: string }) => (!policy ? missingValueError : undefined),
 
-    []
+    [missingValueError]
   );
 
   const {
@@ -47,6 +49,7 @@ const ShardsPolicyFieldComponent = ({
     name: `shardsArray.${index}.policy`,
     rules: {
       validate: policyFieldValidator,
+      required: missingValueError,
     },
   });