ESLint: Remove ts-ignore (#10961)

* Fix prop types of styled

* Fix props in windowed
This commit is contained in:
Kamil Gabryjelski 2020-09-18 22:33:32 +02:00 committed by GitHub
parent 4a4fdb1e02
commit 91fd06e093
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 20 additions and 10 deletions

View File

@ -16,7 +16,7 @@
* specific language governing permissions and limitations
* under the License.
*/
import React, { SyntheticEvent, MutableRefObject } from 'react';
import React, { SyntheticEvent, MutableRefObject, ComponentType } from 'react';
import { merge } from 'lodash';
import BasicSelect, {
OptionTypeBase,
@ -39,6 +39,7 @@ import {
SortableContainerProps,
} from 'react-sortable-hoc';
import arrayMove from 'array-move';
import { Props as SelectProps } from 'react-select/src/Select';
import {
WindowedSelectComponentType,
WindowedSelectProps,
@ -93,9 +94,11 @@ export type SupersetStyledSelectProps<
function styled<
OptionType extends OptionTypeBase,
SelectComponentType extends WindowedSelectComponentType<
SelectComponentType extends
| WindowedSelectComponentType<OptionType>
| ComponentType<SelectProps<OptionType>> = WindowedSelectComponentType<
OptionType
> = WindowedSelectComponentType<OptionType>
>
>(SelectComponent: SelectComponentType) {
type SelectProps = SupersetStyledSelectProps<OptionType>;
type Components = SelectComponents<OptionType>;
@ -287,7 +290,5 @@ export const Select = styled(WindowedSelect);
export const AsyncSelect = styled(WindowedAsyncSelect);
export const CreatableSelect = styled(WindowedCreatableSelect);
export const AsyncCreatableSelect = styled(WindowedAsyncCreatableSelect);
// Wrap with async pagination (infinite scroll). Cannot use windowed since options are appended dynamically which causes focus jumping
// @ts-ignore
export const PaginatedSelect = withAsyncPaginate(styled(BasicSelect));
export default Select;

View File

@ -22,6 +22,7 @@ import React, {
Component,
FunctionComponent,
RefObject,
ReactElement,
} from 'react';
import {
ListChildComponentProps,
@ -53,10 +54,15 @@ export type WindowedMenuListProps = {
* If may also be `Component<GroupProps<OptionType>>[]` but we are not supporting
* grouped options just yet.
*/
type MenuListPropsChildren<OptionType> =
| Component<OptionProps<OptionType>>[]
| ReactElement[];
export type MenuListProps<
OptionType extends OptionTypeBase
> = MenuListComponentProps<OptionType> & {
children: Component<OptionProps<OptionType>>[];
children: MenuListPropsChildren<OptionType>;
// theme is not present with built-in @types/react-select, but is actually
// available via CommonProps.
theme?: ThemeConfig;
@ -68,7 +74,7 @@ const DEFAULT_OPTION_HEIGHT = 30;
/**
* Get the index of the last selected option.
*/
function getLastSelected(children: Component<any>[]) {
function getLastSelected(children: MenuListPropsChildren<any>) {
return Array.isArray(children)
? children.findIndex(
({ props: { isFocused = false } = {} }) => isFocused,

View File

@ -16,7 +16,7 @@
* specific language governing permissions and limitations
* under the License.
*/
import React, { ComponentType, FunctionComponent } from 'react';
import React, { ComponentType, FunctionComponent, ReactElement } from 'react';
import Select, {
Props as SelectProps,
OptionTypeBase,
@ -47,8 +47,11 @@ export function MenuList<OptionType extends OptionTypeBase>({
}) {
const { windowThreshold = DEFAULT_WINDOW_THRESHOLD } = props.selectProps;
if (Array.isArray(children) && children.length > windowThreshold) {
// @ts-ignore
return <WindowedMenuList {...props}>{children}</WindowedMenuList>;
return (
<WindowedMenuList {...props}>
{children as ReactElement[]}
</WindowedMenuList>
);
}
return <DefaultMenuList {...props}>{children}</DefaultMenuList>;
}