diff --git a/ui-ngx/src/app/shared/components/rule-chain/rule-chain-select.component.html b/ui-ngx/src/app/shared/components/rule-chain/rule-chain-select.component.html
index bc8bde2b17..026454ed18 100644
--- a/ui-ngx/src/app/shared/components/rule-chain/rule-chain-select.component.html
+++ b/ui-ngx/src/app/shared/components/rule-chain/rule-chain-select.component.html
@@ -15,18 +15,17 @@
limitations under the License.
-->
-
-
- settings_ethernet
- {{ruleChain?.name}}
-
-
- {{ruleChain.name}}
-
-
+
+ settings_ethernet
+
+
+ {{ruleChain.name}}
+
+
+
diff --git a/ui-ngx/src/app/shared/components/rule-chain/rule-chain-select.component.scss b/ui-ngx/src/app/shared/components/rule-chain/rule-chain-select.component.scss
index 6221000d64..d2b3580be2 100644
--- a/ui-ngx/src/app/shared/components/rule-chain/rule-chain-select.component.scss
+++ b/ui-ngx/src/app/shared/components/rule-chain/rule-chain-select.component.scss
@@ -19,21 +19,14 @@
padding: 0 6px;
.tb-rule-chain-select {
display: flex;
- height: 48px;
min-height: 100%;
pointer-events: all;
+ }
+}
- &-trigger {
- &-text {
- max-width: 190px;
- text-overflow: ellipsis;
- overflow: hidden;
- }
- &-icon {
- display: flex;
- width: 36px;
- justify-content: center;
- }
- }
+:host ::ng-deep {
+ .mat-mdc-form-field-infix {
+ min-height: 48px;
+ padding: 12px 0 !important;
}
}
diff --git a/ui-ngx/src/app/shared/components/rule-chain/rule-chain-select.component.ts b/ui-ngx/src/app/shared/components/rule-chain/rule-chain-select.component.ts
index 0b2564f2ae..003d85b751 100644
--- a/ui-ngx/src/app/shared/components/rule-chain/rule-chain-select.component.ts
+++ b/ui-ngx/src/app/shared/components/rule-chain/rule-chain-select.component.ts
@@ -57,7 +57,7 @@ export class RuleChainSelectComponent implements ControlValueAccessor, OnInit {
ruleChains$: Observable>;
- ruleChain: RuleChain;
+ ruleChainId: string | null;
private propagateChange = (v: any) => { };
@@ -76,10 +76,6 @@ export class RuleChainSelectComponent implements ControlValueAccessor, OnInit {
);
}
- public compareWith(object1: any, object2: any) {
- return object1 && object2 && object1.id.id === object2.id.id;
- }
-
registerOnChange(fn: any): void {
this.propagateChange = fn;
}
@@ -94,21 +90,16 @@ export class RuleChainSelectComponent implements ControlValueAccessor, OnInit {
writeValue(value: string | null): void {
if (isDefinedAndNotNull(value)) {
- this.ruleChainService.getRuleChain(value)
- .subscribe(ruleChain => this.ruleChain = ruleChain);
+ this.ruleChainId = value;
}
}
- getname() {
- return this.ruleChain?.name;
- }
-
ruleChainIdChanged() {
this.updateView();
}
private updateView() {
- this.propagateChange(this.ruleChain.id.id);
+ this.propagateChange(this.ruleChainId);
}
private getRuleChains(pageLink: PageLink): Observable> {