Clean events

src/components/drawers/exports/exportActions.tsx

@@ -43,7 +43,7 @@ class ExportsActionsBase extends React.Component<ExportsActionsProps, ExportsAct
     });
   };
 
-  public handleOnToggle = (event: React.MouseEvent<HTMLButtonElement>, isDropdownOpen: boolean) => {
+  public handleOnToggle = (isDropdownOpen: boolean) => {
     this.setState({ isDropdownOpen });
   };
 
@@ -61,7 +61,7 @@ class ExportsActionsBase extends React.Component<ExportsActionsProps, ExportsAct
       <>
         <Dropdown
           onSelect={this.handleOnSelect}
-          toggle={<KebabToggle onToggle={this.handleOnToggle} />}
+          toggle={<KebabToggle onToggle={(_evt, isOpen) => this.handleOnToggle(isOpen)} />}
           isOpen={isDropdownOpen}
           isPlain
           position="right"

src/routes/components/dataTable/dataTable.tsx

@@ -91,7 +91,7 @@ class DataTable extends React.Component<DataTableProps, any> {
     };
   };
 
-  private handleOnSelect = (event, isSelected, rowId) => {
+  private handleOnSelect = (isSelected, rowId) => {
     const { onSelected, rows } = this.props;
 
     let newRows;
@@ -113,7 +113,7 @@ class DataTable extends React.Component<DataTableProps, any> {
     });
   };
 
