From 77a2f32cfd5bc222ccf30dc403fffcfbfe43c72d Mon Sep 17 00:00:00 2001
From: Alejandro Celaya <alejandro@alejandrocelaya.com>
Date: Wed, 19 Dec 2018 11:07:06 +0100
Subject: [PATCH] Ensured bar graphs are sorted case insensitive

---
 CHANGELOG.md                   |  2 +-
 src/visits/SortableBarGraph.js | 11 +++++++++--
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index a05c43d8..5d751138 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -26,7 +26,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 #### Fixed
 
-* *Nothing*
+* [#77](https://github.com/shlinkio/shlink-web-client/issues/77) Sortable graphs ordering is now case insensitive.
 
 
 ## 1.2.0 - 2018-11-01
diff --git a/src/visits/SortableBarGraph.js b/src/visits/SortableBarGraph.js
index 7cf551e0..9b75d7da 100644
--- a/src/visits/SortableBarGraph.js
+++ b/src/visits/SortableBarGraph.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { fromPairs, head, keys, prop, reverse, sortBy, toPairs } from 'ramda';
+import { fromPairs, head, identity, keys, pipe, prop, reverse, sortBy, toLower, toPairs, type } from 'ramda';
 import SortingDropdown from '../utils/SortingDropdown';
 import GraphCard from './GraphCard';
 
@@ -23,7 +23,14 @@ export default class SortableBarGraph extends React.Component {
         return stats;
       }
 
-      const sortedPairs = sortBy(prop(this.state.orderField === head(keys(sortingItems)) ? 0 : 1), toPairs(stats));
+      const toLowerIfString = (value) => type(value) === 'String' ? toLower(value) : identity(value);
+      const sortedPairs = sortBy(
+        pipe(
+          prop(this.state.orderField === head(keys(sortingItems)) ? 0 : 1),
+          toLowerIfString
+        ),
+        toPairs(stats)
+      );
 
       return fromPairs(this.state.orderDir === 'ASC' ? sortedPairs : reverse(sortedPairs));
     };