client: selecting metrics modifies query, but doesn't show in search box

5 files changed, 31 insertions, 13 deletions

diff --git a/client/js/controllers/post_list_controller.js b/client/js/controllers/post_list_controller.js
index 443e25d..a7a5793 100644
--- a/client/js/controllers/post_list_controller.js
+++ b/client/js/controllers/post_list_controller.js
@@ -129,8 +129,8 @@ class PostListController {
                 return uri.formatClientLink('posts', parameters);
             },
             requestPage: (offset, limit) => {
-                return PostList.search(
-                    this._ctx.parameters.query, offset, limit, fields, this._ctx.parameters.cachenumber);
+                let query = uri.getPostsQuery(this._ctx.parameters);
+                return PostList.search(query, offset, limit, fields, this._ctx.parameters.cachenumber);
             },
             pageRenderer: pageCtx => {
                 Object.assign(pageCtx, {
diff --git a/client/js/controllers/post_main_controller.js b/client/js/controllers/post_main_controller.js
index c00ddd8..2adf33b 100644
--- a/client/js/controllers/post_main_controller.js
+++ b/client/js/controllers/post_main_controller.js
@@ -18,17 +18,16 @@ class PostMainController extends BasePostController {
         super(ctx);
 
         let parameters = ctx.parameters;
+        let query = uri.getPostsQuery(parameters);
         Promise.all([
                 Post.get(ctx.parameters.id),
-                PostList.getAround(
-                    ctx.parameters.id,
-                    parameters ? parameters.query : null),
+                PostList.getAround(ctx.parameters.id, query),
         ]).then(responses => {
             const [post, aroundResponse] = responses;
 
             // remove junk from query, but save it into history so that it can
             // be still accessed after history navigation / page refresh
-            if (parameters.query) {
+            if (parameters.query || parameters.metrics) {
                 ctx.state.parameters = parameters;
                 const url = editMode ?
                     uri.formatClientLink('post', ctx.parameters.id, 'edit') :
diff --git a/client/js/controls/metric_header_control.js b/client/js/controls/metric_header_control.js
index 7bc03a3..3e73864 100644
--- a/client/js/controls/metric_header_control.js
+++ b/client/js/controls/metric_header_control.js
@@ -45,7 +45,8 @@ class MetricHeaderControl extends events.EventTarget {
                     selected: this._selectedMetrics.includes(metric),
                 },
                 this._ctx));
-            node.addEventListener('click', e => this._evtMetricClicked(e, node, metric));
+            node.addEventListener('click', e =>
+                this._evtMetricClicked(e, node, metric));
             this._metricListNode.appendChild(node);
         }
     }
@@ -59,10 +60,11 @@ class MetricHeaderControl extends events.EventTarget {
         } else {
             this._selectedMetrics.add(metric);
         }
-        this._ctx.parameters = Object.assign({}, this._ctx.parameters, {
-                metrics: this._selectedMetrics
-                    .map(metric => metric.tag.names[0]).join(' ')
-            });
+        this._ctx.parameters = Object.assign({},
+            this._ctx.parameters, {
+            metrics: this._selectedMetrics
+                .map(m => m.tag.names[0]).join(' '),
+        });
         this.dispatchEvent(new CustomEvent('submit'));
     }
 }
diff --git a/client/js/util/uri.js b/client/js/util/uri.js
index 4704605..1fbadf5 100644
--- a/client/js/util/uri.js
+++ b/client/js/util/uri.js
@@ -31,6 +31,16 @@ function unescapeParam(text) {
     return decodeURIComponent(text);
 }
 
+function getPostsQuery(parameters) {
+    let normalQuery = parameters.query || '';
+    let metricQuery = (parameters.metrics || '')
+        .split(' ') //see metric_header_control
+        .filter(m => m)
+        .map(m => m + ' sort:metric-' + m)
+        .join(' ');
+    return normalQuery + ' ' + metricQuery;
+}
+
 function formatClientLink(...values) {
     let parts = [];
     for (let value of values) {
@@ -85,6 +95,7 @@ function escapeColons(text) {
 }
 
 module.exports = {
+    getPostsQuery:     getPostsQuery,
     formatClientLink:  formatClientLink,
     formatApiLink:     formatApiLink,
     escapeColons:      escapeColons,
diff --git a/client/js/util/views.js b/client/js/util/views.js
index 626ed9e..1986ee2 100644
--- a/client/js/util/views.js
+++ b/client/js/util/views.js
@@ -176,13 +176,19 @@ function makeDateInput(options) {
 function getPostUrl(id, parameters) {
     return uri.formatClientLink(
         'post', id,
-        parameters ? {query: parameters.query} : {});
+        parameters ? {
+            query: parameters.query,
+            metrics: parameters.metrics,
+        } : {});
 }
 
 function getPostEditUrl(id, parameters) {
     return uri.formatClientLink(
         'post', id, 'edit',
-        parameters ? {query: parameters.query} : {});
+        parameters ? {
+            query: parameters.query,
+            metrics: parameters.metrics,
+        } : {});
 }
 
 function makePostLink(id, includeHash) {