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 { Provider } from 'react-redux';
import { Router } from 'react-router-dom'; import { Router } from 'react-router-dom';
import { PluginType } from '@grafana/data'; import { PluginType, escapeStringForRegex } from '@grafana/data';
import { locationService } from '@grafana/runtime'; import { locationService } from '@grafana/runtime';
import { getRouteComponentProps } from 'app/core/navigation/__mocks__/routeProps'; import { getRouteComponentProps } from 'app/core/navigation/__mocks__/routeProps';
import { configureStore } from 'app/store/configureStore'; import { configureStore } from 'app/store/configureStore';
@ -197,6 +197,18 @@ describe('Browse list of plugins', () => {
expect(queryByText('Plugin 2')).not.toBeInTheDocument(); expect(queryByText('Plugin 2')).not.toBeInTheDocument();
expect(queryByText('Plugin 3')).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', () => { describe('when sorting', () => {

View File

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

View File

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