New policy starts out with a rule by default

- update tests

Changelog: added

ee/app/assets/javascripts/threat_monitoring/components/policy_editor/policy_editor.vue

@@ -84,7 +84,7 @@ export default {
           isEnabled: false,
           endpointMatchMode: EndpointMatchModeAny,
           endpointLabels: '',
-          rules: [],
+          rules: [buildRule(RuleTypeEndpoint)],
           annotations: '',
           labels: '',
         };

ee/changelogs/unreleased/321419-new-policy-gets-rule-by-default.yml

+---
+title: New policy starts out with a rule by default
+merge_request: 60464
+author:
+type: changed

ee/spec/frontend/threat_monitoring/components/policy_editor/__snapshots__/policy_editor_spec.js.snap

@@ -155,7 +155,14 @@ exports[`PolicyEditorApp component renders the policy editor layout 1`] = `
       <dim-disable-container-stub
         data-testid="rule-builder-container"
       >
-           
+          
+        <policy-rule-builder-stub
+          class="gl-mb-4"
+          endpointlabels=""
+          endpointmatchmode="any"
+          rule="[object Object]"
+        />
+         
         <div
           class="gl-p-3 gl-rounded-base gl-border-1 gl-border-solid gl-border-gray-100 gl-mb-5"
         >
@@ -191,7 +198,7 @@ exports[`PolicyEditorApp component renders the policy editor layout 1`] = `
           
         <policy-preview-stub
           initialtab="0"
-          policydescription="Deny all traffic"
+          policydescription="Allow all inbound traffic to <strong>all</strong> pods from <strong>all</strong> pods on <strong>any</strong> port"
           policyyaml="apiVersion: cilium.io/v2
 kind: CiliumNetworkPolicy
 metadata:
@@ -202,6 +209,9 @@ spec:
   endpointSelector:
     matchLabels:
       network-policy.gitlab.com/disabled_by: gitlab
+  ingress:
+  - fromEndpoints:
+    - matchLabels: {}
 "
         />
       </dim-disable-container-stub>

ee/spec/frontend/threat_monitoring/components/policy_editor/policy_editor_spec.js

@@ -82,6 +82,7 @@ spec:
   const findPolicyDescription = () => wrapper.find("[id='policyDescription']");
   const findPolicyEnableContainer = () => wrapper.findByTestId('policy-enable');
   const findPolicyName = () => wrapper.find("[id='policyName']");
+  const findPolicyRuleBuilder = () => wrapper.findComponent(PolicyRuleBuilder);
   const findSavePolicy = () => wrapper.findByTestId('save-policy');
   const findDeletePolicy = () => wrapper.findByTestId('delete-policy');
   const findEditorModeToggle = () => wrapper.findByTestId('editor-mode');
@@ -112,6 +113,14 @@ spec:
     expect(wrapper.findComponent(GlToggle).props('label')).toBe(PolicyEditorApp.i18n.toggleLabel);
   });
 
+  it('renders a default rule with label', () => {
+    expect(findPolicyRuleBuilder().exists()).toBe(true);
+    expect(findPolicyRuleBuilder().attributes()).toMatchObject({
+      endpointlabels: '',
+      endpointmatchmode: 'any',
+    });
+  });
+
   it('does not render yaml editor', () => {
     expect(findYamlEditor().exists()).toBe(false);
   });
@@ -227,13 +236,13 @@ spec:
   });
 
   it('adds a new rule', async () => {
-    expect(wrapper.findAll(PolicyRuleBuilder).length).toEqual(0);
+    expect(wrapper.findAll(PolicyRuleBuilder).length).toEqual(1);
     const button = findAddRuleButton();
     button.vm.$emit('click');
     button.vm.$emit('click');
     await wrapper.vm.$nextTick();
     const elements = wrapper.findAll(PolicyRuleBuilder);
-    expect(elements.length).toEqual(2);
+    expect(elements.length).toEqual(3);
 
     elements.wrappers.forEach((builder, idx) => {
       expect(builder.props().rule).toMatchObject({
@@ -250,11 +259,11 @@ spec:
   it('removes a new rule', async () => {
     findAddRuleButton().vm.$emit('click');
     await wrapper.vm.$nextTick();
-    expect(wrapper.findAll(PolicyRuleBuilder).length).toEqual(1);
+    expect(wrapper.findAll(PolicyRuleBuilder).length).toEqual(2);
 
-    wrapper.find(PolicyRuleBuilder).vm.$emit('remove');
+    findPolicyRuleBuilder().vm.$emit('remove');
     await wrapper.vm.$nextTick();
-    expect(wrapper.findAll(PolicyRuleBuilder).length).toEqual(0);
+    expect(wrapper.findAll(PolicyRuleBuilder).length).toEqual(1);
   });
 
   it('updates yaml editor value on switch to yaml editor', async () => {