Skip to content

Commit

Permalink
NAS-134553: Hide proxies for VMs
Browse files Browse the repository at this point in the history
  • Loading branch information
@undsoft
undsoft committed Mar 5, 2025
1 parent a49ef73 commit 6638990
Show file tree
Hide file tree
Showing 7 changed files with 142 additions and 88 deletions.
8 changes: 4 additions & 4 deletions ...pages/instances/components/all-instances/instance-details/instance-details.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,11 +18,11 @@
[ixUiSearch]="searchableElements.elements.nic"
></ix-instance-nics>

<ix-instance-proxies
[ixUiSearch]="searchableElements.elements.proxies"
></ix-instance-proxies>
@if (isContainer()) {
<ix-instance-proxies
[ixUiSearch]="searchableElements.elements.proxies"
></ix-instance-proxies>

@if (instance().type === VirtualizationType.Container) {
<ix-instance-idmap [instance]="instance()"
[ixUiSearch]="searchableElements.elements.idmap"
></ix-instance-idmap>
Expand Down
75 changes: 66 additions & 9 deletions ...es/instances/components/all-instances/instance-details/instance-details.component.spec.ts
View file
Original file line number Diff line number Diff line change
@@ -1,8 +1,12 @@
import { Type } from '@angular/core';
import { createComponentFactory, Spectator } from '@ngneat/spectator/jest';
import { MockComponents } from 'ng-mocks';
import { NgxSkeletonLoaderComponent } from 'ngx-skeleton-loader';
import { VirtualizationType } from 'app/enums/virtualization.enum';
import { VirtualizationInstance } from 'app/interfaces/virtualization.interface';
import { InstanceDetailsComponent } from 'app/pages/instances/components/all-instances/instance-details/instance-details.component';
import {
InstanceDetailsComponent,
} from 'app/pages/instances/components/all-instances/instance-details/instance-details.component';
import {
InstanceDevicesComponent,
} from 'app/pages/instances/components/all-instances/instance-details/instance-devices/instance-devices.component';
Expand All @@ -12,10 +16,21 @@ import {
import {
InstanceGeneralInfoComponent,
} from 'app/pages/instances/components/all-instances/instance-details/instance-general-info/instance-general-info.component';
import { InstanceNicsComponent } from 'app/pages/instances/components/all-instances/instance-details/instance-nics/instance-nics.component';
import {
InstanceIdmapComponent,
} from 'app/pages/instances/components/all-instances/instance-details/instance-idmap/instance-idmap.component';
import {
InstanceMetricsComponent,
} from 'app/pages/instances/components/all-instances/instance-details/instance-metrics/instance-metrics.component';
import {
InstanceNicsComponent,
} from 'app/pages/instances/components/all-instances/instance-details/instance-nics/instance-nics.component';
import {
InstanceProxiesComponent,
} from 'app/pages/instances/components/all-instances/instance-details/instance-proxies/instance-proxies.component';
import {
InstanceToolsComponent,
} from 'app/pages/instances/components/all-instances/instance-details/instance-tools/instance-tools.component';

describe('InstanceDetailsComponent', () => {
let spectator: Spectator<InstanceDetailsComponent>;
Expand All @@ -27,8 +42,11 @@ describe('InstanceDetailsComponent', () => {
InstanceGeneralInfoComponent,
InstanceDevicesComponent,
InstanceDisksComponent,
InstanceProxiesComponent,
InstanceNicsComponent,
InstanceProxiesComponent,
InstanceIdmapComponent,
InstanceToolsComponent,
InstanceMetricsComponent,
),
],
});
Expand All @@ -38,16 +56,55 @@ describe('InstanceDetailsComponent', () => {
props: {
instance: {
name: 'my-instance',
type: VirtualizationType.Container,
} as VirtualizationInstance,
},
});
});

it('shows details sub-components related to selected instance', () => {
expect(spectator.query(InstanceGeneralInfoComponent)).toExist();
expect(spectator.query(InstanceDevicesComponent)).toExist();
expect(spectator.query(InstanceDisksComponent)).toExist();
expect(spectator.query(InstanceNicsComponent)).toExist();
expect(spectator.query(InstanceProxiesComponent)).toExist();
it('shows details sub-components related to a selected container', () => {
const expectedComponents = [
InstanceGeneralInfoComponent,
InstanceDevicesComponent,
InstanceDisksComponent,
InstanceNicsComponent,
InstanceProxiesComponent,
InstanceIdmapComponent,
InstanceToolsComponent,
InstanceMetricsComponent,
];

expectedComponents.forEach((component) => {
expect(spectator.query(component as Type<unknown>)).toExist();
});
});

it('shows details sub-components related to a selected VM', () => {
spectator.setInput('instance', {
name: 'my-instance',
type: VirtualizationType.Vm,
} as VirtualizationInstance);

const expectedComponents = [
InstanceGeneralInfoComponent,
InstanceDevicesComponent,
InstanceDisksComponent,
InstanceNicsComponent,
InstanceToolsComponent,
InstanceMetricsComponent,
];

expectedComponents.forEach((component) => {
expect(spectator.query(component as Type<unknown>)).toExist();
});

const notExpectedComponents = [
InstanceProxiesComponent,
InstanceIdmapComponent,
];

notExpectedComponents.forEach((component) => {
expect(spectator.query(component as Type<unknown>)).not.toExist();
});
});
});
6 changes: 5 additions & 1 deletion ...p/pages/instances/components/all-instances/instance-details/instance-details.component.ts
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import {
ChangeDetectionStrategy, Component, input,
ChangeDetectionStrategy, Component, computed, input,
} from '@angular/core';
import { TranslateModule } from '@ngx-translate/core';
import { UiSearchDirective } from 'app/directives/ui-search.directive';
Expand Down Expand Up @@ -48,4 +48,8 @@ export class InstanceDetailsComponent {

protected readonly searchableElements = instanceDetailsElements;
protected readonly VirtualizationType = VirtualizationType;

protected readonly isContainer = computed(() => {
return this.instance().type === VirtualizationType.Container;
});
}
3 changes: 1 addition & 2 deletions ...nces/components/all-instances/instance-details/instance-idmap/instance-idmap.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import {
} from '@angular/material/card';
import { UntilDestroy } from '@ngneat/until-destroy';
import { TranslateModule } from '@ngx-translate/core';
import { VirtualizationStatus, VirtualizationType } from 'app/enums/virtualization.enum';
import { VirtualizationStatus } from 'app/enums/virtualization.enum';
import { VirtualizationInstance } from 'app/interfaces/virtualization.interface';
import { CardExpandCollapseComponent } from 'app/modules/card-expand-collapse/card-expand-collapse.component';

Expand All @@ -31,5 +31,4 @@ export class InstanceIdmapComponent {
instance = input.required<VirtualizationInstance>();

virtualizationStatus = VirtualizationStatus;
virtualizationType = VirtualizationType;
}
112 changes: 57 additions & 55 deletions src/app/pages/instances/components/instance-wizard/instance-wizard.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -212,65 +212,67 @@
</ix-list>
</ix-form-section>

<ix-form-section
[label]="'Proxies' | translate"
>
<ix-list
formArrayName="proxies"
[empty]="form.controls.proxies.controls.length === 0"
[label]="containersHelptext.proxies_placeholder | translate"
[formArray]="form.controls.proxies"
(add)="addProxy()"
@if (isContainer()) {
<ix-form-section
[label]="'Proxies' | translate"
>
@for (proxy of form.controls.proxies.controls; track proxy; let i = $index) {
<ix-list-item
[label]="'Proxy' | translate"
[formGroupName]="i"
(delete)="removeProxy(i)"
>
<div class="protocol-and-port">
<ix-select
class="protocol"
formControlName="source_proto"
[label]="containersHelptext.host_protocol_placeholder | translate"
[tooltip]="containersHelptext.host_protocol_tooltip | translate"
[required]="true"
[options]="proxyProtocols$"
></ix-select>
<ix-list
formArrayName="proxies"
[empty]="form.controls.proxies.controls.length === 0"
[label]="containersHelptext.proxies_placeholder | translate"
[formArray]="form.controls.proxies"
(add)="addProxy()"
>
@for (proxy of form.controls.proxies.controls; track proxy; let i = $index) {
<ix-list-item
[label]="'Proxy' | translate"
[formGroupName]="i"
(delete)="removeProxy(i)"
>
<div class="protocol-and-port">
<ix-select
class="protocol"
formControlName="source_proto"
[label]="containersHelptext.host_protocol_placeholder | translate"
[tooltip]="containersHelptext.host_protocol_tooltip | translate"
[required]="true"
[options]="proxyProtocols$"
></ix-select>

<ix-input
class="port"
type="number"
formControlName="source_port"
[label]="containersHelptext.host_port_placeholder | translate"
[tooltip]="containersHelptext.host_port_tooltip | translate"
[required]="true"
></ix-input>
</div>
<ix-input
class="port"
type="number"
formControlName="source_port"
[label]="containersHelptext.host_port_placeholder | translate"
[tooltip]="containersHelptext.host_port_tooltip | translate"
[required]="true"
></ix-input>
</div>

<div class="protocol-and-port">
<ix-select
class="protocol"
formControlName="dest_proto"
[label]="containersHelptext.instance_protocol_placeholder | translate"
[tooltip]="containersHelptext.instance_protocol_tooltip | translate"
[required]="true"
[options]="proxyProtocols$"
></ix-select>
<div class="protocol-and-port">
<ix-select
class="protocol"
formControlName="dest_proto"
[label]="containersHelptext.instance_protocol_placeholder | translate"
[tooltip]="containersHelptext.instance_protocol_tooltip | translate"
[required]="true"
[options]="proxyProtocols$"
></ix-select>

<ix-input
class="port"
type="number"
formControlName="dest_port"
[label]="containersHelptext.instance_port_placeholder | translate"
[tooltip]="containersHelptext.instance_port_tooltip | translate"
[required]="true"
></ix-input>
</div>
</ix-list-item>
}
</ix-list>
</ix-form-section>
<ix-input
class="port"
type="number"
formControlName="dest_port"
[label]="containersHelptext.instance_port_placeholder | translate"
[tooltip]="containersHelptext.instance_port_tooltip | translate"
[required]="true"
></ix-input>
</div>
</ix-list-item>
}
</ix-list>
</ix-form-section>
}

<ix-form-section
[label]="'Network' | translate"
Expand Down
25 changes: 8 additions & 17 deletions src/app/pages/instances/components/instance-wizard/instance-wizard.component.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -331,16 +331,6 @@ describe('InstanceWizardComponent', () => {
'I/O Bus': 'NVMe',
});

const proxiesList = await loader.getHarness(IxListHarness.with({ label: 'Proxies' }));
await proxiesList.pressAddButton();
const proxyForm = await proxiesList.getLastListItem();
await proxyForm.fillForm({
'Host Port': 3000,
'Host Protocol': 'TCP',
'Instance Port': 2000,
'Instance Protocol': 'UDP',
});

// TODO: Fix this to use IxCheckboxHarness
const usbDeviceCheckbox = await loader.getHarness(MatCheckboxHarness.with({
label: 'xHCI Host Controller (0003)',
Expand Down Expand Up @@ -392,13 +382,6 @@ describe('InstanceWizardComponent', () => {
source: '/mnt/source',
io_bus: DiskIoBus.Nvme,
},
{
dev_type: VirtualizationDeviceType.Proxy,
source_port: 3000,
source_proto: VirtualizationProxyProtocol.Tcp,
dest_port: 2000,
dest_proto: VirtualizationProxyProtocol.Udp,
},
{ dev_type: VirtualizationDeviceType.Nic, nic_type: VirtualizationNicType.Bridged, parent: 'nic1' },
{ dev_type: VirtualizationDeviceType.Usb, product_id: '0003' },
{ dev_type: VirtualizationDeviceType.Gpu, pci: 'pci_0000_01_00_0', gpu_type: VirtualizationGpuType.Physical },
Expand Down Expand Up @@ -466,6 +449,14 @@ describe('InstanceWizardComponent', () => {
expect(spectator.inject(SnackbarService).success).toHaveBeenCalled();
});

it('does not show Proxies section when instance type is VM', async () => {
const instanceType = await loader.getHarness(IxIconGroupHarness.with({ label: 'Virtualization Method' }));
await instanceType.setValue('VM');

const proxiesList = await loader.getHarnessOrNull(IxListHarness.with({ label: 'Proxies' }));
expect(proxiesList).toBeNull();
});

it('creates new instance using zvol path when form is submitted', async () => {
const instanceType = await loader.getHarness(IxIconGroupHarness.with({ label: 'Virtualization Method' }));
await instanceType.setValue('VM');
Expand Down
1 change: 1 addition & 0 deletions src/app/pages/instances/components/instance-wizard/instance-wizard.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -532,6 +532,7 @@ export class InstanceWizardComponent {

this.form.controls.image.reset();
this.form.controls.disks.clear();
this.form.controls.proxies.clear();

if (type === VirtualizationType.Container) {
this.form.controls.cpu.setValidators(cpuValidator());
Expand Down

0 comments on commit 6638990

Please sign in to comment.