Explorar o código

Fixed issue where double clicking on back button closes sidemenu

Torkel Ödegaard %!s(int64=6) %!d(string=hai) anos
pai
achega
9565e48f03

+ 10 - 0
public/app/core/components/sidemenu/SideMenu.test.tsx

@@ -8,6 +8,16 @@ jest.mock('../../app_events', () => ({
   emit: jest.fn(),
 }));
 
+jest.mock('app/store/store', () => ({
+  store: {
+    getState: jest.fn().mockReturnValue({
+      location: {
+        lastUpdated: 0,
+      }
+    })
+  }
+}));
+
 jest.mock('app/core/services/context_srv', () => ({
   contextSrv: {
     sidemenu: true,

+ 7 - 0
public/app/core/components/sidemenu/SideMenu.tsx

@@ -3,9 +3,16 @@ import appEvents from '../../app_events';
 import { contextSrv } from 'app/core/services/context_srv';
 import TopSection from './TopSection';
 import BottomSection from './BottomSection';
+import { store } from 'app/store/store';
 
 export class SideMenu extends PureComponent {
   toggleSideMenu = () => {
+    // ignore if we just made a location change, stops hiding sidemenu on double clicks of back button
+    const timeSinceLocationChanged = new Date().getTime() - store.getState().location.lastUpdated;
+    if (timeSinceLocationChanged < 1000) {
+      return;
+    }
+
     contextSrv.toggleSideMenu();
     appEvents.emit('toggle-sidemenu');
   };

+ 2 - 0
public/app/core/reducers/location.ts

@@ -9,6 +9,7 @@ export const initialState: LocationState = {
   query: {},
   routeParams: {},
   replace: false,
+  lastUpdated: 0,
 };
 
 export const locationReducer = (state = initialState, action: Action): LocationState => {
@@ -28,6 +29,7 @@ export const locationReducer = (state = initialState, action: Action): LocationS
         query: { ...query },
         routeParams: routeParams || state.routeParams,
         replace: replace === true,
+        lastUpdated: new Date().getTime(),
       };
     }
   }

+ 2 - 2
public/app/store/configureStore.ts

@@ -1,6 +1,6 @@
 import { createStore, applyMiddleware, compose, combineReducers } from 'redux';
 import thunk from 'redux-thunk';
-import { createLogger } from 'redux-logger';
+// import { createLogger } from 'redux-logger';
 import sharedReducers from 'app/core/reducers';
 import alertingReducers from 'app/features/alerting/state/reducers';
 import teamsReducers from 'app/features/teams/state/reducers';
@@ -41,7 +41,7 @@ export function configureStore() {
 
   if (process.env.NODE_ENV !== 'production') {
     // DEV builds we had the logger middleware
-    setStore(createStore(rootReducer, {}, composeEnhancers(applyMiddleware(thunk, createLogger()))));
+    setStore(createStore(rootReducer, {}, composeEnhancers(applyMiddleware(thunk))));
   } else {
     setStore(createStore(rootReducer, {}, composeEnhancers(applyMiddleware(thunk))));
   }

+ 1 - 0
public/app/types/location.ts

@@ -15,6 +15,7 @@ export interface LocationState {
   query: UrlQueryMap;
   routeParams: UrlQueryMap;
   replace: boolean;
+  lastUpdated: number;
 }
 
 export type UrlQueryValue = string | number | boolean | string[] | number[] | boolean[];

+ 1 - 1
public/sass/components/_search.scss

@@ -21,9 +21,9 @@
 // Search
 .search-field-wrapper {
   width: 100%;
+  height: $navbarHeight;
   display: flex;
   background-color: $navbarBackground;
-  box-shadow: $navbarShadow;
   position: relative;
 
   & > input {