Merge pull request #267 from cobbler/feature/add-import

Feature: Implement page for "cobbler import"

projects/cobbler-api/src/lib/cobbler-api.service.spec.ts

@@ -1,6 +1,6 @@
 import {TestBed} from '@angular/core/testing';
 import {HttpClientTestingModule, HttpTestingController} from '@angular/common/http/testing';
-import {BackgroundReplicateOptions} from 'cobbler-api';
+import {BackgroundImportOptions, BackgroundReplicateOptions} from 'cobbler-api';
 import {Event, ExtendedVersion, InstallationStatus} from './custom-types/misc';
 import {COBBLER_URL} from './lib.config';
 import {AngularXmlrpcService} from 'typescript-xmlrpc';
@@ -153,9 +153,25 @@ describe('CobblerApiService', () => {
     mockRequest.flush(methodResponse);
   });
 
-  xit('should execute the background_import action on the Cobbler Server', () => {
-    service.background_import(undefined, '');
-    expect(service).toBeFalsy();
+  it('should execute the background_import action on the Cobbler Server', () => {
+    // eslint-disable-next-line max-len
+    const methodResponse = `<?xml version='1.0'?><methodResponse><params><param><value><string>2023-01-24_103639_Media import_dd297121f7bc412e9ce4d80f05de4b3f</string></value></param></params></methodResponse>`
+    const result = "2023-01-24_103639_Media import_dd297121f7bc412e9ce4d80f05de4b3f"
+    const importOptions: BackgroundImportOptions = {
+      path: '',
+      name: '',
+      available_as: '',
+      autoinstall_file: '',
+      rsync_flags: '',
+      arch: '',
+      breed: '',
+      os_version: '',
+    }
+    service.background_import(importOptions, '').subscribe(value => {
+      expect(value).toEqual(result)
+    });
+    const mockRequest = httpTestingController.expectOne('http://localhost/cobbler_api');
+    mockRequest.flush(methodResponse);
   });
 
   xit('should execute the background_reposync action on the Cobbler Server', () => {

projects/cobbler-frontend/src/app/actions/import-dvd/import-dvd.component.html

@@ -1,13 +1,37 @@
-<div class="right-column" id="dataScreen">
-  <router-outlet></router-outlet>
-  <div class="ImportDVD-div">
-    <h1 class="title">IMPORT DVD</h1>
-    <div class="list-group">
-      <mat-list>
-        <mat-list-item>data 01</mat-list-item>
-        <mat-list-item>data 02</mat-list-item>
-        <mat-list-item>data 03</mat-list-item>
-      </mat-list>
-    </div>
-  </div>
-</div>
+<h1 class="title">IMPORT DVD</h1>
+
+<form class="form-replicate" [formGroup]="importFormGroup">
+  <mat-form-field class="form-field-full-width">
+    <mat-label>Path</mat-label>
+    <input matInput type="text" required formControlName="path" placeholder="/mnt/cobbler-mounted/leap-15-4/" />
+  </mat-form-field>
+  <mat-form-field class="form-field-full-width">
+    <mat-label>Name</mat-label>
+    <input matInput type="text" required formControlName="name" placeholder="my-distro" />
+  </mat-form-field>
+  <mat-form-field class="form-field-full-width">
+    <mat-label>Available as</mat-label>
+    <input matInput type="text" formControlName="available_as" placeholder="my-distro" />
+  </mat-form-field>
+  <mat-form-field class="form-field-full-width">
+    <mat-label>Autoinstallation file</mat-label>
+    <input matInput type="text" formControlName="autoinstall_file" placeholder="autoyast.xml" />
+  </mat-form-field>
+  <mat-form-field class="form-field-full-width">
+    <mat-label>rsync flags</mat-label>
+    <input matInput type="text" formControlName="rsync_flags" placeholder="-v" />
+  </mat-form-field>
+  <mat-form-field class="form-field-full-width">
+    <mat-label>Architecture</mat-label>
+    <input matInput type="text" formControlName="arch" placeholder="x86_64" />
+  </mat-form-field>
+  <mat-form-field class="form-field-full-width">
+    <mat-label>Operating System Breed</mat-label>
+    <input matInput type="text" formControlName="breed" placeholder="suse" />
+  </mat-form-field>
+  <mat-form-field class="form-field-full-width">
+    <mat-label>Operating System Version</mat-label>
+    <input matInput type="text" formControlName="os_version" placeholder="15.4" />
+  </mat-form-field>
+  <button mat-button (click)="runImport()">Run</button>
+</form>

projects/cobbler-frontend/src/app/actions/import-dvd/import-dvd.component.scss

@@ -0,0 +1,9 @@
+.form-replicate {
+  min-width: 150px;
+  max-width: 600px;
+  width: 100%;
+}
+
+.form-field-full-width {
+  width: 100%;
+}

projects/cobbler-frontend/src/app/actions/import-dvd/import-dvd.component.spec.ts

@@ -1,6 +1,13 @@
+import {provideHttpClient} from '@angular/common/http';
+import {provideHttpClientTesting} from '@angular/common/http/testing';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
+import {ReactiveFormsModule} from '@angular/forms';
+import {MatButtonModule} from '@angular/material/button';
+import {MatFormFieldModule} from '@angular/material/form-field';
+import {MatInputModule} from '@angular/material/input';
 import { MatListModule } from '@angular/material/list';
-import {provideRouter} from '@angular/router';
+import {NoopAnimationsModule} from '@angular/platform-browser/animations';
+import {COBBLER_URL} from 'cobbler-api';
 
 import { ImportDVDComponent } from './import-dvd.component';
 
@@ -10,9 +17,21 @@ describe('ImportDVDComponent', () => {
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      imports: [MatListModule, ImportDVDComponent],
+      imports: [
+        ImportDVDComponent,
+        NoopAnimationsModule,
+        ReactiveFormsModule,
+        MatFormFieldModule,
+        MatInputModule,
+        MatButtonModule,
+      ],
       providers: [
-        provideRouter([]),
+        provideHttpClient(),
+        provideHttpClientTesting(),
+        {
+          provide: COBBLER_URL,
+          useValue: new URL('http://localhost/cobbler_api')
+        },
       ]
     }).compileComponents();
   });

projects/cobbler-frontend/src/app/actions/import-dvd/import-dvd.component.ts

@@ -1,16 +1,73 @@
-import {Component} from '@angular/core';
-import { MatListModule } from '@angular/material/list';
-import { RouterOutlet } from '@angular/router';
+import {Component, inject} from '@angular/core';
+import {FormBuilder, FormsModule, ReactiveFormsModule} from '@angular/forms';
+import {MatButton} from '@angular/material/button';
+import {MatFormField, MatLabel} from '@angular/material/form-field';
+import {MatInput} from '@angular/material/input';
+import {MatSnackBar} from '@angular/material/snack-bar';
+import {CobblerApiService, BackgroundImportOptions} from 'cobbler-api';
+import {UserService} from '../../services/user.service';
 
 @Component({
   selector: 'cobbler-import-dvd',
   templateUrl: './import-dvd.component.html',
-  styleUrls: ['./import-dvd.component.css'], standalone: true,
-  imports: [RouterOutlet, MatListModule],
+  styleUrls: ['./import-dvd.component.scss'], standalone: true,
+  imports: [
+    FormsModule,
+    MatFormField,
+    MatInput,
+    MatLabel,
+    ReactiveFormsModule,
+    MatButton
+  ],
 })
 export class ImportDVDComponent {
+  private readonly _formBuilder = inject(FormBuilder);
+  importFormGroup = this._formBuilder.group({
+    path: '',
+    name: '',
+    available_as: '',
+    autoinstall_file: '',
+    rsync_flags: '',
+    arch: '',
+    breed: '',
+    os_version: '',
+  })
 
-  constructor() {
+  constructor(
+    public userService: UserService,
+    private cobblerApiService: CobblerApiService,
+    private _snackBar: MatSnackBar
+  ) {
+  }
+
+  runImport(): void {
+    const importOptions: BackgroundImportOptions = {
+      path: this.importFormGroup.controls.path.value,
+      name: this.importFormGroup.controls.name.value,
+      available_as: this.importFormGroup.controls.available_as.value,
+      autoinstall_file: this.importFormGroup.controls.autoinstall_file.value,
+      rsync_flags: this.importFormGroup.controls.rsync_flags.value,
+      arch: this.importFormGroup.controls.arch.value,
+      breed: this.importFormGroup.controls.breed.value,
+      os_version: this.importFormGroup.controls.os_version.value,
+    };
+    if (this.importFormGroup.invalid) {
+      this._snackBar.open("Please give all inputs a system name!", "Close", {duration: 2000})
+      return;
+    }
+    this.cobblerApiService.background_import(importOptions, this.userService.token).subscribe(
+      value => {
+        // TODO
+      },
+      error => {
+        // HTML encode the error message since it originates from XML
+        this._snackBar.open(this.toHTML(error.message), 'Close');
+      });
+  }
+
+  toHTML(input: string): any {
+    // FIXME: Deduplicate method
+    return new DOMParser().parseFromString(input, 'text/html').documentElement.textContent;
   }
 
 }

projects/cobbler-frontend/src/app/actions/replicate/replicate.component.ts

@@ -66,7 +66,6 @@ export class ReplicateComponent {
       sync_all: this.replicateFormGroup.controls.sync_all.value,
       use_ssl: this.replicateFormGroup.controls.use_ssl.value,
     }
-    console.log(replicateOptions)
     this.cobblerApiService.background_replicate(replicateOptions, this.userService.token).subscribe(
       value => {
         // TODO