This is an automated email from the ASF dual-hosted git repository.

dominikriemer pushed a commit to branch readd-form-field-chips
in repository https://gitbox.apache.org/repos/asf/streampipes.git

commit f4aa844ba225ceccbf8d29918d0101420b603337
Author: Dominik Riemer <[email protected]>
AuthorDate: Thu Jul 2 22:58:31 2026 +0200

    fix: Re-add mat-form-field wrapper
---
 .../asset-details-labels.component.html            | 42 ++++++------
 .../asset-details-labels.component.ts              |  2 +
 .../adapter-deployment-settings.component.html     | 77 +++++++++++-----------
 .../adapter-deployment-settings.component.ts       |  6 +-
 4 files changed, 67 insertions(+), 60 deletions(-)

diff --git 
a/ui/src/app/assets/components/asset-details/edit-asset/asset-details-panel/asset-details-basics/asset-details-labels/asset-details-labels.component.html
 
b/ui/src/app/assets/components/asset-details/edit-asset/asset-details-panel/asset-details-basics/asset-details-labels/asset-details-labels.component.html
index c00478defc..a8b8334d86 100644
--- 
a/ui/src/app/assets/components/asset-details/edit-asset/asset-details-panel/asset-details-basics/asset-details-labels/asset-details-labels.component.html
+++ 
b/ui/src/app/assets/components/asset-details/edit-asset/asset-details-panel/asset-details-basics/asset-details-labels/asset-details-labels.component.html
@@ -44,7 +44,7 @@
                                 <mat-icon>refresh</mat-icon>
                             </button>
                         </div>
-                        <div
+                        <mat-form-field
                             class="asset-label-chip-field"
                             [class.asset-label-chip-field-disabled]="
                                 allLabels.length === 0
@@ -80,26 +80,26 @@
                                         </button>
                                     </mat-chip-row>
                                 }
+                                <input
+                                    [placeholder]="
+                                        allLabels.length === 0
+                                            ? ('No labels available - Click 
\'Manage Labels\''
+                                              | translate)
+                                            : ('Click to add label' | 
translate)
+                                    "
+                                    data-cy="asset-label-input"
+                                    class="asset-label-chip-input"
+                                    #labelInput
+                                    [formControl]="labelCtrl"
+                                    [matChipInputFor]="chipGrid"
+                                    [matAutocomplete]="auto"
+                                    [matChipInputSeparatorKeyCodes]="
+                                        separatorKeysCodes
+                                    "
+                                    (matChipInputTokenEnd)="add($event)"
+                                    [disabled]="allLabels.length === 0"
+                                />
                             </mat-chip-grid>
-                            <input
-                                [placeholder]="
-                                    allLabels.length === 0
-                                        ? ('No labels available - Click 
\'Manage Labels\''
-                                          | translate)
-                                        : ('Click to add label' | translate)
-                                "
-                                data-cy="asset-label-input"
-                                class="asset-label-chip-input"
-                                #labelInput
-                                [formControl]="labelCtrl"
-                                [matChipInputFor]="chipGrid"
-                                [matAutocomplete]="auto"
-                                [matChipInputSeparatorKeyCodes]="
-                                    separatorKeysCodes
-                                "
-                                (matChipInputTokenEnd)="add($event)"
-                                [disabled]="allLabels.length === 0"
-                            />
                             <mat-autocomplete
                                 #auto="matAutocomplete"
                                 (optionSelected)="selected($event)"
@@ -115,7 +115,7 @@
                                     >
                                 }
                             </mat-autocomplete>
-                        </div>
+                        </mat-form-field>
                     </sp-form-field>
                 }
             </div>
diff --git 
a/ui/src/app/assets/components/asset-details/edit-asset/asset-details-panel/asset-details-basics/asset-details-labels/asset-details-labels.component.ts
 
