From b3e019e7a0afc11acce776443e1aa7e712059e62 Mon Sep 17 00:00:00 2001
From: Mark McDowall <mark@mcdowall.ca>
Date: Sat, 13 Apr 2019 12:56:17 -0700
Subject: [PATCH] New: Sort preferred words by score when displaying in the UI

---
 .../Profiles/Release/ReleaseProfile.js        | 26 ++++++++++++++++---
 1 file changed, 22 insertions(+), 4 deletions(-)

diff --git a/frontend/src/Settings/Profiles/Release/ReleaseProfile.js b/frontend/src/Settings/Profiles/Release/ReleaseProfile.js
index 0455594c2..75d867954 100644
--- a/frontend/src/Settings/Profiles/Release/ReleaseProfile.js
+++ b/frontend/src/Settings/Profiles/Release/ReleaseProfile.js
@@ -9,6 +9,10 @@ import ConfirmModal from 'Components/Modal/ConfirmModal';
 import EditReleaseProfileModalConnector from './EditReleaseProfileModalConnector';
 import styles from './ReleaseProfile.css';
 
+function sortPreferred(preferred) {
+  return preferred.slice().sort((a, b) => b.value - a.value);
+}
+
 class ReleaseProfile extends Component {
 
   //
@@ -18,11 +22,20 @@ class ReleaseProfile extends Component {
     super(props, context);
 
     this.state = {
+      sortedPreferred: sortPreferred(props.preferred),
       isEditReleaseProfileModalOpen: false,
       isDeleteReleaseProfileModalOpen: false
     };
   }
 
+  componentDidUpdate(prevProps) {
+    const { preferred } = this.props;
+
+    if (prevProps.preferred !== preferred) {
+      this.setState({ sortedPreferred: sortPreferred(preferred) });
+    }
+  }
+
   //
   // Listeners
 
@@ -57,11 +70,16 @@ class ReleaseProfile extends Component {
       id,
       required,
       ignored,
-      preferred,
       tags,
       tagList
     } = this.props;
 
+    const {
+      sortedPreferred,
+      isEditReleaseProfileModalOpen,
+      isDeleteReleaseProfileModalOpen
+    } = this.state;
+
     return (
       <Card
         className={styles.releaseProfile}
@@ -108,7 +126,7 @@ class ReleaseProfile extends Component {
 
         <div>
           {
-            preferred.map((item) => {
+            sortedPreferred.map((item) => {
               const isPreferred = item.value >= 0;
 
               return (
@@ -130,13 +148,13 @@ class ReleaseProfile extends Component {
 
         <EditReleaseProfileModalConnector
           id={id}
-          isOpen={this.state.isEditReleaseProfileModalOpen}
+          isOpen={isEditReleaseProfileModalOpen}
           onModalClose={this.onEditReleaseProfileModalClose}
           onDeleteReleaseProfilePress={this.onDeleteReleaseProfilePress}
         />
 
         <ConfirmModal
-          isOpen={this.state.isDeleteReleaseProfileModalOpen}
+          isOpen={isDeleteReleaseProfileModalOpen}
           kind={kinds.DANGER}
           title="Delete ReleaseProfile"
           message={'Are you sure you want to delete this releaseProfile?'}