Rewrite updateQueryString to preserve namespaces

* Refactors ActivityStream to use updateQueryString

awx/ui_next/src/screens/ActivityStream/ActivityStream.jsx

@@ -22,8 +22,7 @@ import useRequest from '../../util/useRequest';
 import {
   getQSConfig,
   parseQueryString,
-  replaceParams,
+  updateQueryString,
-  encodeNonDefaultQueryString,
 } from '../../util/qs';
 import { ActivityStreamAPI } from '../../api';
 
@@ -96,16 +95,14 @@ function ActivityStream() {
   }, [fetchActivityStream]);
 
   const pushHistoryState = urlParamsToAdd => {
-    let searchParams = parseQueryString(QS_CONFIG, location.search);
+    const pageOneQs = updateQueryString(QS_CONFIG, location.search, {
-    searchParams = replaceParams(searchParams, { page: 1 });
+      page: 1,
-    const encodedParams = encodeNonDefaultQueryString(QS_CONFIG, searchParams, {
+    });
+    const qs = updateQueryString(null, pageOneQs, {
       type: urlParamsToAdd.get('type'),
     });
-    history.push(
+
-      encodedParams
+    history.push(qs ? `${location.pathname}?${qs}` : location.pathname);
-        ? `${location.pathname}?${encodedParams}`
-        : location.pathname
-    );
   };
 
   return (

awx/ui_next/src/util/qs.js

@@ -266,12 +266,33 @@ export function replaceParams(oldParams, newParams) {
  * @return {string} url query string
  */
 export function updateQueryString(config, queryString, newParams) {
-  const oldParams = parseQueryString(config, queryString);
+  const allParams = parseFullQueryString(queryString);
-  const updatedParams = replaceParams(oldParams, newParams);
+  const { namespace = null, defaultParams = {} } = config || {};
-  const nonNamespacedParams = parseQueryString({}, queryString);
+  Object.keys(newParams).forEach(key => {
-  return encodeNonDefaultQueryString(
+    const val = newParams[key];
-    config,
+    const fullKey = namespace ? `${namespace}.${key}` : key;
-    updatedParams,
+    if (val === null || val === defaultParams[key]) {
-    nonNamespacedParams
+      delete allParams[fullKey];
-  );
+    } else {
+      allParams[fullKey] = newParams[key];
+    }
+  });
+  return encodeQueryString(allParams);
+}
+
+function parseFullQueryString(queryString) {
+  const allParams = {};
+  queryString
+    .replace(/^\?/, '')
+    .split('&')
+    .map(s => s.split('='))
+    .forEach(([rawKey, rawValue]) => {
+      if (!rawKey) {
+        return;
+      }
+      const key = decodeURIComponent(rawKey);
+      const value = decodeURIComponent(rawValue);
+      allParams[key] = mergeParam(allParams[key], value);
+    });
+  return allParams;
 }

awx/ui_next/src/util/qs.test.js

@@ -858,6 +858,15 @@ describe('qs (qs.js)', () => {
       integerFields: ['page'],
     };
 
+    test('should add param to empty query string', () => {
+      const newParams = {
+        page: 3,
+      };
+      expect(updateQueryString(config, '', newParams)).toEqual(
+        'template.page=3'
+      );
+    });
+
     test('should update namespaced param', () => {
       const query = 'template.name__icontains=workflow&template.page=2';
       const newParams = {
@@ -910,16 +919,25 @@ describe('qs (qs.js)', () => {
       );
     });
 
-    // This fix needed after we're confident refactoring components
+    test('should update non-namespaced param', () => {
-    // to use updateQueryString provides equivalent functionality
+      const query =
-    test.skip('should not alter params of other namespaces', () => {
+        'activity_stream.name__icontains=workflow&activity_stream.page=2';
+      const newParams = {
+        type: 'job',
+      };
+      expect(updateQueryString(null, query, newParams)).toEqual(
+        'activity_stream.name__icontains=workflow&activity_stream.page=2&type=job'
+      );
+    });
+
+    test('should not alter params of other namespaces', () => {
       const query =
         'template.name__icontains=workflow&template.page=2&credential.page=3';
       const newParams = {
         page: 3,
       };
       expect(updateQueryString(config, query, newParams)).toEqual(
-        'template.name__icontains=workflow&template.page=3&credential.page=3'
+        'credential.page=3&template.name__icontains=workflow&template.page=3'
       );
     });
   });