Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(orb-ui): agent policy fixes #843

Merged
merged 3 commits into from
Feb 8, 2022
Merged

fix(orb-ui): agent policy fixes #843

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
bbb61d9
feat(orb-ui): agent policy handler add modal
gpazuch Feb 7, 2022
a353e3e
wip - agent policy adjustments
gpazuch Feb 7, 2022
3b83742
fix(orb-ui): qname validator and other fixes
gpazuch Feb 7, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions ui/src/app/common/interfaces/orb/agent.policy.interface.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,11 @@ export interface AgentPolicy extends OrbEntity {
*/
version?: number;

/**
* Schema Version
*/
schema_version?: string;

/**
* A timestamp of creation {string}
*/
Expand Down
7 changes: 2 additions & 5 deletions ui/src/app/common/interfaces/orb/policy/config/policy.config.interface.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
*/

import { PolicyTap } from 'app/common/interfaces/orb/policy/policy.tap.interface';
import { PolicyHandler } from 'app/common/interfaces/orb/policy/policy.handler.interface';

/**
* @interface PolicyConfig
Expand All @@ -31,11 +32,7 @@ export interface PolicyConfig {
*/
handlers?: {
modules?: {
[propName: string]: {
config: { [propName: string]: any },
type: string,
[propName: string]: any,
} | string | any,
[propName: string]: PolicyHandler | string | any,
},
};
}
Expand Down
26 changes: 26 additions & 0 deletions ui/src/app/common/interfaces/orb/policy/policy.backend.interface.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
/**
* Agent Policy / Backend Interface
*
* [Policies Architecture]{@link https://github.com/ns1labs/orb/wiki/Architecture:-Policies-and-Datasets}
*/

/**
* @interface PolicyBackend
*/
export interface PolicyBackend {
/**
* backend denomination {string}
*/
backend?: string;

/**
* description {string}
*/
description?: string;

/**
* schema version {string}
*/
schema_version?: string;
}

51 changes: 51 additions & 0 deletions ui/src/app/common/interfaces/orb/policy/policy.handler.interface.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,51 @@
/**
* Agent Policy / Handler Module Interface
*
* [Policies Architecture]{@link https://github.com/ns1labs/orb/wiki/Architecture:-Policies-and-Datasets}
*/

/**
* @interface PolicyHandler
*/
export interface PolicyHandler {
/**
* name {string}
*/
name?: string;

/**
* version {string}
*/
version?: string;

/**
* type {string}
*/
type?: string;

/**
* config {}
*/
config?: { [propName: string]: {} | any };

/**
* filter {}
*/
filter?: { [propName: string]: {} | any };

/**
* metrics {}
*/
metrics?: { [propName: string]: {} | any };

/**
* metrics_groups {}
*/
metrics_groups?: { [propName: string]: {} | any };

/**
* content
*/
content?: { [propName: string]: {} | any };
}

24 changes: 24 additions & 0 deletions ui/src/app/common/interfaces/orb/policy/policy.input.interface.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,24 @@
/**
* Agent Policy / Input Config Interface
*
* [Policies Architecture]{@link https://github.com/ns1labs/orb/wiki/Architecture:-Policies-and-Datasets}
* [Agent Taps](https://github.com/ns1labs/pktvisor/blob/develop/RFCs/2021-04-16-75-taps.md)
*/

/**
* @interface PolicyInput
*/
export interface PolicyInput {
version?: string;

/**
* json object with configs
*/
config?: { [propName: string]: any };

/**
* json object with configs
*/
filter?: { [propName: string]: any };
}

183 changes: 16 additions & 167 deletions ui/src/app/pages/datasets/policies.agent/add/agent.policy.add.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -99,7 +99,7 @@ <h4>{{ isEdit ? 'Edit Agent Policy' : 'Create Agent Policy'}}</h4>
<nb-option *ngFor="let option of availableTaps | keyvalue; index as i"
[attr.data-orb-qa-id]="option.key"
[value]="option.key">{{ option.key }} <span
class="tap-input-text"> {{' | input type: ' + option.value?.input_type }}</span></nb-option>
class="faded-input-text"> {{' | input type: ' + option.value?.input_type }}</span></nb-option>
</nb-select>
</form>
</div>
Expand Down Expand Up @@ -285,7 +285,7 @@ <h4>{{ isEdit ? 'Edit Agent Policy' : 'Create Agent Policy'}}</h4>
</div>
</nb-step>
<nb-step [label]="thirdStepTemplate"
[stepControl]="handlerSelectorFG"

