refactor: adding string array filter and minor table fix (#1479)

Author: anandtiwary

projects/components/src/filtering/filter/builder/filter-builder-lookup.service.ts

@@ -5,6 +5,7 @@ import { FilterAttributeType } from '../filter-attribute-type';
 import { AbstractFilterBuilder } from './types/abstract-filter-builder';
 import { BooleanFilterBuilder } from './types/boolean-filter-builder';
 import { NumberFilterBuilder } from './types/number-filter-builder';
+import { StringArrayFilterBuilder } from './types/string-array-filter-builder';
 import { StringFilterBuilder } from './types/string-filter-builder';
 import { StringMapFilterBuilder } from './types/string-map-filter-builder';
 
@@ -22,7 +23,8 @@ export class FilterBuilderLookupService {
         return new StringFilterBuilder();
       case FilterAttributeType.StringMap:
         return new StringMapFilterBuilder();
-      case FilterAttributeType.StringArray: // Unsupported
+      case FilterAttributeType.StringArray:
+        return new StringArrayFilterBuilder();
       case FilterAttributeType.Timestamp: // Unsupported
         throw new Error(`Filter builder not found for attribute of type '${type}'.`);
       default:

projects/components/src/filtering/filter/builder/types/string-array-filter-builder.ts

@@ -0,0 +1,21 @@
+import { FilterAttributeType } from '../../filter-attribute-type';
+import { FilterOperator } from '../../filter-operators';
+import { AbstractFilterBuilder } from './abstract-filter-builder';
+
+export class StringArrayFilterBuilder extends AbstractFilterBuilder<string> {
+  public supportedAttributeType(): FilterAttributeType {
+    return FilterAttributeType.StringArray;
+  }
+
+  public supportedTopLevelOperators(): FilterOperator[] {
+    return [FilterOperator.In];
+  }
+
+  public supportedSubpathOperators(): FilterOperator[] {
+    return [];
+  }
+
+  protected buildValueString(value: string | string[]): string {
+    return String(value);
+  }
+}

projects/components/src/table/header/table-header-cell-renderer.component.scss

@@ -6,7 +6,7 @@
   align-items: center;
   width: 100%;
   height: 32px;
-
+  padding: 0 6px;
   &.sortable {
     cursor: pointer;
   }
@@ -57,7 +57,7 @@
   }
 
   .state-checkbox {
-    margin-left: 12px;
+    margin-left: 6px;
   }
 }