chore: remove redundant string type (#10351)

Author: Dominik-Petrik

packages/react-core/src/components/NotificationDrawer/NotificationDrawerGroup.tsx

@@ -22,7 +22,7 @@ export interface NotificationDrawerGroupProps extends Omit<React.HTMLProps<HTMLD
   /**  Callback for when group button is clicked to expand */
   onExpand?: (event: any, value: boolean) => void;
   /**  Notification drawer group title */
-  title: string | React.ReactNode;
+  title: React.ReactNode;
   /** Truncate title to number of lines */
   truncateTitle?: number;
   /** Position of the tooltip which is displayed if text is truncated */

packages/react-core/src/deprecated/components/OptionsMenu/OptionsMenuItemGroup.tsx

@@ -11,7 +11,7 @@ export interface OptionsMenuItemGroupProps extends React.HTMLProps<HTMLElement>
   /** Provides an accessible name for the options menu items group */
   'aria-label'?: string;
   /** Optional title for the options menu items group */
-  groupTitle?: string | React.ReactNode;
+  groupTitle?: React.ReactNode;
   /** Flag indicating this options menu items group will be followed by a horizontal separator */
   hasSeparator?: boolean;
 }

packages/react-core/src/deprecated/components/Select/Select.tsx

@@ -86,7 +86,7 @@ export interface SelectProps
   /** Text displayed in typeahead select to prompt the user to create an item */
   createText?: string;
   /** Title text of Select */
-  placeholderText?: string | React.ReactNode;
+  placeholderText?: React.ReactNode;
   /** Text to display in typeahead select when no results are found */
   noResultsFoundText?: string;
   /** Array of selected items for multi select variants. */

packages/react-table/src/components/Table/TableTypes.tsx

@@ -138,7 +138,7 @@ export interface IExtra extends IExtraData {
 }
 
 export type IFormatterValueType = formatterValueType & {
-  title?: string | React.ReactNode;
+  title?: React.ReactNode;
   props?: any;
 };
 
@@ -157,7 +157,7 @@ export interface IAction extends Omit<DropdownItemProps, 'title' | 'onClick'>, P
   /** Key of actions menu item */
   itemKey?: string;
   /** Content to display in the actions menu item */
-  title?: string | React.ReactNode;
+  title?: React.ReactNode;
   /** Render item as aria-disabled option */
   isAriaDisabled?: boolean;
   /** Props for adding a tooltip to a menu item. This is used to display tooltip when hovered over the item  */
