fix(beta): beta warning for datatoolbar, cleanup (patternfly#3755)

* fix(beta): beta warning for datatoolbar, cleanup * [cleanup] use common strategy for notifying beta features, run linter
arnthor-agustsson · Feb 17, 2020 · ae708ac · ae708ac
1 parent cbcc49c
commit ae708ac
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 20 deletions.
diff --git a/packages/patternfly-4/react-core/src/components/DataToolbar/DataToolbar.tsx b/packages/patternfly-4/react-core/src/components/DataToolbar/DataToolbar.tsx
@@ -39,7 +39,7 @@ interface FilterInfo {
 
 export class DataToolbar extends React.Component<DataToolbarProps, DataToolbarState> {
   private chipGroupContentRef = React.createRef<HTMLDivElement>();
-
+  static hasWarnBeta = false;
   constructor(props: DataToolbarProps) {
     super(props);
 
@@ -67,6 +67,13 @@ export class DataToolbar extends React.Component<DataToolbarProps, DataToolbarSt
     if (this.isToggleManaged()) {
       window.addEventListener('resize', this.closeExpandableContent);
     }
+    if (process.env.NODE_ENV !== 'production' && !DataToolbar.hasWarnBeta) {
+      // eslint-disable-next-line no-console
+      console.warn(
+        'You are using a beta component (DataToolbar). These api parts are subject to change in the future.'
+      );
+      DataToolbar.hasWarnBeta = true;
+    }
   }
 
   componentWillUnmount() {

diff --git a/packages/patternfly-4/react-docs/src/pages/icons.js b/packages/patternfly-4/react-docs/src/pages/icons.js
@@ -47,7 +47,9 @@ const iconsPage = ({ location }) => {
         <Title size="md" className="ws-framework-title">
           React
         </Title>
-        <Title size="4xl">Icons</Title>
+        <Title headingLevel="h2" size="4xl">
+          Icons
+        </Title>
         <Text>
           These are all of the icons available for use in PatternFly React. For recommended icon usage, see our{' '}
           <a href="https://www.patternfly.org/v4/design-guidelines/styles/icons">icon usage guidelines</a>.

diff --git a/...nfly-4/react-integration/demo-app-ts/src/components/demos/TableDemo/TableEditableDemo.tsx b/...nfly-4/react-integration/demo-app-ts/src/components/demos/TableDemo/TableEditableDemo.tsx
@@ -51,12 +51,12 @@ export class TableEditableDemo extends React.Component<TableProps, { columns: (I
           rowEditValidationRules: rowLevelValidationRules,
           cells: [
             {
-              title: (value: string, rowIndex: number, cellIndex: number, props: any) => (
+              title: (value: string, rowIndex: number, cellIndex: number, updatedProps: any) => (
                 <EditableTextCell
                   value={value}
                   rowIndex={rowIndex}
                   cellIndex={cellIndex}
-                  props={props}
+                  props={updatedProps}
                   handleTextInputChange={this.handleTextInputChange}
                   inputAriaLabel="Row 1 cell 1 content"
                 />
@@ -67,12 +67,12 @@ export class TableEditableDemo extends React.Component<TableProps, { columns: (I
               }
             },
             {
-              title: (value: string, rowIndex: number, cellIndex: number, props: any) => (
+              title: (value: string, rowIndex: number, cellIndex: number, updatedProps: any) => (
                 <EditableTextCell
                   value={value}
                   rowIndex={rowIndex}
                   cellIndex={cellIndex}
-                  props={props}
+                  props={updatedProps}
                   isDisabled
                   handleTextInputChange={this.handleTextInputChange}
                   inputAriaLabel="Row 1 cell 2 content"
@@ -84,12 +84,12 @@ export class TableEditableDemo extends React.Component<TableProps, { columns: (I
               }
             },
             {
-              title: (value: string, rowIndex: number, cellIndex: number, props: any) => (
+              title: (value: string, rowIndex: number, cellIndex: number, updatedProps: any) => (
                 <EditableTextCell
                   value={value}
                   rowIndex={rowIndex}
                   cellIndex={cellIndex}
-                  props={props}
+                  props={updatedProps}
                   handleTextInputChange={this.handleTextInputChange}
                   inputAriaLabel="Row 1 cell 3 content"
                 />
@@ -100,12 +100,12 @@ export class TableEditableDemo extends React.Component<TableProps, { columns: (I
               }
             },
             {
-              title: (value: string, rowIndex: number, cellIndex: number, props: any) => (
+              title: (value: string, rowIndex: number, cellIndex: number, updatedProps: any) => (
                 <EditableTextCell
                   value={value}
                   rowIndex={rowIndex}
                   cellIndex={cellIndex}
-                  props={props}
+                  props={updatedProps}
                   handleTextInputChange={this.handleTextInputChange}
                   inputAriaLabel="Row 1 cell 4 content"
                 />
@@ -124,12 +124,12 @@ export class TableEditableDemo extends React.Component<TableProps, { columns: (I
           rowCancelBtnAriaLabel: idx => `Cancel edits for row ${idx}`,
           cells: [
             {
-              title: (value: string, rowIndex: number, cellIndex: number, props: any) => (
+              title: (value: string, rowIndex: number, cellIndex: number, updatedProps: any) => (
                 <EditableTextCell
                   value={value}
                   rowIndex={rowIndex}
                   cellIndex={cellIndex}
-                  props={props}
+                  props={updatedProps}
                   handleTextInputChange={this.handleTextInputChange}
                   inputAriaLabel="Row 2 cell 1 content"
                 />
@@ -140,12 +140,12 @@ export class TableEditableDemo extends React.Component<TableProps, { columns: (I
               }
             },
             {
-              title: (value: string, rowIndex: number, cellIndex: number, props: any) => (
+              title: (value: string, rowIndex: number, cellIndex: number, updatedProps: any) => (
                 <EditableTextCell
                   value={value}
                   rowIndex={rowIndex}
                   cellIndex={cellIndex}
-                  props={props}
+                  props={updatedProps}
                   isDisabled
                   handleTextInputChange={this.handleTextInputChange}
                   inputAriaLabel="Row 2 cell 2 content"
@@ -157,12 +157,12 @@ export class TableEditableDemo extends React.Component<TableProps, { columns: (I
               }
             },
             {
-              title: (value: string, rowIndex: number, cellIndex: number, props: any) => (
+              title: (value: string, rowIndex: number, cellIndex: number, updatedProps: any) => (
                 <EditableTextCell
                   value={value}
                   rowIndex={rowIndex}
                   cellIndex={cellIndex}
-                  props={props}
+                  props={updatedProps}
                   handleTextInputChange={this.handleTextInputChange}
                   inputAriaLabel="Row 2 cell 3 content"
                 />
@@ -173,12 +173,12 @@ export class TableEditableDemo extends React.Component<TableProps, { columns: (I
               }
             },
             {
-              title: (value: string, rowIndex: number, cellIndex: number, props: any) => (
+              title: (value: string, rowIndex: number, cellIndex: number, updatedProps: any) => (
                 <EditableTextCell
                   value={value}
                   rowIndex={rowIndex}
                   cellIndex={cellIndex}
-                  props={props}
+                  props={updatedProps}
                   handleTextInputChange={this.handleTextInputChange}
                   inputAriaLabel="Row 2 cell 4 content"
                 />
@@ -226,7 +226,7 @@ export class TableEditableDemo extends React.Component<TableProps, { columns: (I
     });
   };
 
-  handleTextInputChange = (newValue, evt, rowIndex, cellIndex) => {
+  handleTextInputChange = (newValue: string, evt: React.FormEvent, rowIndex: number, cellIndex: number) => {
     const newRows = Array.from(this.state.rows);
     (newRows[rowIndex].cells[cellIndex] as IRowCell).props.editableValue = newValue;
     this.setState({

diff --git a/packages/patternfly-4/react-table/src/components/Table/Table.tsx b/packages/patternfly-4/react-table/src/components/Table/Table.tsx
@@ -308,6 +308,7 @@ export const TableContext = React.createContext({
 });
 
 class Table extends React.Component<TableProps & InjectedOuiaProps, {}> {
+  static hasWarnBeta = false;
   static defaultProps = {
     children: null as React.ReactNode,
     className: '',
@@ -336,11 +337,12 @@ class Table extends React.Component<TableProps & InjectedOuiaProps, {}> {
   };
 
   componentDidMount() {
-    if (this.props.onRowEdit && !process.env.JEST_WORKER_ID) {
+    if (this.props.onRowEdit && process.env.NODE_ENV !== 'production' && !Table.hasWarnBeta) {
       // eslint-disable-next-line no-console
       console.warn(
         'You are using a beta component feature (onRowEdit). These api parts are subject to change in the future.'
       );
+      Table.hasWarnBeta = true;
     }
   }