[completed]="isEdit"
data-orb-qa-id="step_2">
<ng-template #thirdStepTemplate>
Expand All @@ -294,8 +294,6 @@ <h4>{{ isEdit ? 'Edit Agent Policy' : 'Create Agent Policy'}}</h4>
<p>Setup any number of handlers</p>
</div>
</ng-template>
<form *ngIf="!!handlerSelectorFG"
[formGroup]="handlerSelectorFG">
<!-- Added Handlers List -->
<div class="d-flex">
<mat-chip-list data-orb-qa-id="handlers-list">
Expand All @@ -313,173 +311,24 @@ <h4>{{ isEdit ? 'Edit Agent Policy' : 'Create Agent Policy'}}</h4>
</mat-chip>
</mat-chip-list>
</div>
<hr/>
<div>
<label class="font-weight-bold">Handler</label>
<span class="required">*</span>
</div>
<!-- Select a Handler -->
<nb-select *ngIf="!!availableHandlers"
(selectedChange)="onHandlerSelected($event)"
appearance="filled"
data-orb-qa-id="sink_selector"
formControlName="selected_handler"
fullWidth="true"
nbTooltip="Select and configure individual policies from a list of available handlers."
placeholder="Select Handler"
size="medium">
<nb-option *ngFor="let handler of availableHandlers | keyvalue; index as i;"
[attr.data-orb-qa-id]="'available_handler: '+handler.key" [id]="handler.key"
[value]="handler.key">{{ handler.key }}</nb-option>
</nb-select>
<hr/>
<div *ngIf="!!liveHandler">
<div>
<label class="font-weight-bold" for="description">Handler Label</label>
<span class="required">*</span>
</div>
<input class="col-10"
data-orb-qa-id="handler-label"
fieldSize="medium"
formControlName="label"
fullWidth="true"
id="label"
nbInput
nbTooltip="Provide a label for your handler configuration"
placeholder="Handler Name"/>
<button (click)="onHandlerAdded()"
[disabled]="!checkValidName()"
class="col-1"
data-orb-qa-id="addHandler"
ghost
nbButton
nbTooltip="Click to Add Handler">
<nb-icon icon="plus-outline"
size="14"
status="primary"
style="color: #df316f;">
</nb-icon>
</button>
<hr/>
</div>
</form>
<!--Dynamic Handler Config-->
<div *ngIf="!!liveHandler && !!dynamicHandlerConfigFG">
<form (ngSubmit)="onFormSubmit()" [formGroup]="dynamicHandlerConfigFG">
<div *ngIf="!!liveHandler.config">
<div *ngFor="let control of liveHandler.config | keyvalue">
<div>
<label class="font-weight-bold">{{control.value.label}}</label>
</div>
<div [ngSwitch]="control.value.input">
<input *ngSwitchCase="'text'"
[attr.data-orb-qa-id]="control.value.name"
[autofocus]="true"
[formControlName]="control.key"
[placeholder]="'e.g.: '.concat(control.value?.props?.example) || ''"
[type]="control.value.type"
fieldSize="medium"
fullWidth="true"
nbInput
nbTooltip="{{ control.value.description }}">
<input *ngSwitchCase="'number'"
[attr.data-orb-qa-id]="control.value.name"
[autofocus]="true"
[formControlName]="control.key"
[max]="control.value?.props?.max"
[min]="control.value?.props?.min"
[placeholder]="'e.g.: '.concat(control.value?.props?.example) || ''"
[step]="control.value?.props?.step"
[type]="control.value.type"
nbTooltip="{{ control.value.description }}">
<nb-select *ngSwitchCase="'select'"
[attr.data-orb-qa-id]="control.value.name"
[formControlName]="control.key"
[id]="control.value.name"
[placeholder]="'e.g.: '.concat(control.value?.props?.example) || ''"
appearance="filled"
fullWidth="true"
nbTooltip="{{ control.value.description }}"
size="medium">
{{ control.value.name + "-" + control.value.props.options }}
<nb-option *ngFor="let option of control.value.props.options | keyvalue"
[attr.data-orb-qa-id]="option.key"
[value]="option.value">{{ option.value }}</nb-option>
</nb-select>
<nb-checkbox *ngSwitchCase="'checkbox'"
[attr.data-orb-qa-id]="control.value.name"
[formControlName]="control.key"
[id]="control.value.name"
nbTooltip="{{ control.value.description }}">
{{control.value.name}}
</nb-checkbox>
</div>
<hr/>
</div>
</div>
</form>
</div>
<!--Dynamic Handler Filter-->
<div *ngIf="!!liveHandler && !!dynamicHandlerFilterFG">
<form (ngSubmit)="onFormSubmit()" [formGroup]="dynamicHandlerFilterFG">
<div *ngIf="!!liveHandler.filter">
<div *ngFor="let control of liveHandler.filter | keyvalue">
<div>
<label class="font-weight-bold">{{control.value.label}}</label>
</div>
<div [ngSwitch]="control.value.input">
<input *ngSwitchCase="'text'"
[attr.data-orb-qa-id]="control.value.name"
[autofocus]="true"
[formControlName]="control.key"
[placeholder]="'e.g.: '.concat(control.value?.props?.example) || ''"
[type]="control.value.type"
fieldSize="medium"
fullWidth="true"
nbInput
nbTooltip="{{ control.value.description }}">
<input *ngSwitchCase="'number'"
[attr.data-orb-qa-id]="control.value.name"
[autofocus]="true"
[formControlName]="control.key"
[max]="control.value?.props?.max"
[min]="control.value?.props?.min"
[placeholder]="'e.g.: '.concat(control.value?.props?.example) || ''"
[step]="control.value?.props?.step"
[type]="control.value.type"
nbTooltip="{{ control.value.description }}">
<nb-select *ngSwitchCase="'select'"
[attr.data-orb-qa-id]="control.value.name"
[formControlName]="control.key"
[id]="control.value.name"
[placeholder]="'e.g.: '.concat(control.value?.props?.example) || ''"
appearance="filled"
fullWidth="true"
nbTooltip="{{ control.value.description }}"
size="medium">
{{ control.value.name + "-" + control.value.props.options }}
<nb-option *ngFor="let option of control.value.props.options | keyvalue"
[attr.data-orb-qa-id]="option.key"
[value]="option.value">{{ option.value }}</nb-option>
</nb-select>
<nb-checkbox *ngSwitchCase="'checkbox'"
[attr.data-orb-qa-id]="control.value.name"
[formControlName]="control.key"
[id]="control.value.name"
nbTooltip="{{ control.value.description }}">
{{control.value.name}}
</nb-checkbox>
</div>
<hr/>
</div>
</div>
</form>
</div>
<button (click)="addHandler()"
class="next-button"
data-orb-qa-id="addHandler"
nbButton
status="primary"
shape="round"
nbTooltip="Click to Add Handler">
<nb-icon icon="plus-outline"
size="14"
status="primary"
style="color: #df316f;">
</nb-icon>
Add Handler
</button>
<div class="d-flex justify-content-start"
style="padding-left: 35%;">
<button
data-orb-qa-id="back"
(click)="liveHandler = null"
ghost
nbButton
nbStepperPrevious
Expand Down
2 changes: 1 addition & 1 deletion ui/src/app/pages/datasets/policies.agent/add/agent.policy.add.component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -120,7 +120,7 @@ mat-chip nb-icon {
}
}

.tap-input-text {
.faded-input-text {
color: #969fb9;
font-family: 'Montserrat', sans-serif;
padding-left: 5px;
Expand Down
Loading