NIFI-13961 Allow camelCase search when filtering on component selecti…

…on in UI (#9481)

This closes #9481

nifi-frontend/src/main/frontend/apps/nifi/src/app/ui/common/extension-creation/extension-creation.component.ts

@@ -22,13 +22,15 @@ import { MatTableDataSource, MatTableModule } from '@angular/material/table';
 import { MatSortModule, Sort } from '@angular/material/sort';
 
 import { ControllerServiceApiTipInput, DocumentedType, RestrictionsTipInput } from '../../../state/shared';
-import { NifiTooltipDirective, NiFiCommon, CloseOnEscapeDialog } from '@nifi/shared';
+import { CloseOnEscapeDialog, NiFiCommon, NifiTooltipDirective } from '@nifi/shared';
 import { RestrictionsTip } from '../tooltips/restrictions-tip/restrictions-tip.component';
 import { ControllerServiceApiTip } from '../tooltips/controller-service-api-tip/controller-service-api-tip.component';
 import { NifiSpinnerDirective } from '../spinner/nifi-spinner.directive';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatInputModule } from '@angular/material/input';
 import { ReactiveFormsModule } from '@angular/forms';
+import { anyOf, onLowerCaseFilter } from './filter-predicate/extensions';
+import { matchesCamelCaseSearch } from './filter-predicate/camel-case.search';
 
 @Component({
     selector: 'extension-creation',
@@ -78,6 +80,12 @@ export class ExtensionCreation extends CloseOnEscapeDialog {
 
     constructor(private nifiCommon: NiFiCommon) {
         super();
+
+        const defaultPredicate = this.dataSource.filterPredicate;
+        this.dataSource.filterPredicate = anyOf(
+            (data: DocumentedType, filter: string) => matchesCamelCaseSearch(data.type, filter),
+            onLowerCaseFilter(defaultPredicate)
+        );
     }
 
     formatType(documentedType: DocumentedType): string {
@@ -146,7 +154,7 @@ export class ExtensionCreation extends CloseOnEscapeDialog {
         }
 
         const filterText: string = (event.target as HTMLInputElement).value;
-        this.dataSource.filter = filterText.trim().toLowerCase();
+        this.dataSource.filter = filterText.trim();
 
         if (this.dataSource.filteredData.length > 0) {
             this.selectType(this.dataSource.filteredData[0]);

nifi-frontend/src/main/frontend/apps/nifi/src/app/ui/common/extension-creation/filter-predicate/camel-case.search.spec.ts

@@ -0,0 +1,34 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { matchesCamelCaseSearch } from './camel-case.search';
+
+describe('matchesCamelCaseSearch', () => {
+    const value = 'org.apache.nifi.processors.standard.GenerateFlowFile';
+
+    it.each([
+        { value, query: '', expectedResult: false },
+        { value, query: value, expectedResult: true },
+        { value, query: 'Generate', expectedResult: true },
+        { value, query: 'GFlowFile', expectedResult: true },
+        { value, query: 'GeFlF', expectedResult: true },
+        { value, query: 'GFF', expectedResult: true },
+        { value, query: 'RFlowFile', expectedResult: false }
+    ])('should return $expectedResult for matching $query against $value', ({ value, query, expectedResult }) => {
+        expect(matchesCamelCaseSearch(value, query)).toBe(expectedResult);
+    });
+});

nifi-frontend/src/main/frontend/apps/nifi/src/app/ui/common/extension-creation/filter-predicate/camel-case.search.ts

@@ -0,0 +1,26 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export function matchesCamelCaseSearch(value: string, filter: string): boolean {
+    const camelCaseMatches = filter.match(/[^A-Z]+|[A-Z][^A-Z]*/g);
+    if (camelCaseMatches == null) {
+        return false;
+    }
+
+    const joinedParts = camelCaseMatches.join('.*');
+    return new RegExp(joinedParts).test(value);
+}

nifi-frontend/src/main/frontend/apps/nifi/src/app/ui/common/extension-creation/filter-predicate/extensions.spec.ts

@@ -0,0 +1,75 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { FilterPredicate } from './filter-predicate';
+import { anyOf, onLowerCaseFilter } from './extensions';
+
+describe('FilterPredicate extensions', () => {
+    describe('onLowerCaseFilter', () => {
+        let memoizedFilter: string | null = null;
+
+        const mnemonicTautology: FilterPredicate<any> = (_, filter) => {
+            memoizedFilter = filter;
+            return true;
+        };
+
+        it('should create function that is passed lowercase filter values as is', () => {
+            const lowerCaseInput = 'hello';
+
+            const predicate = onLowerCaseFilter(mnemonicTautology);
+            predicate('example', lowerCaseInput);
+
+            expect(memoizedFilter).toEqual(lowerCaseInput);
+        });
+
+        it('should create function that is passed non-lowercase filter values as lowercase values', () => {
+            const nonLowerCaseInput = 'HelLO WoRlD';
+            const expectedPassedValue = 'hello world';
+
+            const predicate = onLowerCaseFilter(mnemonicTautology);
+            predicate('example', nonLowerCaseInput);
+
+            expect(memoizedFilter).toEqual(expectedPassedValue);
+        });
+    });
+
+    describe('anyOf', () => {
+        const tautology: FilterPredicate<any> = () => true;
+        const contradiction: FilterPredicate<any> = () => false;
+
+        it('should create a function that yields true, when any of the functions passed to it yield true', () => {
+            const predicate = anyOf(contradiction, contradiction, tautology, contradiction);
+            const result = predicate('data', 'filter');
+
+            expect(result).toEqual(true);
+        });
+
+        it('should create a function that yields false, when all of the functions passed to it yield false', () => {
+            const predicate = anyOf(contradiction, contradiction, contradiction, contradiction, contradiction);
+            const result = predicate('data', 'filter');
+
+            expect(result).toEqual(false);
+        });
+
+        it('should create a function that yields false, when no function is passed to it', () => {
+            const predicate = anyOf();
+            const result = predicate('data', 'filter');
+
+            expect(result).toEqual(false);
+        });
+    });
+});

nifi-frontend/src/main/frontend/apps/nifi/src/app/ui/common/extension-creation/filter-predicate/extensions.ts

@@ -0,0 +1,26 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { FilterPredicate } from './filter-predicate';
+
+export function anyOf<T>(...predicates: FilterPredicate<T>[]): FilterPredicate<T> {
+    return (data: T, filter: string) => predicates.some((predicate) => predicate(data, filter));
+}
+
+export function onLowerCaseFilter<T>(predicate: FilterPredicate<T>): FilterPredicate<T> {
+    return (data: T, filter: string) => predicate(data, filter.toLowerCase());
+}

nifi-frontend/src/main/frontend/apps/nifi/src/app/ui/common/extension-creation/filter-predicate/filter-predicate.ts

@@ -0,0 +1,18 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one or more
+ * contributor license agreements.  See the NOTICE file distributed with
+ * this work for additional information regarding copyright ownership.
+ * The ASF licenses this file to You under the Apache License, Version 2.0
+ * (the "License"); you may not use this file except in compliance with
+ * the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export type FilterPredicate<T> = (data: T, filter: string) => boolean;