diff --git a/ee/app/assets/javascripts/threat_monitoring/components/network_policy_list.vue b/ee/app/assets/javascripts/threat_monitoring/components/network_policy_list.vue index ad5bfeb0ef389627d3970075bc22e43fd429aedd..0d21b397c5df293ab2f6fa6ea3eb730cccd9ead7 100644 --- a/ee/app/assets/javascripts/threat_monitoring/components/network_policy_list.vue +++ b/ee/app/assets/javascripts/threat_monitoring/components/network_policy_list.vue @@ -5,7 +5,7 @@ import { getTimeago } from '~/lib/utils/datetime_utility'; import { setUrlFragment, mergeUrlParams } from '~/lib/utils/url_utility'; import { s__ } from '~/locale'; import EnvironmentPicker from './environment_picker.vue'; -import NetworkPolicyDrawer from './network_policy_drawer.vue'; +import NetworkPolicyDrawer from './policy_drawer/network_policy_drawer.vue'; export default { components: { @@ -200,6 +200,7 @@ export default { :policy="selectedPolicy" :edit-policy-path="editPolicyPath" data-testid="policyDrawer" + @close="deselectPolicy" /> </div> </template> diff --git a/ee/app/assets/javascripts/threat_monitoring/components/network_policy_drawer.vue b/ee/app/assets/javascripts/threat_monitoring/components/policy_drawer/network_policy_drawer.vue similarity index 78% rename from ee/app/assets/javascripts/threat_monitoring/components/network_policy_drawer.vue rename to ee/app/assets/javascripts/threat_monitoring/components/policy_drawer/network_policy_drawer.vue index 6d1c3581911ca43404758741624d1b573aede1b3..a107e6b02306e4720b3e91568918b8c12c41295c 100644 --- a/ee/app/assets/javascripts/threat_monitoring/components/network_policy_drawer.vue +++ b/ee/app/assets/javascripts/threat_monitoring/components/policy_drawer/network_policy_drawer.vue @@ -1,16 +1,16 @@ <script> import { GlButton, GlDrawer } from '@gitlab/ui'; -import { getContentWrapperHeight } from '../utils'; -import { CiliumNetworkPolicyKind } from './policy_editor/constants'; -import PolicyDrawer from './policy_editor/policy_drawer.vue'; +import { getContentWrapperHeight } from '../../utils'; +import { CiliumNetworkPolicyKind } from '../policy_editor/constants'; +import ContainerRuntimePolicy from '../policy_editor/container_runtime_policy.vue'; export default { components: { GlButton, GlDrawer, NetworkPolicyEditor: () => - import(/* webpackChunkName: 'network_policy_editor' */ './network_policy_editor.vue'), - PolicyDrawer, + import(/* webpackChunkName: 'network_policy_editor' */ '../network_policy_editor.vue'), + ContainerRuntimePolicy, }, props: { policy: { @@ -25,7 +25,7 @@ export default { }, }, computed: { - isCiliumPolicy() { + isContainerRuntimePolicy() { return this.policy ? this.policy.manifest.includes(CiliumNetworkPolicyKind) : false; }, }, @@ -59,7 +59,7 @@ export default { </div> </template> <div v-if="policy"> - <policy-drawer v-if="isCiliumPolicy" :value="policy.manifest" /> + <container-runtime-policy v-if="isContainerRuntimePolicy" :value="policy.manifest" /> <div v-else> <h5>{{ s__('NetworkPolicies|Policy definition') }}</h5> diff --git a/ee/app/assets/javascripts/threat_monitoring/components/policy_editor/policy_drawer.vue b/ee/app/assets/javascripts/threat_monitoring/components/policy_editor/container_runtime_policy.vue similarity index 100% rename from ee/app/assets/javascripts/threat_monitoring/components/policy_editor/policy_drawer.vue rename to ee/app/assets/javascripts/threat_monitoring/components/policy_editor/container_runtime_policy.vue diff --git a/ee/spec/frontend/threat_monitoring/components/__snapshots__/network_policy_list_spec.js.snap b/ee/spec/frontend/threat_monitoring/components/__snapshots__/network_policy_list_spec.js.snap index bda5cfcdd17b3e67da75bae31f1df311f4420bea..d5b49d14b631a9a2f8f4e4d9d958cf5e2f39a5d9 100644 --- a/ee/spec/frontend/threat_monitoring/components/__snapshots__/network_policy_list_spec.js.snap +++ b/ee/spec/frontend/threat_monitoring/components/__snapshots__/network_policy_list_spec.js.snap @@ -6,10 +6,10 @@ exports[`NetworkPolicyList component renders policies table 1`] = ` <table aria-busy="false" aria-colcount="3" - aria-describedby="__BVID__208__caption_" + aria-describedby="__BVID__181__caption_" aria-multiselectable="false" class="table b-table gl-table table-hover b-table-stacked-md b-table-selectable b-table-select-single" - id="__BVID__208" + id="__BVID__181" role="table" > <!----> diff --git a/ee/spec/frontend/threat_monitoring/components/network_policy_list_spec.js b/ee/spec/frontend/threat_monitoring/components/network_policy_list_spec.js index 83b1e180c9a437e15ed13aea37ee8fc274c11e51..4c89402fb858b55edba008e3e140b798719ab98e 100644 --- a/ee/spec/frontend/threat_monitoring/components/network_policy_list_spec.js +++ b/ee/spec/frontend/threat_monitoring/components/network_policy_list_spec.js @@ -1,6 +1,5 @@ import { GlTable, GlDrawer } from '@gitlab/ui'; import NetworkPolicyList from 'ee/threat_monitoring/components/network_policy_list.vue'; -import PolicyDrawer from 'ee/threat_monitoring/components/policy_editor/policy_drawer.vue'; import createStore from 'ee/threat_monitoring/store'; import { mountExtended } from 'helpers/vue_test_utils_helper'; import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils'; @@ -59,10 +58,6 @@ describe('NetworkPolicyList component', () => { expect(button.exists()).toBe(true); }); - it('does not render the new policy drawer', () => { - expect(wrapper.find(PolicyDrawer).exists()).toBe(false); - }); - it('fetches policies', () => { expect(store.dispatch).toHaveBeenCalledWith('networkPolicies/fetchPolicies', -1); }); diff --git a/ee/spec/frontend/threat_monitoring/components/network_policy_drawer_spec.js b/ee/spec/frontend/threat_monitoring/components/policy_drawer/network_policy_drawer_spec.js similarity index 81% rename from ee/spec/frontend/threat_monitoring/components/network_policy_drawer_spec.js rename to ee/spec/frontend/threat_monitoring/components/policy_drawer/network_policy_drawer_spec.js index ce51d7699e135b59f4d314d38fae3e03ed8cce03..cf4f903d5e223e4a3baa72a9473de5124611f0c5 100644 --- a/ee/spec/frontend/threat_monitoring/components/network_policy_drawer_spec.js +++ b/ee/spec/frontend/threat_monitoring/components/policy_drawer/network_policy_drawer_spec.js @@ -1,7 +1,7 @@ -import NetworkPolicyDrawer from 'ee/threat_monitoring/components/network_policy_drawer.vue'; -import PolicyDrawer from 'ee/threat_monitoring/components/policy_editor/policy_drawer.vue'; +import NetworkPolicyDrawer from 'ee/threat_monitoring/components/policy_drawer/network_policy_drawer.vue'; +import ContainerRuntimePolicy from 'ee/threat_monitoring/components/policy_editor/container_runtime_policy.vue'; import { mountExtended } from 'helpers/vue_test_utils_helper'; -import { mockPoliciesResponse, mockCiliumPolicy } from '../mocks/mock_data'; +import { mockPoliciesResponse, mockCiliumPolicy } from '../../mocks/mock_data'; const [mockGenericPolicy] = mockPoliciesResponse; @@ -22,7 +22,7 @@ describe('NetworkPolicyDrawer component', () => { // Finders const findEditButton = () => wrapper.findByTestId('edit-button'); const findPolicyEditor = () => wrapper.findByTestId('policyEditor'); - const findPolicyDrawer = () => wrapper.find(PolicyDrawer); + const findCiliumPolicy = () => wrapper.findComponent(ContainerRuntimePolicy); // Shared assertions const itRendersEditButton = () => { @@ -75,8 +75,8 @@ describe('NetworkPolicyDrawer component', () => { }); }); - it('renders the new policy drawer', () => { - expect(findPolicyDrawer().exists()).toBe(true); + it('renders the container runtime component', () => { + expect(findCiliumPolicy().exists()).toBe(true); }); itRendersEditButton(); diff --git a/ee/spec/frontend/threat_monitoring/components/policy_editor/__snapshots__/policy_drawer_spec.js.snap b/ee/spec/frontend/threat_monitoring/components/policy_editor/__snapshots__/container_runtime_policy_spec.js.snap similarity index 84% rename from ee/spec/frontend/threat_monitoring/components/policy_editor/__snapshots__/policy_drawer_spec.js.snap rename to ee/spec/frontend/threat_monitoring/components/policy_editor/__snapshots__/container_runtime_policy_spec.js.snap index 2752e1a4d72a3cbdabd5a5dee147583a12e7828c..befb8e7c1f2463ec06e56aa6ce8115a58ae708e3 100644 --- a/ee/spec/frontend/threat_monitoring/components/policy_editor/__snapshots__/policy_drawer_spec.js.snap +++ b/ee/spec/frontend/threat_monitoring/components/policy_editor/__snapshots__/container_runtime_policy_spec.js.snap @@ -1,6 +1,6 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP -exports[`PolicyDrawer component supported YAML renders policy preview tabs 1`] = ` +exports[`ContainerRuntimePolicy component supported YAML renders policy preview tabs 1`] = ` <div> <h5 class="gl-mt-3" @@ -54,7 +54,7 @@ spec: </div> `; -exports[`PolicyDrawer component unsupported YAML renders policy preview tabs 1`] = ` +exports[`ContainerRuntimePolicy component unsupported YAML renders policy preview tabs 1`] = ` <div> <h5 class="gl-mt-3" diff --git a/ee/spec/frontend/threat_monitoring/components/policy_editor/policy_drawer_spec.js b/ee/spec/frontend/threat_monitoring/components/policy_editor/container_runtime_policy_spec.js similarity index 90% rename from ee/spec/frontend/threat_monitoring/components/policy_editor/policy_drawer_spec.js rename to ee/spec/frontend/threat_monitoring/components/policy_editor/container_runtime_policy_spec.js index 36c2d5382d159c6b5ba71b62263c3a19794dfd8d..6631229290c5644870fbed630f9105ce7044b0fc 100644 --- a/ee/spec/frontend/threat_monitoring/components/policy_editor/policy_drawer_spec.js +++ b/ee/spec/frontend/threat_monitoring/components/policy_editor/container_runtime_policy_spec.js @@ -1,9 +1,9 @@ +import ContainerRuntimePolicy from 'ee/threat_monitoring/components/policy_editor/container_runtime_policy.vue'; import toYaml from 'ee/threat_monitoring/components/policy_editor/lib/to_yaml'; -import PolicyDrawer from 'ee/threat_monitoring/components/policy_editor/policy_drawer.vue'; import PolicyPreview from 'ee/threat_monitoring/components/policy_editor/policy_preview.vue'; import { shallowMountExtended } from 'helpers/vue_test_utils_helper'; -describe('PolicyDrawer component', () => { +describe('ContainerRuntimePolicy component', () => { let wrapper; const policy = { name: 'test-policy', @@ -17,7 +17,7 @@ describe('PolicyDrawer component', () => { const findDescription = () => wrapper.findByTestId('description'); const factory = ({ propsData } = {}) => { - wrapper = shallowMountExtended(PolicyDrawer, { + wrapper = shallowMountExtended(ContainerRuntimePolicy, { propsData: { ...propsData, },