@@ -191,7 +191,7 @@ export interface decoratorReturnType {
   textCenter?: boolean;
   component?: string;
   isVisible?: boolean;
-  title?: string | React.ReactNode;
+  title?: React.ReactNode;
   props?: any;
   scope?: string;
   parentId?: number;
@@ -205,7 +205,7 @@ export type IFormatter = (data?: IFormatterValueType, extra?: IExtra) => formatt
 
 export interface ICell {
   /* cell contents */
-  title?: string | React.ReactNode;
+  title?: React.ReactNode;
   /** transformations applied to the header cell */
   transforms?: ITransform[];
   /** transformations applied to the cells within the column's body */
@@ -229,7 +229,7 @@ export interface ICell {
 export type RowCellContent<T = any> = (value?: string, rowIndex?: number, cellIndex?: number, props?: T) => void;
 
 export interface IRowCell<T = any> {
-  title?: string | React.ReactNode | RowCellContent<T>;
+  title?: React.ReactNode | RowCellContent<T>;
   props?: T;
   formatters?: IFormatter[];
 }

packages/react-table/src/deprecated/components/Table/examples/Table.md

@@ -22,14 +22,13 @@ import FolderIcon from '@patternfly/react-icons/dist/esm/icons/folder-icon';
 import FolderOpenIcon from '@patternfly/react-icons/dist/esm/icons/folder-open-icon';
 import SortAmountDownIcon from '@patternfly/react-icons/dist/esm/icons/sort-amount-down-icon';
 import { SelectOption as SelectOptionDeprecated } from '@patternfly/react-core/deprecated';
-import { 
-  Select as NewSelect,
-  SelectGroup as NewSelectGroup,
-  SelectList  as NewSelectList,
-  SelectOption as NewSelectOption,
+import {
+Select as NewSelect,
+SelectGroup as NewSelectGroup,
+SelectList as NewSelectList,
+SelectOption as NewSelectOption,
 } from '@patternfly/react-core/dist/esm/components/Select';
 
-
 import { css } from '@patternfly/react-styles';
 import styles from '@patternfly/react-styles/css/components/Table/table';
 import spacing from '@patternfly/react-styles/css/utilities/Spacing/spacing';
@@ -48,7 +47,7 @@ cells: (ICell | string)[];
 ```
 interface ICell {
   /* cell contents */
-  title?: string | React.ReactNode;
+  title?: React.ReactNode;
   /** transformations applied to the header cell */
   transforms?: ITransform[];
   /** transformations applied to the cells within the column's body */
@@ -111,7 +110,7 @@ interface IRow extends RowType {
   noPadding?: boolean;
 }
 interface IRowCell {
-  title?: string | React.ReactNode | RowCellContent;
+  title?: React.ReactNode | RowCellContent;
   props?: any;
   formatters?: IFormatter[];
 }
@@ -122,6 +121,7 @@ interface IRowCell {
 ### Basic
 
 ```ts file="LegacyTableBasic.tsx"
+
 ```
 
 ### Custom row wrapper
@@ -152,6 +152,7 @@ interface RowWrapperProps {
 ```
 
 ```ts file="LegacyTableMisc.tsx"
+
 ```
 
 ### Sortable & wrapping column headers
@@ -169,13 +170,15 @@ Note: If you want to add a tooltip/popover to a sortable header, in the `transfo
 The built in display for sorting is not fully responsive, as the column headers will be displayed per row when the screen size is small. The example below showcases how sorting may have a custom control display that can be used for small screen sizes.
 
 ```ts file="LegacyTableSortable.tsx"
+
 ```
 
 ### Sortable - custom control
 
 Sorting a table may also be controlled with a toolbar. This toolbar item may also be hidden at large screen sizes and only displayed when the screen size is small to support responsive tables.
 
 ```ts file="LegacyTableSortableCustom.tsx"
+
 ```
 
 ### Selectable with checkbox
@@ -196,6 +199,7 @@ of using `td` elements, the cells in that column use `th` elements.
 checking checkboxes will check intermediate rows' checkboxes.
 
 ```ts file="LegacyTableSelectable.tsx"
+
 ```
 
 ### Selectable radio input
@@ -206,13 +210,15 @@ To enable row radio selection, set the `onSelect` callback prop on the Table, an
 To disable selection for a row, set `disableSelection: true` on the row definition.
 
 ```ts file="LegacyTableSelectableRadio.tsx"
+
 ```
 
 ### Clickable rows, selectable rows, and header cell tooltips/popovers
 
 This selectable rows feature is intended for use when a table is used to present a list of objects in a Primary-detail view.
 
 ```ts file="LegacyTableClickable.tsx"
+
 ```
 
 ### Actions and first cell in body rows as th
@@ -222,6 +228,7 @@ To use actions you can either specify an array of actions and pass that into the
 If actions menus are getting clipped by other items on the page, such as sticky columns or rows, the `Table` can be passed a `actionsMenuAppendTo` prop to adjust where the actions menu is appended.
 
 ```ts file="LegacyTableActions.tsx"
+
 ```
 
 ### Expandable
@@ -232,6 +239,7 @@ The parent row can have an `isOpen` field for managing the expanded state of the
 Also, pass an `onCollapse` event handler via the prop on the Table
 
 ```ts file="LegacyTableExpandable.tsx"
+
 ```
 
 ### Compound expandable
@@ -248,26 +256,31 @@ To build a compound expandable table:
 4. An `onExpand` event handler prop should be passed to the Table.
 
 ```ts file="LegacyTableCompoundExpandable.tsx"
+
 ```
 
 ### With width and breakpoint visibility modifiers
 
 ```ts file="LegacyTableCellWidth.tsx"
+
 ```
 
 ### Controlling text
 
 ```ts file="LegacyTableControllingText.tsx"
+
 ```
 
 ### Modifiers with table text
 
 ```ts file="LegacyTableTextModifiers.tsx"
+
 ```
 
 ### Empty state
 
 ```ts file="LegacyTableEmptyState.tsx"
+
 ```
 
 ### Editable rows
@@ -330,13 +343,13 @@ class EditableRowsTable extends React.Component {
       ],
       rows: [
         {
-          rowEditBtnAriaLabel: idx => `Edit row ${idx}`,
-          rowSaveBtnAriaLabel: idx => `Save edits for row ${idx}`,
-          rowCancelBtnAriaLabel: idx => `Cancel edits for row ${idx}`,
+          rowEditBtnAriaLabel: (idx) => `Edit row ${idx}`,
+          rowSaveBtnAriaLabel: (idx) => `Save edits for row ${idx}`,
+          rowCancelBtnAriaLabel: (idx) => `Cancel edits for row ${idx}`,
           rowEditValidationRules: [
             {
               name: 'required',
-              validator: value => value.trim() !== '',
+              validator: (value) => value.trim() !== '',
               errorText: 'This field is required'
             }
           ],
@@ -537,22 +550,22 @@ class EditableRowsTable extends React.Component {
           rowEditValidationRules: [
             {
               name: 'required',
-              validator: value => value.trim() !== '',
+              validator: (value) => value.trim() !== '',
               errorText: 'This field is required'
             },
             {
               name: 'notFoo',
-              validator: value => value.trim().toLowerCase() !== 'foo',
+              validator: (value) => value.trim().toLowerCase() !== 'foo',
               errorText: 'Value cannot be "foo"'
             },
             {
               name: 'minLength',
-              validator: value => value.trim().length >= 7,
+              validator: (value) => value.trim().length >= 7,
               errorText: 'Value must be at least 7 characters'
             },
             {
               name: 'notXyz',
-              validator: value => value.trim().toLowerCase() !== 'xyz',
+              validator: (value) => value.trim().toLowerCase() !== 'xyz',
               errorText: 'Value cannot be xyz'
             }
           ],
@@ -703,7 +716,7 @@ class EditableRowsTable extends React.Component {
             if (!newSelected.includes(newValue)) {
               newSelected.push(newValue);
             } else {
-              newSelected = newSelected.filter(el => el !== newValue);
+              newSelected = newSelected.filter((el) => el !== newValue);
             }
             newSelectOpen = true;
             break;
@@ -734,7 +747,7 @@ class EditableRowsTable extends React.Component {
     };
 
     this.onToggle = (isOpen, rowIndex, cellIndex) => {
-      console.log("isOpen", isOpen);
+      console.log('isOpen', isOpen);
       let newRows = Array.from(this.state.rows);
       newRows[rowIndex].cells[cellIndex].props.isSelectOpen = isOpen;
       this.setState({
@@ -774,6 +787,7 @@ When you also pass a sort callback through the `onSort` prop, favorites sorting
 If you want to exclude favorites from sorting, set `canSortFavorites={false}` on the Table.
 
 ```ts file="LegacyTableFavoritable.tsx"
+
 ```
 
 ### Tree table
@@ -803,25 +817,29 @@ aria-posinset, and aria-setsize as violations. This is an intentional choice at
 the voice over technologies will recognize the flat table structure as a tree.
 
 ```ts file="LegacyTableTree.tsx"
+
 ```
 
 ### Striped
 
 To apply striping to a basic table, add the `isStriped` property to `Table`.
 
 ```ts file="LegacyTableStriped.tsx"
+
 ```
 
 ### Striped expandable
 
 To apply striping to an expandable table, add the `isStriped` and `isExpandable` properties to `Table`.
 
 ```ts file="LegacyTableStripedExpandable.tsx"
+
 ```
 
 ### Striped custom tr
 
 To manually control striping, use a custom row wrapper that applies the `pf-m-striped` css class for each desired row.
 
 ```ts file="LegacyTableStripedCustomTr.tsx"
+
 ```