import {PerfectScrollbarDirective} from "./perfect-scroll-bar/perfect-scrollbar.directive";
import {FileOpenerComponent} from "./file-opener/file-opener.component";
import {DownloadArtifactComponent} from "app/ng2/components/ui/download-artifact/download-artifact.component";
+import {UploadArtifactComponent} from "app/ng2/components/ui/upload-artifact/upload-artifact.component";
import {SdcElementIconComponent} from "./sdc-element-icon/sdc-element-icon.component";
import {PanelWrapperComponent} from "./panel-wrapper/panel-wrapper.component";
import { ModalImportTypeComponent } from './modal-import-type/modal-import-type.component';
FileOpenerComponent,
SdcElementIconComponent,
DownloadArtifactComponent,
+ UploadArtifactComponent,
PanelWrapperComponent,
ModalImportTypeComponent
],
SdcElementIconComponent,
FileOpenerComponent,
DownloadArtifactComponent,
+ UploadArtifactComponent,
PanelWrapperComponent,
ModalImportTypeComponent
],
--- /dev/null
+/*
+ * ============LICENSE_START=======================================================
+ * Copyright (C) 2023 Nordix Foundation
+ * ================================================================================
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * SPDX-License-Identifier: Apache-2.0
+ * ============LICENSE_END=========================================================
+ */
+
+import { Component, EventEmitter, Input, Output } from "@angular/core";
+import { ArtifactModel } from "app/models";
+import { TranslateService } from '../../../shared/translator/translate.service';
+import { SdcUiServices } from 'onap-ui-angular';
+
+@Component({
+ selector: 'upload-artifact',
+ template: `
+ <svg-icon
+ [mode]="'primary2'"
+ [disabled]="disabled"
+ [clickable]="!disabled"
+ [name]="iconType"
+ [testId]="testId" mode="info"
+ (click)="fileUpload.click()"
+ clickable="true"
+ size="medium"
+ ></svg-icon>
+ <input
+ type="file"
+ style="display: none;"
+ [disabled]="disabled"
+ (change)="onFileSelect($event)"
+ [accept]="extensionsWithDot"
+ #fileUpload>
+`
+})
+export class UploadArtifactComponent {
+
+ @Input() extensions: string;
+ @Input() artifact: ArtifactModel;
+ @Input() isInstance: boolean;
+ @Input() uploadIconClass: string;
+ @Input() componentType: string;
+ @Input() componentId: string;
+ @Input() testId: string;
+ @Input() disabled: boolean;
+ @Output("onFileUpload") onFileUpload: EventEmitter<any> = new EventEmitter<any>();
+
+ public extensionsWithDot: string;
+ public iconType:string = "upload-o";
+
+ constructor(
+ private modalService: SdcUiServices.ModalService,
+ private translateService: TranslateService) {
+
+ }
+
+ ngOnInit () {
+ this.extensionsWithDot = this.getExtensionsWithDot(this.extensions);
+ }
+
+ public getExtensionsWithDot(extensions:string):string {
+ extensions = extensions || '';
+ return extensions.split(',')
+ .map(ext => '.' + ext.toString())
+ .join(',');
+ }
+
+ public onFileSelect(event) {
+ const file = event.target.files[0];
+ if (file && file.name) {
+ const fileExtension: string = file.name.split('.').pop();
+ if (this.extensionsWithDot.includes(fileExtension.toLowerCase())) {
+ this.onFileUpload.emit(file);
+ } else {
+ const title: string = this.translateService.translate('NEW_SERVICE_RESOURCE_ERROR_VALID_TOSCA_EXTENSIONS_TITLE');
+ const message: string = this.translateService.translate('NEW_SERVICE_RESOURCE_ERROR_VALID_TOSCA_EXTENSIONS', {extensions: this.extensionsWithDot});
+ this.modalService.openWarningModal(title, message, 'error-invalid-tosca-ext');
+ }
+ }
+ }
+}
exports[`tosca artifacts page should match current snapshot of tosca artifact pages component 1`] = `
<tosca-artifact-page
- serviceLoader={[Function Object]}
+ Notification="undefined"
+ componentService={[Function Object]}
+ isLoading="false"
store={[Function Store]}
table={[Function DatatableComponent]}
workspaceService={[Function Object]}
<div
class="tosca-artifact-page"
>
+ <loader />
<ngx-datatable
class="ngx-datatable"
columnmode="flex"
<div class="tosca-artifact-page">
+ <loader [display]="isLoading" [relative]="true"></loader>
<ngx-datatable
columnMode="flex"
[headerHeight]="40"
</div>
</ng-template>
</ngx-datatable-column>
- <ngx-datatable-column [resizeable]="false"name="Type" [flexGrow]="3">
+ <ngx-datatable-column [resizeable]="false" name="Type" [flexGrow]="3">
<ng-template ngx-datatable-cell-template let-row="row">
{{row.artifactType}}
</ng-template>
{{ row.artifactVersion }}
</ng-template>
</ngx-datatable-column>
- <ngx-datatable-column [resizeable]="false"[flexGrow]="1">
+ <ngx-datatable-column *ngIf="isService() && isCheckedOut()" [resizeable]="false" name="Upload" [flexGrow]="1">
+ <ng-template ngx-datatable-cell-template let-row="row">
+ <div class="download-artifact-button">
+ <upload-artifact
+ [artifact]="row"
+ [componentId]="componentId"
+ [componentType]="componentType"
+ [disabled]="!isCheckedOut()"
+ [extensions]="getExtension(row.artifactType)"
+ (onFileUpload)="onFileUpload($event, row.artifactType)"
+ testId="upload_{{row.artifactDisplayName}}"
+ ></upload-artifact>
+ </div>
+ </ng-template>
+ </ngx-datatable-column>
+ <ngx-datatable-column [resizeable]="false" name="Download" [flexGrow]="1">
<ng-template ngx-datatable-cell-template let-row="row">
<div class="download-artifact-button">
<download-artifact [artifact]="row" [componentId]="componentId"
-import {Component, OnInit, ViewChild} from "@angular/core";
-import {WorkspaceService} from "../workspace.service";
-import {SdcUiServices} from "onap-ui-angular";
-import {ArtifactModel} from "../../../../models";
-import {Select, Store} from "@ngxs/store";
-import {WorkspaceState} from "../../../store/states/workspace.state";
-import {ArtifactGroupType} from "../../../../utils";
-import {GetArtifactsByTypeAction} from "../../../store/actions/artifacts.action";
-import {Observable} from "rxjs/index";
-import {ArtifactsState} from "../../../store/states/artifacts.state";
-import {map} from "rxjs/operators";
+import { Component, Inject, OnInit, ViewChild } from "@angular/core";
+import { WorkspaceService } from "../workspace.service";
+import { ArtifactModel } from "../../../../models";
+import { Select, Store } from "@ngxs/store";
+import { WorkspaceState } from "../../../store/states/workspace.state";
+import { ArtifactGroupType } from "../../../../utils";
+import { GetArtifactsByTypeAction } from "../../../store/actions/artifacts.action";
+import { Observable } from "rxjs/index";
+import { ArtifactsState } from "../../../store/states/artifacts.state";
+import { map } from "rxjs/operators";
+import { ArtifactType, ComponentState, ComponentType } from "app/utils/constants"
+import { TopologyTemplateService } from "app/ng2/services/component-services/topology-template.service";
@Component({
selector: 'tosca-artifact-page',
public toscaArtifacts$: Observable<ArtifactModel[]>;
public componentId: string;
public componentType:string;
+ public isLoading: boolean = false;
- constructor(private serviceLoader: SdcUiServices.LoaderService, private workspaceService: WorkspaceService, private store: Store) {
+ constructor(
+ private workspaceService: WorkspaceService,
+ private store: Store,
+ @Inject("Notification") private Notification: any,
+ private componentService: TopologyTemplateService) {
}
this.table.rowDetail.toggleExpandRow(event.row);
}
}
+
+ getExtension(artifactType: string) {
+ switch (artifactType) {
+ case (ArtifactType.TOSCA.TOSCA_CSAR):
+ return "csar";
+ case (ArtifactType.TOSCA.TOSCA_TEMPLATE):
+ return "yaml,yml";
+ }
+ }
+
+ isService() {
+ return ComponentType.SERVICE === this.componentType;
+ }
+
+ isCheckedOut() {
+ return this.workspaceService.metadata.lifecycleState === ComponentState.NOT_CERTIFIED_CHECKOUT;
+ }
+
+ onFileUpload(file, artifactType) {
+ if (file && file.name) {
+ this.isLoading = true;
+ switch (artifactType) {
+ case (ArtifactType.TOSCA.TOSCA_CSAR):
+ this.Notification.error({
+ message: "Feature not implemented yet",
+ title: "Error"
+ });
+ this.isLoading = false;
+ break;
+ case (ArtifactType.TOSCA.TOSCA_TEMPLATE):
+ this.componentService.putServiceToscaTemplate(this.componentId, this.componentType, file).subscribe((response)=> {
+ this.Notification.success({
+ message: "Service " + response.name + " has been updated",
+ title: "Success"
+ });
+ this.isLoading = false;
+ }, () => {
+ this.isLoading = false;
+ });
+ break;
+ }
+ }
+ }
}
\ No newline at end of file
import {NgxsModule, Store} from "@ngxs/store";
import {ArtifactsState} from "../../../store/states/artifacts.state";
import {toscaArtifactMock} from "../../../../../jest/mocks/artifacts-mock";
+import { ComponentServiceNg2 } from "app/ng2/services/component-services/component.service";
describe('tosca artifacts page', () => {
let fixture: ComponentFixture<ToscaArtifactPageComponent>;
let topologyTemplateServiceMock: Partial<TopologyTemplateService>;
let workspaceServiceMock: Partial<WorkspaceService>;
- let loaderServiceMock: Partial<SdcUiServices.LoaderService>;
let store: Store;
+ let notificationMock: Partial<any>;
beforeEach(
};
workspaceServiceMock = {metadata: <ComponentMetadata>{uniqueId: 'service_unique_id', componentType: 'SERVICE'}}
- loaderServiceMock = {
- activate : jest.fn(),
- deactivate: jest.fn()
- }
const configure: ConfigureFn = testBed => {
testBed.configureTestingModule({
declarations: [ToscaArtifactPageComponent],
providers: [
{provide: WorkspaceService, useValue: workspaceServiceMock},
{provide: TopologyTemplateService, useValue: topologyTemplateServiceMock},
- {provide: SdcUiServices.LoaderService, useValue: loaderServiceMock }
+ {provide: ComponentServiceNg2, useValue: {}},
+ {provide: "Notification", useValue: notificationMock }
],
});
};
this.baseUrl = sdcConfig.api.root + sdcConfig.api.component_api_root;
}
+ putServiceToscaTemplate(componentId: string, componentType: string, file) {
+ return this.http.put<any>(this.baseUrl + this.getServerTypeUrl(componentType) + componentId + '/toscaTemplate', file)
+ }
+
getFullComponent(componentType: string, uniqueId: string): Observable<Component> {
return this.http.get<Component>(this.baseUrl + this.getServerTypeUrl(componentType) + uniqueId);
}
Code Review / sdc.git / commitdiff