From 994f0d765e93b242d538b0bce1f32e3397d0cf09 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marek=20=27marx=27=20Gr=C3=A1c?= <mgrac@redhat.com>
Date: Wed, 24 Aug 2016 11:19:34 +0200
Subject: [PATCH] Add compareFunction to change order of sections

---
 components/SelectableSectionsListView.js | 19 ++++++++++++++++---
 1 file changed, 16 insertions(+), 3 deletions(-)

diff --git a/components/SelectableSectionsListView.js b/components/SelectableSectionsListView.js
index 0d6d41a..8daf45c 100644
--- a/components/SelectableSectionsListView.js
+++ b/components/SelectableSectionsListView.js
@@ -104,7 +104,10 @@ export default class SelectableSectionsListView extends Component {
     if (!this.props.useDynamicHeights) {
       const cellHeight = this.props.cellHeight;
       let sectionHeaderHeight = this.props.sectionHeaderHeight;
-      const keys = Object.keys(this.props.data);
+      let keys = Object.keys(this.props.data);
+      if (typeof(this.props.compareFunction) === "function") {
+        keys = keys.sort(this.props.compareFunction);
+      }
       const index = keys.indexOf(section);
 
       let numcells = 0;
@@ -208,6 +211,11 @@ export default class SelectableSectionsListView extends Component {
     let sectionList;
     let renderSectionHeader;
     let dataSource;
+    let sections = Object.keys(data);
+
+    if (typeof(this.props.compareFunction) === "function") {
+      sections = sections.sort(this.props.compareFunction);
+    }
 
     if (dataIsArray) {
       dataSource = this.state.dataSource.cloneWithRows(data);
@@ -216,7 +224,7 @@ export default class SelectableSectionsListView extends Component {
         <SectionList
           style={this.props.sectionListStyle}
           onSectionSelect={this.scrollToSection}
-          sections={Object.keys(data)}
+          sections={sections}
           data={data}
           getSectionListTitle={this.props.getSectionListTitle}
           component={this.props.sectionListItem}
@@ -224,7 +232,7 @@ export default class SelectableSectionsListView extends Component {
         null;
 
       renderSectionHeader = this.renderSectionHeader;
-      dataSource = this.state.dataSource.cloneWithRowsAndSections(data);
+      dataSource = this.state.dataSource.cloneWithRowsAndSections(data, sections);
     }
 
     const renderFooter = this.props.footer ?
@@ -291,6 +299,11 @@ SelectableSectionsListView.propTypes = {
   getSectionTitle: PropTypes.func,
   getSectionListTitle: PropTypes.func,
 
+  /**
+   * Function to sort sections. If not provided, the sections order will match data source
+   */
+  compareFunction: PropTypes.func,
+
   /**
    * Callback which should be called when a cell has been selected
    */