Plugins Catalog: Allow to filter plugins using special characters (#54474)

This commit is contained in:
Murtaza Ahmedi 2022-09-01 19:55:25 +05:30 committed by GitHub
parent f7302149d0
commit f6827a0518
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 16 additions and 4 deletions

View File

@ -4,7 +4,7 @@ import React from 'react';
import { Provider } from 'react-redux';
import { Router } from 'react-router-dom';
import { PluginType } from '@grafana/data';
import { PluginType, escapeStringForRegex } from '@grafana/data';
import { locationService } from '@grafana/runtime';
import { getRouteComponentProps } from 'app/core/navigation/__mocks__/routeProps';
import { configureStore } from 'app/store/configureStore';
@ -197,6 +197,18 @@ describe('Browse list of plugins', () => {
expect(queryByText('Plugin 2')).not.toBeInTheDocument();
expect(queryByText('Plugin 3')).not.toBeInTheDocument();
});
it('should handle escaped regex characters in the search query (e.g. "(" )', async () => {
const { queryByText } = renderBrowse('/plugins?filterBy=all&q=' + escapeStringForRegex('graph (old)'), [
getCatalogPluginMock({ id: 'graph', name: 'Graph (old)' }),
getCatalogPluginMock({ id: 'plugin-2', name: 'Plugin 2' }),
getCatalogPluginMock({ id: 'plugin-3', name: 'Plugin 3' }),
]);
await waitFor(() => expect(queryByText('Graph (old)')).toBeInTheDocument());
// Other plugin types shouldn't be shown
expect(queryByText('Plugin 2')).not.toBeInTheDocument();
expect(queryByText('Plugin 3')).not.toBeInTheDocument();
});
});
describe('when sorting', () => {

View File

@ -20,7 +20,7 @@ import {
} from './selectors';
type Filters = {
query?: string;
query?: string; // Note: this will be an escaped regex string as it comes from `FilterInput`
filterBy?: string;
filterByType?: string;
sortBy?: Sorters;

View File

@ -1,6 +1,6 @@
import { createSelector } from '@reduxjs/toolkit';
import { PluginError, PluginErrorCode } from '@grafana/data';
import { PluginError, PluginErrorCode, unEscapeStringFromRegex } from '@grafana/data';
import { RequestStatus, PluginCatalogStoreState } from '../types';
@ -40,7 +40,7 @@ const findByKeyword = (searchBy: string) =>
fields.push(plugin.orgName.toLowerCase());
}
return fields.some((f) => f.includes(searchBy.toLowerCase()));
return fields.some((f) => f.includes(unEscapeStringFromRegex(searchBy).toLowerCase()));
});
});