Clean up some react lint

packages/documentsearch/src/searchoverlay.tsx

@@ -75,6 +75,7 @@ interface IReplaceEntryProps {
 class SearchEntry extends React.Component<ISearchEntryProps> {
   constructor(props: ISearchEntryProps) {
     super(props);
+    this.searchInputRef = React.createRef();
   }
 
   /**
@@ -85,7 +86,7 @@ class SearchEntry extends React.Component<ISearchEntryProps> {
     // This makes typing in the box starts a new query (the common case),
     // while arrow keys can be used to move cursor in preparation for
     // modifying previous query.
-    (this.refs.searchInputNode as HTMLInputElement).select();
+    this.searchInputRef.current?.select();
   }
 
   componentDidUpdate() {
@@ -119,7 +120,7 @@ class SearchEntry extends React.Component<ISearchEntryProps> {
           tabIndex={2}
           onFocus={e => this.props.onInputFocus()}
           onBlur={e => this.props.onInputBlur()}
-          ref="searchInputNode"
+          ref={this.searchInputRef}
         />
         <button
           className={BUTTON_WRAPPER_CLASS}
@@ -141,11 +142,14 @@ class SearchEntry extends React.Component<ISearchEntryProps> {
       </div>
     );
   }
+
+  private searchInputRef: React.RefObject<HTMLInputElement>;
 }
 
 class ReplaceEntry extends React.Component<IReplaceEntryProps> {
   constructor(props: any) {
     super(props);
+    this.replaceInputRef = React.createRef();
   }
 
   render() {
@@ -158,7 +162,7 @@ class ReplaceEntry extends React.Component<IReplaceEntryProps> {
           onKeyDown={e => this.props.onReplaceKeydown(e)}
           onChange={e => this.props.onChange(e)}
           tabIndex={3}
-          ref="replaceInputNode"
+          ref={this.replaceInputRef}
         />
         <button
           className={REPLACE_BUTTON_WRAPPER_CLASS}
@@ -187,6 +191,8 @@ class ReplaceEntry extends React.Component<IReplaceEntryProps> {
       </div>
     );
   }
+
+  private replaceInputRef: React.RefObject<HTMLInputElement>;
 }
 
 interface IUpDownProps {
@@ -324,7 +330,7 @@ IDisplayState
   constructor(props: ISearchOverlayProps) {
     super(props);
     this.state = props.overlayState;
-
+    this.replaceEntryRef = React.createRef();
     this._toggleSearchOutput = this._toggleSearchOutput.bind(this);
   }
 
@@ -532,7 +538,7 @@ IDisplayState
                 this.props.onReplaceAll(this.state.replaceText)
               }
               replaceText={this.state.replaceText}
-              ref="replaceEntry"
+              ref={this.replaceEntryRef}
             />
             <div className={SPACER_CLASS}></div>
             {filterToggle}
@@ -552,6 +558,8 @@ IDisplayState
     ];
   }
 
+  private replaceEntryRef: React.RefObect<ReplaceEntry>;
+
   private _debouncedStartSearch = new Debouncer(() => {
     this._executeSearch(true, this.state.searchText);
   }, 500);

packages/extensionmanager/src/companions.tsx

@@ -137,7 +137,7 @@ export function presentCompanions(
         one of the following commands:
         {getInstallCommands(serverCompanion).map(command => {
           return (
-            <p>
+            <p key={command}>
               <code>{command}</code>
             </p>
           );
@@ -176,7 +176,7 @@ export function presentCompanions(
           one of the following commands:
           {getInstallCommands(entry.kernelInfo).map(command => {
             return (
-              <p>
+              <p key={command}>
                 <code>{command}</code>
               </p>
             );

packages/extensionmanager/src/widget.tsx

@@ -215,7 +215,7 @@ function ListEntry(props: ListEntry.IProperties): React.ReactElement<any> {
       <div className="jp-extensionmanager-entry-description">
         <div className="jp-extensionmanager-entry-title">
           <div className="jp-extensionmanager-entry-name">
-            <a href={entry.url} target="_blank" rel="noopener">
+            <a href={entry.url} target="_blank" rel="noopener noreferrer">
               {entry.name}
             </a>
           </div>
@@ -506,7 +506,7 @@ CollapsibleSection.IState
     );
   }
 
-  componentWillReceiveProps(nextProps: CollapsibleSection.IProperties) {
+  UNSAFE_componentWillReceiveProps(nextProps: CollapsibleSection.IProperties) {
     if (nextProps.forceOpen) {
       this.setState({
         isOpen: true
@@ -615,6 +615,7 @@ export class ExtensionView extends VDomRenderer<ListModel> {
             <a
               href="https://jupyterlab.readthedocs.io/en/stable/user/extensions.html"
               target="_blank"
+              rel="noopener noreferrer"
             >
               Read more in the JupyterLab documentation.
             </a>

packages/help-extension/src/index.tsx

@@ -316,7 +316,7 @@ function activate(
           <a
             href={contributorsURL}
             target="_blank"
-            rel="noopener"
+            rel="noopener noreferrer"
             className="jp-Button-flat"
           >
             CONTRIBUTOR LIST
@@ -324,7 +324,7 @@ function activate(
           <a
             href={jupyterURL}
             target="_blank"
-            rel="noopener"
+            rel="noopener noreferrer"
             className="jp-Button-flat"
           >
             ABOUT PROJECT JUPYTER

packages/ui-components/src/components/htmlselect.tsx

@@ -68,11 +68,9 @@ export class HTMLSelect extends React.Component<IHTMLSelectProps> {
       const props: IOptionProps =
         typeof option === 'object' ? option : { value: option };
       return (
-        <option
-          {...props}
-          key={props.value}
-          children={props.label || props.value}
-        />
+        <option {...props} key={props.value}>
+          {props.label || props.value}
+        </option>
       );
     });
 

packages/ui-components/src/icon/labicon.tsx

@@ -796,6 +796,7 @@ namespace Private {
       }
     }
   );
+  blankReact.displayName = 'BlankReact';
 
   export function initContainer({
     container,
@@ -930,7 +931,7 @@ namespace Private {
         label = undefined;
       }
 
-      return ReactDOM.render(
+      ReactDOM.render(
         <this._icon.react
           container={container}
           label={label}

yarn.lock

@@ -3181,7 +3181,7 @@
     regexpp "^3.0.0"
     tsutils "^3.17.1"
 
-"@typescript-eslint/experimental-utils@2.27.0", "@typescript-eslint/experimental-utils@^2.5.0":
+"@typescript-eslint/experimental-utils@2.27.0":
   version "2.27.0"
   resolved "https://registry.yarnpkg.com/@typescript-eslint/experimental-utils/-/experimental-utils-2.27.0.tgz#801a952c10b58e486c9a0b36cf21e2aab1e9e01a"
   integrity sha512-vOsYzjwJlY6E0NJRXPTeCGqjv5OHgRU1kzxHKWJVPjDYGbPgLudBXjIlc+OD1hDBZ4l1DLbOc5VjofKahsu9Jw==
@@ -6925,13 +6925,6 @@ eslint-config-prettier@^6.7.0:
   dependencies:
     get-stdin "^6.0.0"
 
-eslint-plugin-jest@^23.8.2:
-  version "23.8.2"
-  resolved "https://registry.yarnpkg.com/eslint-plugin-jest/-/eslint-plugin-jest-23.8.2.tgz#6f28b41c67ef635f803ebd9e168f6b73858eb8d4"
-  integrity sha512-xwbnvOsotSV27MtAe7s8uGWOori0nUsrXh2f1EnpmXua8sDfY6VZhHAhHg2sqK7HBNycRQExF074XSZ7DvfoFg==
-  dependencies:
-    "@typescript-eslint/experimental-utils" "^2.5.0"
-
 eslint-plugin-prettier@^3.1.1:
   version "3.1.2"
   resolved "https://registry.yarnpkg.com/eslint-plugin-prettier/-/eslint-plugin-prettier-3.1.2.tgz#432e5a667666ab84ce72f945c72f77d996a5c9ba"