b/ui/src/app/assets/components/asset-details/edit-asset/asset-details-panel/asset-details-basics/asset-details-labels/asset-details-labels.component.ts
index 1e93db37ad..5e4c9ab779 100644
--- 
a/ui/src/app/assets/components/asset-details/edit-asset/asset-details-panel/asset-details-basics/asset-details-labels/asset-details-labels.component.ts
+++ 
b/ui/src/app/assets/components/asset-details/edit-asset/asset-details-panel/asset-details-basics/asset-details-labels/asset-details-labels.component.ts
@@ -55,6 +55,7 @@ import {
 import { MatButton, MatIconButton } from '@angular/material/button';
 import { RouterLink } from '@angular/router';
 import { MatIcon } from '@angular/material/icon';
+import { MatFormField } from '@angular/material/form-field';
 import { AsyncPipe, NgStyle } from '@angular/common';
 import { StyleDirective } from '@ngbracket/ngx-layout/extended';
 import { MatOption } from '@angular/material/select';
@@ -73,6 +74,7 @@ import { TranslatePipe } from '@ngx-translate/core';
         RouterLink,
         MatIconButton,
         MatIcon,
+        MatFormField,
         MatChipsModule,
         NgStyle,
         StyleDirective,
diff --git 
a/ui/src/app/connect/components/adapter-configuration/adapter-settings/adapter-deployment-settings/adapter-deployment-settings.component.html
 
b/ui/src/app/connect/components/adapter-configuration/adapter-settings/adapter-deployment-settings/adapter-deployment-settings.component.html
index 119887bfc8..85b7c1b9fe 100644
--- 
a/ui/src/app/connect/components/adapter-configuration/adapter-settings/adapter-deployment-settings/adapter-deployment-settings.component.html
+++ 
b/ui/src/app/connect/components/adapter-configuration/adapter-settings/adapter-deployment-settings/adapter-deployment-settings.component.html
@@ -36,44 +36,45 @@
 
     @if (deploymentMode === 'filter') {
         <div fxFlex="100" fxLayout="column" class="mt-10">
-            <label>Service Tags</label>
-            <div>
-                <mat-chip-grid #chipGrid>
-                    @for (
-                        serviceTag of 
deploymentConfiguration.desiredServiceTags;
-                        track serviceTag
-                    ) {
-                        <mat-chip-row (removed)="remove(serviceTag.value)">
-                            {{ serviceTag.value }}
-                            <button matChipRemove>
-                                <mat-icon>cancel</mat-icon>
-                            </button>
-                        </mat-chip-row>
-                    }
-                </mat-chip-grid>
-                <input
-                    placeholder="Add service tag"
-                    #serviceTagInput
-                    [formControl]="serviceTagCtrl"
-                    [matChipInputFor]="chipGrid"
-                    [matAutocomplete]="auto"
-                    [matChipInputSeparatorKeyCodes]="separatorKeysCodes"
-                    (matChipInputTokenEnd)="add($event)"
-                />
-                <mat-autocomplete
-                    #auto="matAutocomplete"
-                    (optionSelected)="selected($event)"
-                >
-                    @for (
-                        serviceTag of filteredServiceTags | async;
-                        track serviceTag
-                    ) {
-                        <mat-option [value]="serviceTag">
-                            {{ serviceTag }}
-                        </mat-option>
-                    }
-                </mat-autocomplete>
-            </div>
+            <sp-form-field [level]="3" label="Service Tags">
+                <mat-form-field color="accent">
+                    <mat-chip-grid #chipGrid>
+                        @for (
+                            serviceTag of 
deploymentConfiguration.desiredServiceTags;
+                            track serviceTag
+                        ) {
+                            <mat-chip-row (removed)="remove(serviceTag.value)">
+                                {{ serviceTag.value }}
+                                <button matChipRemove>
+                                    <mat-icon>cancel</mat-icon>
+                                </button>
+                            </mat-chip-row>
+                        }
+                        <input
+                            placeholder="Add service tag"
+                            #serviceTagInput
+                            [formControl]="serviceTagCtrl"
+                            [matChipInputFor]="chipGrid"
+                            [matAutocomplete]="auto"
+                            
[matChipInputSeparatorKeyCodes]="separatorKeysCodes"
+                            (matChipInputTokenEnd)="add($event)"
+                        />
+                    </mat-chip-grid>
+                    <mat-autocomplete
+                        #auto="matAutocomplete"
+                        (optionSelected)="selected($event)"
+                    >
+                        @for (
+                            serviceTag of filteredServiceTags | async;
+                            track serviceTag
+                        ) {
+                            <mat-option [value]="serviceTag">
+                                {{ serviceTag }}
+                            </mat-option>
+                        }
+                    </mat-autocomplete>
+                </mat-form-field>
+            </sp-form-field>
         </div>
     }
 </div>
diff --git 
a/ui/src/app/connect/components/adapter-configuration/adapter-settings/adapter-deployment-settings/adapter-deployment-settings.component.ts
 
b/ui/src/app/connect/components/adapter-configuration/adapter-settings/adapter-deployment-settings/adapter-deployment-settings.component.ts
index 9454d82db5..852e20378c 100644
--- 
a/ui/src/app/connect/components/adapter-configuration/adapter-settings/adapter-deployment-settings/adapter-deployment-settings.component.ts
+++ 
b/ui/src/app/connect/components/adapter-configuration/adapter-settings/adapter-deployment-settings/adapter-deployment-settings.component.ts
@@ -19,10 +19,10 @@
 import {
     Component,
     ElementRef,
+    inject,
     Input,
     OnInit,
     ViewChild,
-    inject,
 } from '@angular/core';
 import {
     ExtensionDeploymentConfiguration,
@@ -45,10 +45,12 @@ import {
     MatRadioGroup,
 } from '@angular/material/radio';
 import { FlexDirective, LayoutDirective } from '@ngbracket/ngx-layout/flex';
+import { MatFormField } from '@angular/material/form-field';
 import { MatIcon } from '@angular/material/icon';
 import { MatOption } from '@angular/material/select';
 import { AsyncPipe } from '@angular/common';
 import { TranslatePipe } from '@ngx-translate/core';
+import { FormFieldComponent } from '@streampipes/shared-ui';
 
 @Component({
     selector: 'sp-adapter-deployment-settings',
@@ -59,6 +61,7 @@ import { TranslatePipe } from '@ngx-translate/core';
         MatRadioGroup,
         FormsModule,
         MatRadioButton,
+        MatFormField,
         MatChipsModule,
         MatIcon,
         MatAutocompleteTrigger,
@@ -67,6 +70,7 @@ import { TranslatePipe } from '@ngx-translate/core';
         MatOption,
         AsyncPipe,
         TranslatePipe,
+        FormFieldComponent,
     ],
 })
 export class SpAdapterDeploymentSettingsComponent implements OnInit {

Reply via email to