From 1aaee5ffca92f58196d7c503c6dacc18b5fd8e2b Mon Sep 17 00:00:00 2001
From: Aruna Herath <arunabherath@gmail.com>
Date: Tue, 30 Aug 2016 16:48:00 +0530
Subject: [PATCH] Custom query params are not stored in a separate object

They will be directly stored in the url just like other known query params. This also makes extra checking for other unknown query params not needed. They will also be added to state as custom query params.
---
 .../ui/configs/__tests__/handle_routing.js    | 21 +++++--------
 src/modules/ui/configs/handle_routing.js      | 30 ++++---------------
 2 files changed, 13 insertions(+), 38 deletions(-)

diff --git a/src/modules/ui/configs/__tests__/handle_routing.js b/src/modules/ui/configs/__tests__/handle_routing.js
index 1c80af3..b40b4d9 100755
--- a/src/modules/ui/configs/__tests__/handle_routing.js
+++ b/src/modules/ui/configs/__tests__/handle_routing.js
@@ -2,7 +2,6 @@ import { changeUrl, handleInitialUrl, config } from '../handle_routing';
 import { expect } from 'chai';
 const { describe, it } = global;
 import sinon from 'sinon';
-import qs from 'qs';
 
 describe('manager.ui.config.handle_routing', () => {
   describe('changeUrl', () => {
@@ -19,7 +18,7 @@ describe('manager.ui.config.handle_routing', () => {
           selectedKind: 'kk',
           selectedStory: 'ss',
           customQueryParams: {
-            test: 'teststring',
+            customText: 'test',
           },
         },
         shortcuts: {
@@ -37,9 +36,8 @@ describe('manager.ui.config.handle_routing', () => {
         getState: () => reduxState,
       };
 
-      let url = '?selectedKind=kk&selectedStory=ss&full=0&down=1&left=1&panelRight=1&downPanel=pp';
-      const queryString = qs.stringify({ custom: reduxState.api.customQueryParams });
-      url = `${url}&${queryString}`;
+      // eslint-disable-next-line max-len
+      const url = '?selectedKind=kk&selectedStory=ss&full=0&down=1&left=1&panelRight=1&downPanel=pp&customText=test';
 
       const pushState = {
         url,
@@ -50,9 +48,7 @@ describe('manager.ui.config.handle_routing', () => {
         left: true,
         panelRight: true,
         downPanel: 'pp',
-        custom: {
-          test: 'teststring',
-        },
+        customText: 'test',
       };
 
       const originalPushState = window.history.pushState;
@@ -81,11 +77,8 @@ describe('manager.ui.config.handle_routing', () => {
         },
       };
 
-      let url =
-        '?selectedKind=kk&selectedStory=ss&full=1&down=0&left=0&panelRight=0&downPanel=test';
-
-      const queryString = qs.stringify({ custom: { test: 'teststring' } });
-      url = `${url}&${queryString}`;
+      // eslint-disable-next-line max-len
+      const url = '?selectedKind=kk&selectedStory=ss&full=1&down=0&left=0&panelRight=0&downPanel=test&customText=teststring';
 
       const location = {
         search: url,
@@ -104,7 +97,7 @@ describe('manager.ui.config.handle_routing', () => {
         downPanelInRight: false,
       })).to.be.true;
       expect(actions.ui.selectDownPanel.calledWith('test')).to.be.true;
-      expect(actions.api.setQueryParams.calledWith({ test: 'teststring' })).to.be.true;
+      expect(actions.api.setQueryParams.calledWith({ customText: 'teststring' })).to.be.true;
       /* eslint-enable no-unused-expressions */
     });
   });
diff --git a/src/modules/ui/configs/handle_routing.js b/src/modules/ui/configs/handle_routing.js
index cf8c6dd..1bf4ba5 100755
--- a/src/modules/ui/configs/handle_routing.js
+++ b/src/modules/ui/configs/handle_routing.js
@@ -10,7 +10,7 @@ export function changeUrl(reduxStore) {
   const { api, shortcuts, ui } = reduxStore.getState();
   if (!api) return;
 
-  const { selectedKind, selectedStory } = api;
+  const { selectedKind, selectedStory, customQueryParams } = api;
   const queryString = qs.stringify({ selectedKind, selectedStory });
 
   if (queryString === '') return;
@@ -35,31 +35,13 @@ export function changeUrl(reduxStore) {
 
   const uiQuery = qs.stringify({ downPanel });
 
-  const {
-    customQueryParams: custom,
-  } = api;
-  const customParamsString = qs.stringify({ custom });
-
   let url = `?${queryString}&${layoutQuery}&${uiQuery}`;
-  if (customParamsString) {
-    url = `${url}&${customParamsString}`;
-  }
 
-  const currentQs = location.search.substring(1);
-  if (currentQs && currentQs.length > 0) {
-    const parsedQs = qs.parse(currentQs);
-    const knownKeys = [
-      'selectedKind', 'selectedStory', 'full', 'down', 'left', 'panelRight',
-      'downPanel', 'custom',
-    ];
-    knownKeys.forEach(key => {
-      delete(parsedQs[key]);
-    });
-    const otherParams = qs.stringify(parsedQs);
-    url = `${url}&${otherParams}`;
+  const customParamsString = qs.stringify(customQueryParams);
+  if (customParamsString.length > 0) {
+    url = `${url}&${customParamsString}`;
   }
 
-
   const state = {
     url,
     selectedKind,
@@ -69,7 +51,7 @@ export function changeUrl(reduxStore) {
     left,
     panelRight,
     downPanel,
-    custom,
+    ...customQueryParams,
   };
 
   window.history.pushState(state, '', url);
@@ -84,7 +66,7 @@ export function updateStore(queryParams, actions) {
     left = 1,
     panelRight = 0,
     downPanel,
-    custom,
+    ...custom,
   } = queryParams;
 
   if (selectedKind && selectedStory) {