-  private handleOnSort = (event, index, direction) => {
+  private handleOnSort = (index, direction) => {
     const { columns, onSort } = this.props;
 
     if (onSort) {
@@ -171,7 +171,7 @@ class DataTable extends React.Component<DataTableProps, any> {
                         select={{
                           isDisabled: row.selectionDisabled, // Disable select for "no-project"
                           isSelected: row.selected,
-                          onSelect: (_event, isSelected) => this.handleOnSelect(_event, isSelected, rowIndex),
+                          onSelect: (_evt, isSelected) => this.handleOnSelect(isSelected, rowIndex),
                           rowIndex,
                         }}
                         style={item.style}

src/routes/components/dataTable/selectableTable.tsx

@@ -34,7 +34,7 @@ interface SelectableTableOwnProps {
   filterBy: any;
   isLoading?: boolean;
   onSort(value: string, isSortAscending: boolean);
-  onRowClick(event: React.KeyboardEvent | React.MouseEvent, rowIndex: number);
+  onRowClick(rowIndex: number);
   orderBy: any;
   rows?: any[];
 }
@@ -90,7 +90,7 @@ class SelectableTable extends React.Component<SelectableTableProps, any> {
     };
   };
 
-  private handleOnSort = (event, index, direction) => {
+  private handleOnSort = (index, direction) => {
     const { columns, onSort } = this.props;
 
     if (onSort) {
@@ -100,15 +100,15 @@ class SelectableTable extends React.Component<SelectableTableProps, any> {
     }
   };
 
-  private handleOnRowClick = (event, rowIndex) => {
+  private handleOnRowClick = (rowIndex: number) => {
     const { onRowClick, rows } = this.props;
 
     rows.map(row => (row.selected = false));
     rows[rowIndex].selected = true;
 
     this.setState({ rows }, () => {
       if (onRowClick) {
-        onRowClick(event, rowIndex);
+        onRowClick(rowIndex);
       }
     });
   };
@@ -155,7 +155,7 @@ class SelectableTable extends React.Component<SelectableTableProps, any> {
                   isSelectable
                   isClickable
                   isRowSelected={row.selected}
-                  onRowClick={_event => this.handleOnRowClick(_event, rowIndex)}
+                  onRowClick={_evt => this.handleOnRowClick(rowIndex)}
                   key={`row-${rowIndex}`}
                 >
                   {row.cells.map((item, cellIndex) =>

src/routes/components/dataToolbar/basicToolbar.tsx

@@ -178,7 +178,7 @@ export class BasicToolbarBase extends React.Component<BasicToolbarProps, BasicTo
     });
   }
 
-  private handleOnCategorySelect = (event, selection: CategoryOption) => {
+  private handleOnCategorySelect = (selection: CategoryOption) => {
     this.setState({
       categoryInput: '',
       currentCategory: selection.value,
@@ -213,7 +213,7 @@ export class BasicToolbarBase extends React.Component<BasicToolbarProps, BasicTo
     });
   };
 
-  private handleOnCategoryInputChange = (event: React.FormEvent<HTMLInputElement>, value: string) => {
+  private handleOnCategoryInputChange = (value: string) => {
     const val = cleanInput(value);
     this.setState({ categoryInput: val });
   };

src/routes/components/dataToolbar/costCategoryValue.tsx

@@ -99,7 +99,7 @@ class CostCategoryValueBase extends React.Component<CostCategoryValueProps, Cost
     return options;
   }
 
-  private onCostCategoryValueChange = (event: React.FormEvent<HTMLInputElement>, value: string) => {
+  private onCostCategoryValueChange = (value: string) => {
     const { onCostCategoryValueInputChange } = this.props;
 
     this.setState({ costCategoryKeyValueInput: value }, () => {
@@ -154,7 +154,7 @@ class CostCategoryValueBase extends React.Component<CostCategoryValueProps, Cost
             id="tag-key-value-input"
             type="search"
             aria-label={intl.formatMessage(messages.filterByCostCategoryValueAriaLabel)}
-            onChange={this.onCostCategoryValueChange}
+            onChange={(_evt, value) => this.onCostCategoryValueChange(value)}
             value={costCategoryKeyValue}
             placeholder={intl.formatMessage(messages.filterByValuePlaceholder)}
             onKeyDown={evt => onCostCategoryValueInput(evt)}

src/routes/components/dataToolbar/dataToolbar.tsx

@@ -235,7 +235,7 @@ export class DataToolbarBase extends React.Component<DataToolbarProps, DataToolb
     });
   }
 
-  private handleOnCategorySelect = (event, selection: CategoryOption) => {
+  private handleOnCategorySelect = (selection: CategoryOption) => {
     this.setState({
       categoryInput: '',
       currentCategory: selection.value,
@@ -272,7 +272,7 @@ export class DataToolbarBase extends React.Component<DataToolbarProps, DataToolb
     });
   };
 
-  private handleOnCategoryInputChange = (event: React.FormEvent<HTMLInputElement>, value: string) => {
+  private handleOnCategoryInputChange = (value: string) => {
     const val = cleanInput(value);
     this.setState({ categoryInput: val });
   };
@@ -382,7 +382,7 @@ export class DataToolbarBase extends React.Component<DataToolbarProps, DataToolb
     });
   };
 
-  private handleOnCostCategoryKeySelect = (event, selection) => {
+  private handleOnCostCategoryKeySelect = selection => {
     this.setState({
       currentCostCategoryKey: selection,
       isCostCategoryKeySelectExpanded: !this.state.isCostCategoryKeySelectExpanded,
@@ -491,7 +491,7 @@ export class DataToolbarBase extends React.Component<DataToolbarProps, DataToolb
     });
   }
 
-  private handleOnExcludeSelect = (event, selection: ExcludeOption) => {
+  private handleOnExcludeSelect = (selection: ExcludeOption) => {
     this.setState({
       currentExclude: selection.value,
       isExcludeSelectOpen: !this.state.isExcludeSelectOpen,
@@ -582,7 +582,7 @@ export class DataToolbarBase extends React.Component<DataToolbarProps, DataToolb
     });
   };
 
-  private handleOnTagKeySelect = (event, selection) => {
+  private handleOnTagKeySelect = selection => {
     this.setState({
       currentTagKey: selection,
       isTagKeySelectExpanded: !this.state.isTagKeySelectExpanded,
@@ -725,7 +725,7 @@ export class DataToolbarBase extends React.Component<DataToolbarProps, DataToolb
     });
   };
 
-  private handlePlatformCostsChanged = (event: React.FormEvent<HTMLInputElement>, checked: boolean) => {
+  private handlePlatformCostsChanged = (checked: boolean) => {
     const { onPlatformCostsChanged } = this.props;
     const { isPlatformCostsChecked } = this.state;
     this.setState({ isPlatformCostsChecked: !isPlatformCostsChecked }, () => {

src/routes/components/dataToolbar/tagValue.tsx

@@ -99,7 +99,7 @@ class TagValueBase extends React.Component<TagValueProps, TagValueState> {
     return options;
   }
 
-  private onTagValueChange = (event: React.FormEvent<HTMLInputElement>, value: string) => {
+  private onTagValueChange = (value: string) => {
     const { onTagValueInputChange } = this.props;
 
     this.setState({ tagKeyValueInput: value }, () => {
@@ -153,7 +153,7 @@ class TagValueBase extends React.Component<TagValueProps, TagValueState> {
             id="tag-key-value-input"
             type="search"
             aria-label={intl.formatMessage(messages.filterByTagValueAriaLabel)}
-            onChange={this.onTagValueChange}
+            onChange={(_evt, value) => this.onTagValueChange(value)}
             value={tagKeyValue}
             placeholder={intl.formatMessage(messages.filterByValuePlaceholder)}
             onKeyDown={evt => onTagValueInput(evt)}

src/routes/components/dataToolbar/utils/actions.tsx

@@ -59,7 +59,7 @@ export const getPlatformCosts = ({
   isDisabled,
   isPlatformCostsChecked,
 }: {
-  handlePlatformCostsChanged?: (event: React.FormEvent<HTMLInputElement>, checked: boolean) => void;
+  handlePlatformCostsChanged?: (checked: boolean) => void;
   isDisabled?: boolean;
   isPlatformCostsChecked?: boolean;
 }) => {
@@ -70,7 +70,7 @@ export const getPlatformCosts = ({
         label={intl.formatMessage(messages.sumPlatformCosts)}
         isChecked={isPlatformCostsChecked}
         isDisabled={isDisabled}
-        onChange={handlePlatformCostsChanged}
+        onChange={(_evt, checked) => handlePlatformCostsChanged(checked)}
       />
     </ToolbarItem>
   );
@@ -86,7 +86,7 @@ export const getKebab = ({
   showPlatformCosts,
 }: {
   handleColumnManagementClicked?: () => void;
-  handlePlatformCostsChanged?: (event: React.FormEvent<HTMLInputElement>, checked: boolean) => void;
+  handlePlatformCostsChanged?: (checked: boolean) => void;
   isPlatformCostsChecked?: boolean;
   showColumnManagement?: boolean;
   showPlatformCosts?: boolean;
@@ -101,7 +101,7 @@ export const getKebab = ({
   if (showPlatformCosts) {
     options.push({
       label: messages.sumPlatformCosts,
-      onClick: (event: React.FormEvent<HTMLInputElement>) => handlePlatformCostsChanged(event, !isPlatformCostsChecked),
+      onClick: (_evt, _checked) => handlePlatformCostsChanged(!isPlatformCostsChecked),
     });
   }
   return (

src/routes/components/dataToolbar/utils/bulkSelect.tsx

@@ -25,7 +25,7 @@ export const getBulkSelect = ({
 }: {
   handleOnBulkSelect?: () => void;
   handleOnBulkSelectClicked?: (action: string) => void;
-  handleOnBulkSelectToggle?: (event: React.MouseEvent<HTMLButtonElement>, isOpen: boolean) => void;
+  handleOnBulkSelectToggle?: (isOpen: boolean) => void;
   isAllSelected?: boolean;
   isBulkSelectDisabled?: boolean;
   isBulkSelectOpen?: boolean;
@@ -72,7 +72,7 @@ export const getBulkSelect = ({
               }}
             />,
           ]}
-          onToggle={handleOnBulkSelectToggle}
+          onToggle={(_evt, isOpen) => handleOnBulkSelectToggle(isOpen)}
         >
           {numSelected !== 0 && (
             <React.Fragment>{intl.formatMessage(messages.selected, { value: numSelected })}</React.Fragment>

src/routes/components/dataToolbar/utils/category.tsx

@@ -52,7 +52,7 @@ export const getCategoryInput = ({
   currentCategory?: string;
   filters?: Filters;
   handleOnCategoryInput?: (event, key: string) => void;
-  handleOnCategoryInputChange?: (event: React.FormEvent<HTMLInputElement>, value: string) => void;
+  handleOnCategoryInputChange?: (value: string) => void;
   handleOnCategoryInputSelect?: (value: string, key: string) => void;
   handleOnDelete?: (type: any, chip: any) => void;
   handleOnWorkloadTypeSelect?: (event, selection: string) => void;
@@ -96,7 +96,7 @@ export const getCategoryInput = ({
                 id={`category-input-${categoryOption.key}`}
                 type="search"
                 aria-label={intl.formatMessage(messages.filterByInputAriaLabel, { value: categoryOption.key })}
-                onChange={handleOnCategoryInputChange}
+                onChange={(_evt, value) => handleOnCategoryInputChange(value)}
                 value={categoryInput}
                 placeholder={intl.formatMessage(messages.filterByPlaceholder, { value: categoryOption.key })}
                 onKeyDown={evt => handleOnCategoryInput(evt, categoryOption.key)}
@@ -239,8 +239,8 @@ export const getCategorySelect = ({
   currentCategory?: string;
   isDisabled?: boolean;
   filters?: Filters;
-  handleOnCategorySelect?: (event: React.MouseEvent, selection: CategoryOption) => void;
-  handleOnCategoryToggle?: (event: React.MouseEvent, isOpen: boolean) => void;
+  handleOnCategorySelect?: (selection: CategoryOption) => void;
+  handleOnCategoryToggle?: (isOpen: boolean) => void;
   isCategorySelectOpen?: boolean;
 }) => {
   if (!categoryOptions) {
@@ -256,8 +256,8 @@ export const getCategorySelect = ({
         id="category-select"
         isDisabled={isDisabled && !hasFilters(filters)}
         isOpen={isCategorySelectOpen}
-        onSelect={handleOnCategorySelect}
-        onToggle={handleOnCategoryToggle}
+        onSelect={(_evt, value) => handleOnCategorySelect(value)}
+        onToggle={(_evt, isExpanded) => handleOnCategoryToggle(isExpanded)}
         selections={selection}
         toggleIcon={<FilterIcon />}
         variant={SelectVariant.single}

src/routes/components/dataToolbar/utils/costCategory.tsx

@@ -1,5 +1,6 @@
 import type { ToolbarChipGroup } from '@patternfly/react-core';
 import { ToolbarFilter, ToolbarItem } from '@patternfly/react-core';
+import type { SelectOptionObject } from '@patternfly/react-core/deprecated';
 import { Select, SelectOption, SelectVariant } from '@patternfly/react-core/deprecated';
 import type { Resource } from 'api/resources/resource';
 import type { ResourcePathsType } from 'api/resources/resource';
@@ -31,8 +32,8 @@ export const getCostCategoryKeySelect = ({
   currentCostCategoryKey?: string;
   filters?: Filters;
   handleOnCostCategoryKeyClear?: () => void;
-  handleOnCostCategoryKeySelect?: (event: React.MouseEvent, selection) => void;
-  handleOnCostCategoryKeyToggle?: (event: React.MouseEvent, isOpen: boolean) => void;
+  handleOnCostCategoryKeySelect?: (selection: SelectOptionObject) => void;
+  handleOnCostCategoryKeyToggle?: (isOpen: boolean) => void;
   isCostCategoryKeySelectExpanded?: boolean;
   isDisabled?: boolean;
   resourceReport?: Resource;
@@ -52,8 +53,8 @@ export const getCostCategoryKeySelect = ({
         variant={SelectVariant.typeahead}
         typeAheadAriaLabel={intl.formatMessage(messages.filterByCostCategoryKeyAriaLabel)}
         onClear={handleOnCostCategoryKeyClear}
-        onToggle={handleOnCostCategoryKeyToggle}
-        onSelect={handleOnCostCategoryKeySelect}
+        onToggle={(_evt, isExpanded) => handleOnCostCategoryKeyToggle(isExpanded)}
+        onSelect={(_evt, value) => handleOnCostCategoryKeySelect(value)}
         isOpen={isCostCategoryKeySelectExpanded}
         placeholderText={intl.formatMessage(messages.chooseKeyPlaceholder)}
         selections={currentCostCategoryKey}

src/routes/components/dataToolbar/utils/exclude.tsx

@@ -31,8 +31,8 @@ export const getExcludeSelect = ({
 }: {
   currentExclude?: string;
   filters?: Filters;
-  handleOnExcludeSelect: (event: React.MouseEvent, selection: ExcludeOption) => void;
-  handleOnExcludeToggle: (event: React.MouseEvent, isOpen: boolean) => void;
+  handleOnExcludeSelect: (selection: ExcludeOption) => void;
+  handleOnExcludeToggle: (isOpen: boolean) => void;
   isDisabled?: boolean;
   isExcludeSelectOpen?: boolean;
 }) => {
@@ -45,8 +45,8 @@ export const getExcludeSelect = ({
         id="exclude-select"
         isDisabled={isDisabled && !hasFilters(filters)}
         isOpen={isExcludeSelectOpen}
-        onSelect={handleOnExcludeSelect}
-        onToggle={handleOnExcludeToggle}
+        onSelect={(_evt, value) => handleOnExcludeSelect(value)}
+        onToggle={(_evt, isExpanded) => handleOnExcludeToggle(isExpanded)}
         selections={selection}
         variant={SelectVariant.single}
       >

src/routes/components/dataToolbar/utils/orgUntits.tsx

@@ -33,7 +33,7 @@ export const getOrgUnitSelect = ({
   filters?: Filters;
   handleOnDelete?: (type: any, chip: any) => void;
   handleOnOrgUnitSelect?: (event: React.MouseEvent, selection: string) => void;
-  handleOnOrgUnitToggle?: (event: React.MouseEvent, isOpen: boolean) => void;
+  handleOnOrgUnitToggle?: (isOpen: boolean) => void;
   isDisabled?: boolean;
   isOrgUnitSelectExpanded?: boolean;
   orgReport: Org;
@@ -80,7 +80,7 @@ export const getOrgUnitSelect = ({
         className="selectOverride"
         variant={SelectVariant.checkbox}
         aria-label={intl.formatMessage(messages.filterByOrgUnitAriaLabel)}
-        onToggle={handleOnOrgUnitToggle}
+        onToggle={(_evt, isExpanded) => handleOnOrgUnitToggle(isExpanded)}
         onSelect={handleOnOrgUnitSelect}
         selections={selections}
         isOpen={isOrgUnitSelectExpanded}

src/routes/components/dataToolbar/utils/tags.tsx

@@ -1,5 +1,6 @@
 import type { ToolbarChipGroup } from '@patternfly/react-core';
 import { ToolbarFilter, ToolbarItem } from '@patternfly/react-core';
+import type { SelectOptionObject } from '@patternfly/react-core/deprecated';
 import { Select, SelectOption, SelectVariant } from '@patternfly/react-core/deprecated';
 import type { Tag } from 'api/tags/tag';
 import type { TagPathsType } from 'api/tags/tag';
@@ -29,8 +30,8 @@ export const getTagKeySelect = ({
   currentTagKey?: string;
   filters?: Filters;
   handleOnTagKeyClear?: () => void;
-  handleOnTagKeySelect?: (event: React.MouseEvent, selection) => void;
-  handleOnTagKeyToggle?: (event: React.MouseEvent, isOpen: boolean) => void;
+  handleOnTagKeySelect?: (value: SelectOptionObject) => void;
+  handleOnTagKeyToggle?: (isOpen: boolean) => void;
   isDisabled?: boolean;
   isTagKeySelectExpanded?: boolean;
   tagReport?: Tag;
@@ -50,8 +51,8 @@ export const getTagKeySelect = ({
         variant={SelectVariant.typeahead}
         typeAheadAriaLabel={intl.formatMessage(messages.filterByTagKeyAriaLabel)}
         onClear={handleOnTagKeyClear}
-        onToggle={handleOnTagKeyToggle}
-        onSelect={handleOnTagKeySelect}
+        onToggle={(_evt, isExpanded) => handleOnTagKeyToggle(isExpanded)}
+        onSelect={(_evt, value) => handleOnTagKeySelect(value)}
         isOpen={isTagKeySelectExpanded}
         placeholderText={intl.formatMessage(messages.chooseKeyPlaceholder)}
         selections={currentTagKey}

src/routes/components/optimizations/optimizationsTable.tsx

@@ -151,7 +151,7 @@ class OptimizationsTableBase extends React.Component<OptimizationsTableProps, Op
     });
   };
 
-  private handleOnRowClick = (event: React.KeyboardEvent | React.MouseEvent, rowIndex: number) => {
+  private handleOnRowClick = (rowIndex: number) => {
     const { closeOptimizationsDrawer, isOpen, openOptimizationsDrawer } = this.props;
     const { currentRow, rows } = this.state;