From 1bd86f5abdb5e9825e9f375ec64f4d2a8cea45f4 Mon Sep 17 00:00:00 2001 From: Jason Kulatunga Date: Wed, 25 May 2022 14:59:55 -0700 Subject: [PATCH] [WIP] Delete button for devices. --- webapp/backend/pkg/database/interface.go | 1 + .../database/scrutiny_repository_device.go | 4 ++ .../backend/pkg/web/handler/delete_device.go | 22 ++++++++ webapp/backend/pkg/web/server.go | 2 + ...hboard-device-delete-dialog.component.html | 10 ++++ ...hboard-device-delete-dialog.component.scss | 0 ...ard-device-delete-dialog.component.spec.ts | 25 +++++++++ ...ashboard-device-delete-dialog.component.ts | 16 ++++++ .../dashboard-device-delete-dialog.module.ts | 52 +++++++++++++++++++ .../dashboard-device.component.html | 10 +++- .../dashboard-device.component.ts | 15 ++++++ .../dashboard-device.module.ts | 3 +- .../dashboard/dashboard.component.html | 2 - 13 files changed, 157 insertions(+), 5 deletions(-) create mode 100644 webapp/backend/pkg/web/handler/delete_device.go create mode 100644 webapp/frontend/src/app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.component.html create mode 100644 webapp/frontend/src/app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.component.scss create mode 100644 webapp/frontend/src/app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.component.spec.ts create mode 100644 webapp/frontend/src/app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.component.ts create mode 100644 webapp/frontend/src/app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.module.ts diff --git a/webapp/backend/pkg/database/interface.go b/webapp/backend/pkg/database/interface.go index 2d4eba4..5ab7084 100644 --- a/webapp/backend/pkg/database/interface.go +++ b/webapp/backend/pkg/database/interface.go @@ -19,6 +19,7 @@ type DeviceRepo interface { UpdateDevice(ctx context.Context, wwn string, collectorSmartData collector.SmartInfo) (models.Device, error) UpdateDeviceStatus(ctx context.Context, wwn string, status pkg.DeviceStatus) (models.Device, error) GetDeviceDetails(ctx context.Context, wwn string) (models.Device, error) + DeleteDevice(ctx context.Context, wwn string) error SaveSmartAttributes(ctx context.Context, wwn string, collectorSmartData collector.SmartInfo) (measurements.Smart, error) GetSmartAttributeHistory(ctx context.Context, wwn string, durationKey string, attributes []string) ([]measurements.Smart, error) diff --git a/webapp/backend/pkg/database/scrutiny_repository_device.go b/webapp/backend/pkg/database/scrutiny_repository_device.go index ed7d22d..e5b0800 100644 --- a/webapp/backend/pkg/database/scrutiny_repository_device.go +++ b/webapp/backend/pkg/database/scrutiny_repository_device.go @@ -72,3 +72,7 @@ func (sr *scrutinyRepository) GetDeviceDetails(ctx context.Context, wwn string) return device, nil } + +func (sr *scrutinyRepository) DeleteDevice(ctx context.Context, wwn string) error { + return nil +} diff --git a/webapp/backend/pkg/web/handler/delete_device.go b/webapp/backend/pkg/web/handler/delete_device.go new file mode 100644 index 0000000..63336c9 --- /dev/null +++ b/webapp/backend/pkg/web/handler/delete_device.go @@ -0,0 +1,22 @@ +package handler + +import ( + "github.com/analogj/scrutiny/webapp/backend/pkg/database" + "github.com/gin-gonic/gin" + "github.com/sirupsen/logrus" + "net/http" +) + +func DeleteDevice(c *gin.Context) { + logger := c.MustGet("LOGGER").(logrus.FieldLogger) + deviceRepo := c.MustGet("DEVICE_REPOSITORY").(database.DeviceRepo) + + err := deviceRepo.DeleteDevice(c, c.Param("wwn")) + if err != nil { + logger.Errorln("An error occurred while deleting device", err) + c.JSON(http.StatusInternalServerError, gin.H{"success": false}) + return + } + + c.JSON(http.StatusOK, gin.H{"success": true}) +} diff --git a/webapp/backend/pkg/web/server.go b/webapp/backend/pkg/web/server.go index 974ffb2..914a102 100644 --- a/webapp/backend/pkg/web/server.go +++ b/webapp/backend/pkg/web/server.go @@ -47,6 +47,8 @@ func (ae *AppEngine) Setup(logger logrus.FieldLogger) *gin.Engine { api.POST("/device/:wwn/smart", handler.UploadDeviceMetrics) //used by Collector to upload data api.POST("/device/:wwn/selftest", handler.UploadDeviceSelfTests) api.GET("/device/:wwn/details", handler.GetDeviceDetails) //used by Details + api.DELETE("/device/:wwn", handler.DeleteDevice) //used by UI to delete device + } } diff --git a/webapp/frontend/src/app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.component.html b/webapp/frontend/src/app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.component.html new file mode 100644 index 0000000..ab952ba --- /dev/null +++ b/webapp/frontend/src/app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.component.html @@ -0,0 +1,10 @@ +

Delete {{data.title}}?

+This will delete all data associated with this device (including all historical data). + + + + + diff --git a/webapp/frontend/src/app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.component.scss b/webapp/frontend/src/app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.component.scss new file mode 100644 index 0000000..e69de29 diff --git a/webapp/frontend/src/app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.component.spec.ts b/webapp/frontend/src/app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.component.spec.ts new file mode 100644 index 0000000..db01c53 --- /dev/null +++ b/webapp/frontend/src/app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.component.spec.ts @@ -0,0 +1,25 @@ +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { DashboardDeviceDeleteDialogComponent } from './dashboard-device-delete-dialog.component'; + +describe('DashboardDeviceDeleteDialogComponent', () => { + let component: DashboardDeviceDeleteDialogComponent; + let fixture: ComponentFixture; + + beforeEach(async(() => { + TestBed.configureTestingModule({ + declarations: [ DashboardDeviceDeleteDialogComponent ] + }) + .compileComponents(); + })); + + beforeEach(() => { + fixture = TestBed.createComponent(DashboardDeviceDeleteDialogComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/webapp/frontend/src/app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.component.ts b/webapp/frontend/src/app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.component.ts new file mode 100644 index 0000000..1fc9729 --- /dev/null +++ b/webapp/frontend/src/app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.component.ts @@ -0,0 +1,16 @@ +import { Component, OnInit, Inject } from '@angular/core'; +import {MAT_DIALOG_DATA} from '@angular/material/dialog'; + +@Component({ + selector: 'app-dashboard-device-delete-dialog', + templateUrl: './dashboard-device-delete-dialog.component.html', + styleUrls: ['./dashboard-device-delete-dialog.component.scss'] +}) +export class DashboardDeviceDeleteDialogComponent implements OnInit { + + constructor(@Inject(MAT_DIALOG_DATA) public data: {wwn: string, title: string}) { } + + ngOnInit(): void { + } + +} diff --git a/webapp/frontend/src/app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.module.ts b/webapp/frontend/src/app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.module.ts new file mode 100644 index 0000000..adbe645 --- /dev/null +++ b/webapp/frontend/src/app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.module.ts @@ -0,0 +1,52 @@ +import { NgModule } from '@angular/core'; +import { RouterModule } from '@angular/router'; +import { Overlay } from '@angular/cdk/overlay'; +import { MAT_AUTOCOMPLETE_SCROLL_STRATEGY, MatAutocompleteModule } from '@angular/material/autocomplete'; +import { MatButtonModule } from '@angular/material/button'; +import { MatSelectModule } from '@angular/material/select'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatIconModule } from '@angular/material/icon'; +import { MatInputModule } from '@angular/material/input'; +import { SharedModule } from 'app/shared/shared.module'; +import {DashboardDeviceDeleteDialogComponent} from 'app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.component' +import { MatButtonToggleModule} from "@angular/material/button-toggle"; +import {MatTabsModule} from "@angular/material/tabs"; +import {MatSliderModule} from "@angular/material/slider"; +import {MatSlideToggleModule} from "@angular/material/slide-toggle"; +import {MatTooltipModule} from "@angular/material/tooltip"; +import {dashboardRoutes} from "../../../modules/dashboard/dashboard.routing"; +import {MatDividerModule} from "@angular/material/divider"; +import {MatMenuModule} from "@angular/material/menu"; +import {MatProgressBarModule} from "@angular/material/progress-bar"; +import {MatSortModule} from "@angular/material/sort"; +import {MatTableModule} from "@angular/material/table"; +import {NgApexchartsModule} from "ng-apexcharts"; +import { MatDialogModule } from '@angular/material/dialog'; + +@NgModule({ + declarations: [ + DashboardDeviceDeleteDialogComponent + ], + imports : [ + RouterModule.forChild([]), + RouterModule.forChild(dashboardRoutes), + MatButtonModule, + MatDividerModule, + MatTooltipModule, + MatIconModule, + MatMenuModule, + MatProgressBarModule, + MatSortModule, + MatTableModule, + NgApexchartsModule, + SharedModule, + MatDialogModule + ], + exports : [ + DashboardDeviceDeleteDialogComponent, + ], + providers : [] +}) +export class DashboardDeviceDeleteDialogModule +{ +} diff --git a/webapp/frontend/src/app/layout/common/dashboard-device/dashboard-device.component.html b/webapp/frontend/src/app/layout/common/dashboard-device/dashboard-device.component.html index df68121..5e21f3c 100644 --- a/webapp/frontend/src/app/layout/common/dashboard-device/dashboard-device.component.html +++ b/webapp/frontend/src/app/layout/common/dashboard-device/dashboard-device.component.html @@ -29,10 +29,17 @@ + [svgIcon]="'assessment'"> View Details + + + + Delete Device + + @@ -58,4 +65,3 @@ - diff --git a/webapp/frontend/src/app/layout/common/dashboard-device/dashboard-device.component.ts b/webapp/frontend/src/app/layout/common/dashboard-device/dashboard-device.component.ts index 5cd83be..d4229a8 100644 --- a/webapp/frontend/src/app/layout/common/dashboard-device/dashboard-device.component.ts +++ b/webapp/frontend/src/app/layout/common/dashboard-device/dashboard-device.component.ts @@ -5,6 +5,8 @@ import {AppConfig} from "app/core/config/app.config"; import {TreoConfigService} from "@treo/services/config"; import {Subject} from "rxjs"; import humanizeDuration from 'humanize-duration' +import {MatDialog} from '@angular/material/dialog'; +import {DashboardDeviceDeleteDialogComponent} from "app/layout/common/dashboard-device-delete-dialog/dashboard-device-delete-dialog.component"; @Component({ selector: 'app-dashboard-device', @@ -21,6 +23,7 @@ export class DashboardDeviceComponent implements OnInit { constructor( private _configService: TreoConfigService, + public dialog: MatDialog ) { // Set the private defaults this._unsubscribeAll = new Subject(); @@ -82,6 +85,18 @@ export class DashboardDeviceComponent implements OnInit { readonly humanizeDuration = humanizeDuration; + + + openDeleteDialog(): void { + const dialogRef = this.dialog.open(DashboardDeviceDeleteDialogComponent, { + // width: '250px', + data: {wwn: this.deviceWWN, title: this.deviceTitle(this.deviceSummary.device)} + }); + + dialogRef.afterClosed().subscribe(result => { + console.log('The dialog was closed'); + }); + } } export function deviceDisplayTitle(disk, titleType: string){ diff --git a/webapp/frontend/src/app/layout/common/dashboard-device/dashboard-device.module.ts b/webapp/frontend/src/app/layout/common/dashboard-device/dashboard-device.module.ts index bb77189..209f2a1 100644 --- a/webapp/frontend/src/app/layout/common/dashboard-device/dashboard-device.module.ts +++ b/webapp/frontend/src/app/layout/common/dashboard-device/dashboard-device.module.ts @@ -22,7 +22,7 @@ import {MatProgressBarModule} from "@angular/material/progress-bar"; import {MatSortModule} from "@angular/material/sort"; import {MatTableModule} from "@angular/material/table"; import {NgApexchartsModule} from "ng-apexcharts"; -import {DashboardSettingsModule} from "../dashboard-settings/dashboard-settings.module"; +import {DashboardDeviceDeleteDialogModule} from "../dashboard-device-delete-dialog/dashboard-device-delete-dialog.module"; @NgModule({ declarations: [ @@ -41,6 +41,7 @@ import {DashboardSettingsModule} from "../dashboard-settings/dashboard-settings. MatTableModule, NgApexchartsModule, SharedModule, + DashboardDeviceDeleteDialogModule ], exports : [ DashboardDeviceComponent, diff --git a/webapp/frontend/src/app/modules/dashboard/dashboard.component.html b/webapp/frontend/src/app/modules/dashboard/dashboard.component.html index e719d09..26043dd 100644 --- a/webapp/frontend/src/app/modules/dashboard/dashboard.component.html +++ b/webapp/frontend/src/app/modules/dashboard/dashboard.component.html @@ -111,6 +111,4 @@ scrutiny-collector-metrics run - -