fix: Prevent stale pointer navigation (#2890)

Author: mtrezza

src/components/BrowserMenu/BrowserMenu.react.js

@@ -83,7 +83,10 @@ export default class BrowserMenu extends React.Component {
 BrowserMenu.propTypes = {
   icon: PropTypes.string.isRequired.describe('The name of the icon to place in the menu.'),
   title: PropTypes.string.isRequired.describe('The title text of the menu.'),
-  children: PropTypes.arrayOf(PropTypes.node).describe(
+  children: PropTypes.oneOfType([
+    PropTypes.arrayOf(PropTypes.node),
+    PropTypes.node,
+  ]).describe(
     'The contents of the menu when open. It should be a set of MenuItem and Separator components.'
   ),
 };

src/dashboard/Data/Browser/Browser.react.js

@@ -44,8 +44,7 @@ import { withRouter } from 'lib/withRouter';
 import { get } from 'lib/AJAX';
 import BrowserFooter from './BrowserFooter.react';
 
-const SELECTED_ROWS_MESSAGE =
-  'There are selected rows. Are you sure you want to leave this page?';
+const SELECTED_ROWS_MESSAGE = 'There are selected rows. Are you sure you want to leave this page?';
 
 function SelectedRowsNavigationPrompt({ when }) {
   const message = SELECTED_ROWS_MESSAGE;
@@ -119,7 +118,7 @@ function SelectedRowsNavigationPrompt({ when }) {
 }
 
 // The initial and max amount of rows fetched by lazy loading
-const BROWSER_LAST_LOCATION = 'brower_last_location';
+const BROWSER_LAST_LOCATION = 'browser_last_location';
 
 @subscribeTo('Schema', 'schema')
 @withRouter
@@ -386,6 +385,13 @@ class Browser extends DashboardView {
   }
   addLocation(appId) {
     if (window.localStorage) {
+      const currentSearch = this.props.location?.search;
+      if (currentSearch) {
+        const params = new URLSearchParams(currentSearch);
+        if (params.has('filters')) {
+          return;
+        }
+      }
       let pathname = null;
       const newLastLocations = [];
 
@@ -1505,22 +1511,17 @@ class Browser extends DashboardView {
 
             if (error.code === Parse.Error.AGGREGATE_ERROR) {
               if (error.errors.length == 1) {
-                errorDeletingNote =
-                  `Error deleting ${className} with id '${error.errors[0].object.id}'`;
+                errorDeletingNote = `Error deleting ${className} with id '${error.errors[0].object.id}'`;
               } else if (error.errors.length < toDeleteObjectIds.length) {
-                errorDeletingNote =
-                  `Error deleting ${error.errors.length} out of ${toDeleteObjectIds.length} ${className} objects`;
+                errorDeletingNote = `Error deleting ${error.errors.length} out of ${toDeleteObjectIds.length} ${className} objects`;
               } else {
-                errorDeletingNote =
-                  `Error deleting all ${error.errors.length} ${className} objects`;
+                errorDeletingNote = `Error deleting all ${error.errors.length} ${className} objects`;
               }
             } else {
               if (toDeleteObjectIds.length == 1) {
-                errorDeletingNote =
-                  `Error deleting ${className} with id '${toDeleteObjectIds[0]}'`;
+                errorDeletingNote = `Error deleting ${className} with id '${toDeleteObjectIds[0]}'`;
               } else {
-                errorDeletingNote =
-                  `Error deleting ${toDeleteObjectIds.length} ${className} objects`;
+                errorDeletingNote = `Error deleting ${toDeleteObjectIds.length} ${className} objects`;
               }
             }
 
@@ -2526,9 +2527,7 @@ class Browser extends DashboardView {
         <Helmet>
           <title>{pageTitle}</title>
         </Helmet>
-        <SelectedRowsNavigationPrompt
-          when={Object.keys(this.state.selection).length > 0}
-        />
+        <SelectedRowsNavigationPrompt when={Object.keys(this.state.selection).length > 0} />
         {browser}
         {notification}
         {extras}

src/dashboard/Data/Browser/BrowserTable.react.js

@@ -574,7 +574,7 @@ export default class BrowserTable extends React.Component {
         id="browser-table"
         style={{
           right: rightValue,
-          'overflow-x': this.props.isResizing ? 'hidden' : 'auto',
+          overflowX: this.props.isResizing ? 'hidden' : 'auto',
         }}
       >
         <DataBrowserHeaderBar