From 9c4fdd42fcbf04b76cee2ff5d168c3b73f7230f2 Mon Sep 17 00:00:00 2001 From: root Date: Tue, 18 Jun 2024 15:26:34 -0500 Subject: [PATCH 1/6] #267 - Update to RBAC table --- .../df-script-details.component.ts | 2 + .../df-roles-access.component.html | 21 ++- .../df-roles-access.component.scss | 5 + .../df-roles-access.component.ts | 60 +++++-- .../df-link-service.component.html | 81 ++++++++++ .../df-link-service.component.ts | 149 ++++++++++++++++++ 6 files changed, 301 insertions(+), 17 deletions(-) create mode 100644 src/app/shared/components/df-link-service/df-link-service.component.html create mode 100644 src/app/shared/components/df-link-service/df-link-service.component.ts diff --git a/src/app/adf-event-scripts/df-script-details/df-script-details.component.ts b/src/app/adf-event-scripts/df-script-details/df-script-details.component.ts index a938a296..591f0265 100644 --- a/src/app/adf-event-scripts/df-script-details/df-script-details.component.ts +++ b/src/app/adf-event-scripts/df-script-details/df-script-details.component.ts @@ -32,6 +32,7 @@ import { DfBaseCrudService } from 'src/app/shared/services/df-base-crud.service' import { Service, ServiceType } from 'src/app/shared/types/service'; import { CommonModule } from '@angular/common'; import { DfThemeService } from 'src/app/shared/services/df-theme.service'; +import { DfLinkServiceComponent } from 'src/app/shared/components/df-link-service/df-link-service.component'; @UntilDestroy({ checkProperties: true }) @Component({ @@ -53,6 +54,7 @@ import { DfThemeService } from 'src/app/shared/services/df-theme.service'; MatInputModule, AsyncPipe, CommonModule, + DfLinkServiceComponent, ], }) export class DfScriptDetailsComponent implements OnInit { diff --git a/src/app/adf-roles/df-roles-access/df-roles-access.component.html b/src/app/adf-roles/df-roles-access/df-roles-access.component.html index 93fc4b07..8aa72e9d 100644 --- a/src/app/adf-roles/df-roles-access/df-roles-access.component.html +++ b/src/app/adf-roles/df-roles-access/df-roles-access.component.html @@ -53,12 +53,23 @@ {{ 'roles.accessOverview.tableHeadings.component' | transloco }} - + + + + + + {{ option }} + *ngFor="let option of filteredComponentArray[i]" + [value]="option"> + {{ option }} + diff --git a/src/app/adf-roles/df-roles-access/df-roles-access.component.scss b/src/app/adf-roles/df-roles-access/df-roles-access.component.scss index d6756233..d75198b0 100644 --- a/src/app/adf-roles/df-roles-access/df-roles-access.component.scss +++ b/src/app/adf-roles/df-roles-access/df-roles-access.component.scss @@ -40,3 +40,8 @@ tr.element-row:not(.example-expanded-row):active { .detail-input { margin-right: 20px; } +::ng-deep { + .cdk-overlay-pane { + width: max-content !important; + } +} diff --git a/src/app/adf-roles/df-roles-access/df-roles-access.component.ts b/src/app/adf-roles/df-roles-access/df-roles-access.component.ts index 928fb3dc..4c0c890f 100644 --- a/src/app/adf-roles/df-roles-access/df-roles-access.component.ts +++ b/src/app/adf-roles/df-roles-access/df-roles-access.component.ts @@ -5,6 +5,7 @@ import { FormGroup, ReactiveFormsModule, Validators, + FormBuilder, } from '@angular/forms'; import { MatTableDataSource, MatTableModule } from '@angular/material/table'; import { faPlus, faTrashCan } from '@fortawesome/free-solid-svg-icons'; @@ -19,6 +20,7 @@ import { MatInputModule } from '@angular/material/input'; import { MatExpansionModule } from '@angular/material/expansion'; import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; import { MatButtonModule } from '@angular/material/button'; + import { UntilDestroy } from '@ngneat/until-destroy'; import { BehaviorSubject } from 'rxjs'; import { AsyncPipe } from '@angular/common'; @@ -112,13 +114,24 @@ export class DfRolesAccessComponent implements OnInit { { value: 'is null', label: 'is null' }, { value: 'is not null', label: 'is not null' }, ]; - + form: FormGroup; constructor( private activatedRoute: ActivatedRoute, @Inject(BASE_SERVICE_TOKEN) - private baseService: DfBaseCrudService - ) {} - + private baseService: DfBaseCrudService, + private fb: FormBuilder + ) { + this.form = this.fb.group({ + cFormArray: this.fb.array([this.createItem()]), + }); + } + createItem(): FormGroup { + return this.fb.group({ + service: [''], + component: [''], + }); + } + filteredComponentArray: Array> = []; ngOnInit() { // get services options this.activatedRoute.data.subscribe((data: any) => { @@ -165,10 +178,41 @@ export class DfRolesAccessComponent implements OnInit { }); } }); + this.initializeFilteredComponents(); this.updateDataSource(); } + get cFormArray(): FormArray { + return this.form.get('formArray') as FormArray; + } + initializeFilteredComponents() { + this.filteredComponentArray = this.formArray.controls.map((_, i) => + this.getComponentArray(i) + ); + } + getComponentArray(index: number): Array { + const serviceId = this.formArray.at(index).get('service')?.value; + const components = this.componentOptions.find( + option => option.serviceId === serviceId + )?.components; + return components || []; + } + + filterOptions(event: Event, index: number) { + const input = (event.target as HTMLInputElement).value.toLowerCase(); + const serviceId = this.formArray.at(index).get('service')?.value; + const components = + this.componentOptions.find(option => option.serviceId === serviceId) + ?.components || []; + this.filteredComponentArray[index] = components.filter(option => + option.toLowerCase().includes(input) + ); + } + + onSelectOpened(index: number) { + this.filteredComponentArray[index] = this.getComponentArray(index); + } async getComponents(index: number) { const serviceId = this.formArray.controls[index].get('service')?.value; const service = @@ -198,14 +242,6 @@ export class DfRolesAccessComponent implements OnInit { } } - getComponentArray(index: number) { - const serviceId = this.formArray.at(index).get('service')?.value; - const components = this.componentOptions.find( - option => option.serviceId === serviceId - )?.components; - return components || []; - } - getExtendOperator(index: number) { const serviceId = this.serviceAccess.at(index).get('extend-operator') ?.value; diff --git a/src/app/shared/components/df-link-service/df-link-service.component.html b/src/app/shared/components/df-link-service/df-link-service.component.html new file mode 100644 index 00000000..dd4ca32e --- /dev/null +++ b/src/app/shared/components/df-link-service/df-link-service.component.html @@ -0,0 +1,81 @@ + +
+ + + + Link to Service + + + + Select Service + + + {{ service.label }} + + + + + Repository: + + + + Branch/Tag: + + + + Path + + +
+ + +
+ + +
+ diff --git a/src/app/shared/components/df-link-service/df-link-service.component.ts b/src/app/shared/components/df-link-service/df-link-service.component.ts new file mode 100644 index 00000000..ec31b4d6 --- /dev/null +++ b/src/app/shared/components/df-link-service/df-link-service.component.ts @@ -0,0 +1,149 @@ +import { + Component, + Inject, + OnInit, + Input, + SimpleChanges, + Output, + OnChanges, +} from '@angular/core'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatButtonModule } from '@angular/material/button'; +import { MatTableModule } from '@angular/material/table'; +import { MatInputModule } from '@angular/material/input'; +import { MatSelectModule } from '@angular/material/select'; +import { MatOptionModule } from '@angular/material/core'; +import { MatSlideToggleModule } from '@angular/material/slide-toggle'; +import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; +import { MatExpansionModule } from '@angular/material/expansion'; +import { TranslocoPipe } from '@ngneat/transloco'; +import { DfThemeService } from 'src/app/shared/services/df-theme.service'; +import { AsyncPipe, CommonModule } from '@angular/common'; +import { UntilDestroy } from '@ngneat/until-destroy'; +import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms'; +import { DfBaseCrudService } from '../../services/df-base-crud.service'; +import { + BASE_SERVICE_TOKEN, + CACHE_SERVICE_TOKEN, + EVENT_SCRIPT_SERVICE_TOKEN, +} from 'src/app/shared/constants/tokens'; +import { switchMap } from 'rxjs'; +import { readAsText } from '../../utilities/file'; +import { Service, ServiceType } from '../../types/service'; + +@UntilDestroy({ checkProperties: true }) +@Component({ + selector: 'df-link-service', + templateUrl: './df-link-service.component.html', + styleUrls: ['./df-link-service.component.scss'], + standalone: true, + imports: [ + MatFormFieldModule, + MatButtonModule, + MatTableModule, + MatInputModule, + MatSelectModule, + MatSlideToggleModule, + FontAwesomeModule, + MatExpansionModule, + TranslocoPipe, + AsyncPipe, + MatOptionModule, + ReactiveFormsModule, + CommonModule, + ], + providers: [DfBaseCrudService], +}) +export class DfLinkServiceComponent implements OnInit, OnChanges { + @Input() cache: string; + @Input({ required: true }) storageServiceId!: string; + @Input({ required: true }) storagePath: FormControl; + @Input({ required: true }) content: FormControl; + + roleForm: FormGroup; + storageServices: Array = []; + selectType = false; + constructor( + private themeService: DfThemeService, + @Inject(CACHE_SERVICE_TOKEN) private cacheService: DfBaseCrudService, + @Inject(BASE_SERVICE_TOKEN) private baseService: DfBaseCrudService, + @Inject(EVENT_SCRIPT_SERVICE_TOKEN) private crudService: DfBaseCrudService + ) { + this.roleForm = new FormGroup({ + serviceList: new FormControl(''), + repoInput: new FormControl(''), + branchInput: new FormControl(''), + pathInput: new FormControl(''), + }); + this.baseService + .getAll<{ + serviceTypes: Array; + services: Array; + }>({ + additionalParams: [ + { + key: 'group', + value: 'source control,file', + }, + ], + }) + .subscribe(res => { + this.storageServices = res.services; + }); + } + isDarkMode = this.themeService.darkMode$; + ngOnInit() { + this.updateDataSource(); + } + + ngOnChanges(changes: SimpleChanges) { + if (changes['storageServiceId']) { + this.findServiceById(); + } + } + + findServiceById() { + const select = this.storageServices.find( + service => service.name === this.storageServiceId + ); + if (select?.type === 'github') { + this.selectType = true; + } else { + this.selectType = false; + } + } + + updateDataSource() { + // + } + onViewLatest() { + const formValues = this.roleForm.getRawValue(); + const service = formValues.serviceList ?? ''; + const repo = formValues.repoInput ?? ''; + const branch = formValues.branchInput ?? ''; + const path = formValues.pathInput ?? ''; + + const filePath = `${service}/_repo/${repo}?branch=${branch}&content=1&path=${path}`; + + if (filePath.endsWith('.json')) { + this.baseService + .downloadJson(filePath) + .subscribe(text => this.content.setValue(text)); + return; + } else { + this.baseService + .downloadFile(filePath) + .pipe(switchMap(res => readAsText(res as Blob))) + .subscribe(text => this.content.setValue(text)); + } + } + + onDeleteCache() { + if (!this.cache) return; + this.cacheService + .delete(`_event/${this.cache}`, { + snackbarSuccess: 'scripts.deleteCacheSuccessMsg', + }) + .subscribe(); + } +} From d690a38421d2a99f1538f2b1115a56b712e9c2c2 Mon Sep 17 00:00:00 2001 From: root Date: Tue, 18 Jun 2024 15:34:34 -0500 Subject: [PATCH 2/6] in progress --- .../components/df-link-service/df-link-service.component.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/app/shared/components/df-link-service/df-link-service.component.ts b/src/app/shared/components/df-link-service/df-link-service.component.ts index ec31b4d6..aded9d68 100644 --- a/src/app/shared/components/df-link-service/df-link-service.component.ts +++ b/src/app/shared/components/df-link-service/df-link-service.component.ts @@ -35,7 +35,7 @@ import { Service, ServiceType } from '../../types/service'; @Component({ selector: 'df-link-service', templateUrl: './df-link-service.component.html', - styleUrls: ['./df-link-service.component.scss'], + // styleUrls: ['./df-link-service.component.scss'], standalone: true, imports: [ MatFormFieldModule, From 894cb9fb2572cf94af2bc7afdb6d7ac5140e22fe Mon Sep 17 00:00:00 2001 From: root Date: Thu, 20 Jun 2024 07:49:47 -0500 Subject: [PATCH 3/6] updated services --- .../df-script-details.component.html | 5 ++++ .../df-service-details.component.ts | 4 +-- .../df-link-service.component.html | 2 +- .../df-link-service.component.ts | 1 - .../df-script-editor.component.html | 29 +++++++++---------- .../df-script-editor.component.ts | 12 ++++++-- 6 files changed, 31 insertions(+), 22 deletions(-) diff --git a/src/app/adf-event-scripts/df-script-details/df-script-details.component.html b/src/app/adf-event-scripts/df-script-details/df-script-details.component.html index a7ba0424..bb350278 100644 --- a/src/app/adf-event-scripts/df-script-details/df-script-details.component.html +++ b/src/app/adf-event-scripts/df-script-details/df-script-details.component.html @@ -106,6 +106,11 @@ class="dynamic-width" >{{ 'Allow Event Modification' | transloco }} + { - this.router.navigate(['../'], { relativeTo: this.activatedRoute }); - // this.router.navigate([`/api-connections/api-docs/${data.name}`]); + this.router.navigate([`/api-connections/api-docs/${data.name}`]); + // this.router.navigate(['../'], { relativeTo: this.activatedRoute }); }); } } diff --git a/src/app/shared/components/df-link-service/df-link-service.component.html b/src/app/shared/components/df-link-service/df-link-service.component.html index dd4ca32e..f725e78f 100644 --- a/src/app/shared/components/df-link-service/df-link-service.component.html +++ b/src/app/shared/components/df-link-service/df-link-service.component.html @@ -4,7 +4,7 @@ class="details-section" [class]="(isDarkMode | async) ? 'dark-theme' : ''"> - + Link to Service diff --git a/src/app/shared/components/df-link-service/df-link-service.component.ts b/src/app/shared/components/df-link-service/df-link-service.component.ts index aded9d68..f8536c1d 100644 --- a/src/app/shared/components/df-link-service/df-link-service.component.ts +++ b/src/app/shared/components/df-link-service/df-link-service.component.ts @@ -4,7 +4,6 @@ import { OnInit, Input, SimpleChanges, - Output, OnChanges, } from '@angular/core'; import { MatFormFieldModule } from '@angular/material/form-field'; diff --git a/src/app/shared/components/df-script-editor/df-script-editor.component.html b/src/app/shared/components/df-script-editor/df-script-editor.component.html index 91779b97..4a0c4cb8 100644 --- a/src/app/shared/components/df-script-editor/df-script-editor.component.html +++ b/src/app/shared/components/df-script-editor/df-script-editor.component.html @@ -23,22 +23,19 @@ {{ 'githubFile' | transloco }} - - - {{ 'path' | transloco }} - - + + {{ 'scripts.path' | transloco }}? + + + {{ 'path' | transloco }} + + + +
+ +
+ diff --git a/src/app/adf-services/df-service-details/df-service-details.component.scss b/src/app/adf-services/df-service-details/df-service-details.component.scss index 6b1b750b..661afdbb 100644 --- a/src/app/adf-services/df-service-details/df-service-details.component.scss +++ b/src/app/adf-services/df-service-details/df-service-details.component.scss @@ -126,6 +126,11 @@ mat-icon { justify-content: flex-end; } +.actions { + display: flex; + gap: 16px; +} + ::ng-deep .mat-expansion-panel-header > .mat-expansion-indicator::after { color: unset !important; } diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json index b5b3c308..da42bee2 100644 --- a/src/assets/i18n/en.json +++ b/src/assets/i18n/en.json @@ -101,6 +101,8 @@ "toggleNav": "Toggle navigation", "desktopFile": "Upload File", "githubFile": "Github Import", + "schema": "Schema", + "apiDocs": "API docs", "searchFeatures": "Search Features", "scriptType": "Script Type", "scriptTypes": { From 5e7a4fc5474a76130f781b095e948700d24f27a0 Mon Sep 17 00:00:00 2001 From: root Date: Thu, 20 Jun 2024 13:58:22 -0500 Subject: [PATCH 5/6] in progress --- .../df-service-details.component.html | 36 ++++++++++++------- .../df-service-details.component.scss | 5 --- .../df-service-details.component.ts | 10 ++++++ 3 files changed, 34 insertions(+), 17 deletions(-) diff --git a/src/app/adf-services/df-service-details/df-service-details.component.html b/src/app/adf-services/df-service-details/df-service-details.component.html index 63fec664..a69d433c 100644 --- a/src/app/adf-services/df-service-details/df-service-details.component.html +++ b/src/app/adf-services/df-service-details/df-service-details.component.html @@ -3,7 +3,7 @@ class="details-section" [class]="(isDarkMode | async) ? 'dark-theme' : ''" (ngSubmit)="save()"> - + @@ -276,7 +276,7 @@

- + *ngIf="!subscriptionRequired" >{{ 'active' | transloco }} - -
- - -
- +
+ + + + + + + + +
diff --git a/src/app/adf-services/df-service-details/df-service-details.component.scss b/src/app/adf-services/df-service-details/df-service-details.component.scss index 661afdbb..6b1b750b 100644 --- a/src/app/adf-services/df-service-details/df-service-details.component.scss +++ b/src/app/adf-services/df-service-details/df-service-details.component.scss @@ -126,11 +126,6 @@ mat-icon { justify-content: flex-end; } -.actions { - display: flex; - gap: 16px; -} - ::ng-deep .mat-expansion-panel-header > .mat-expansion-indicator::after { color: unset !important; } diff --git a/src/app/adf-services/df-service-details/df-service-details.component.ts b/src/app/adf-services/df-service-details/df-service-details.component.ts index 62cc50c7..194f0df0 100644 --- a/src/app/adf-services/df-service-details/df-service-details.component.ts +++ b/src/app/adf-services/df-service-details/df-service-details.component.ts @@ -455,6 +455,16 @@ export class DfServiceDetailsComponent implements OnInit { this.router.navigate(['../'], { relativeTo: this.activatedRoute }); } + gotoSchema() { + const data = this.serviceForm.getRawValue(); + this.router.navigate([`/admin-settings/schema/${data.name}`]); + } + + gotoAPIDocs() { + const data = this.serviceForm.getRawValue(); + this.router.navigate([`/api-connections/api-docs/${data.name}`]); + } + getBackgroundImage(typeLabel: string) { const image = this.images?.find(img => img.label == typeLabel); if (!image) { From 76e464e1cb6aceb9808bf6647b6240a36b5d9067 Mon Sep 17 00:00:00 2001 From: root Date: Thu, 20 Jun 2024 17:05:31 -0500 Subject: [PATCH 6/6] updated service --- .../df-service-details.component.html | 58 +++++++++++++------ 1 file changed, 40 insertions(+), 18 deletions(-) diff --git a/src/app/adf-services/df-service-details/df-service-details.component.html b/src/app/adf-services/df-service-details/df-service-details.component.html index a69d433c..16331c4e 100644 --- a/src/app/adf-services/df-service-details/df-service-details.component.html +++ b/src/app/adf-services/df-service-details/df-service-details.component.html @@ -277,24 +277,46 @@

- - {{ - 'services.controls.serviceType.label' | transloco - }} - - - {{ type.label }} - - - - + + + {{ + 'services.controls.serviceType.label' | transloco + }} + + + {{ type.label }} + + + + + + + + {{ + 'services.controls.serviceType.label' | transloco + }} + + + {{ type.label }} + + + + +