From cd0fae0c2c579d7db9b12c5334d0e7868c4be5fb Mon Sep 17 00:00:00 2001
From: Clement G <clement@garrot.org>
Date: Mon, 20 Apr 2020 18:05:54 +0200
Subject: [PATCH 1/3] feat(footer): remove an extra dash

---
 src/components/layouts/Footer.jsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/layouts/Footer.jsx b/src/components/layouts/Footer.jsx
index fa95260..82098fb 100644
--- a/src/components/layouts/Footer.jsx
+++ b/src/components/layouts/Footer.jsx
@@ -33,7 +33,6 @@ class Footer extends Component {
           style={linkStyle}>
           {t('Who are we?')}
         </a>
-        <span className="m-2">-</span>
         <div className="mt-3">
           <Paypal btnColor="btn-primary" />
         </div>

From 38b35fed4c5e39f4103966aaf2aa26fe372f7e2c Mon Sep 17 00:00:00 2001
From: Clement G <clement@garrot.org>
Date: Mon, 20 Apr 2020 19:37:22 +0200
Subject: [PATCH 2/3] fix(sorting-grade): add a value to make sorting grade
 easier

---
 src/Util.jsx                    | 36 ++++++++++++++++++++++-----------
 src/components/views/Result.jsx | 14 +++++++------
 src/components/views/Vote.jsx   | 17 ++++++++--------
 3 files changed, 41 insertions(+), 26 deletions(-)

diff --git a/src/Util.jsx b/src/Util.jsx
index d3f5c31..e4b800d 100644
--- a/src/Util.jsx
+++ b/src/Util.jsx
@@ -1,33 +1,45 @@
 import i18n from './i18n.jsx';
 
 const colors = [
-  '#6f0214',
-  '#b20616',
-  '#ff5d00',
-  '#ffb200',
-  '#6bca24',
-  '#019812',
   '#015411',
+  '#019812',
+  '#6bca24',
+  '#ffb200',
+  '#ff5d00',
+  '#b20616',
+  '#6f0214',
 ];
 
 const gradeNames = [
-  'To reject',
-  'Insufficient',
-  'Passable',
-  'Fair',
-  'Good',
-  'Very good',
   'Excellent',
+  'Very good',
+  'Good',
+  'Fair',
+  'Passable',
+  'Insufficient',
+  'To reject',
+];
+
+const gradeValues = [
+    6,
+    5,
+    4,
+    3,
+    2,
+    1,
+    0
 ];
 
 export const grades = gradeNames.map((name, i) => ({
   label: name,
   color: colors[i],
+  value: gradeValues[i]
 }));
 
 export const i18nGrades = () => {
   return gradeNames.map((name, i) => ({
     label: i18n.t(name),
     color: colors[i],
+    value: gradeValues[i]
   }));
 };
diff --git a/src/components/views/Result.jsx b/src/components/views/Result.jsx
index f615225..b579564 100644
--- a/src/components/views/Result.jsx
+++ b/src/components/views/Result.jsx
@@ -11,7 +11,7 @@ import {
   CardBody,
   Table,
 } from 'reactstrap';
-import {i18nGrades} from '../../Util';
+import {grades, i18nGrades} from '../../Util';
 import {AppContext} from '../../AppContext';
 import {errorMessage, Error} from '../../Errors';
 
@@ -166,7 +166,9 @@ class Result extends Component {
   render() {
     const {errorMessage, candidates, electionGrades} = this.state;
     const {t} = this.props;
-    const grades = i18nGrades();
+    const offsetGrade = grades.length-(this.state.numGrades);
+    const i18nGradesObject = i18nGrades();
+
 
     if (errorMessage && errorMessage !== '') {
       return <Error value={errorMessage} />;
@@ -207,10 +209,10 @@ class Result extends Component {
                     <span
                       className="badge badge-light ml-2 mt-2"
                       style={{
-                        backgroundColor: electionGrades[candidate.grade].color,
+                        backgroundColor: electionGrades.slice(0).reverse()[(candidate.grade)].color,
                         color: '#fff',
                       }}>
-                      {grades[candidate.grade].label}
+                      {i18nGradesObject.slice(0).reverse()[candidate.grade+offsetGrade].label}
                     </span>
                     {/* <span className="badge badge-dark mt-2 ml-2">
                       {(100 * candidate.score).toFixed(1)}%
@@ -252,7 +254,7 @@ class Result extends Component {
                                 <table style={{width: '100%'}}>
                                   <tbody>
                                     <tr>
-                                      {gradeIds.map((id, i) => {
+                                      {gradeIds.slice(0).reverse().map((id, i) => {
                                         const value = candidate.profile[id];
                                         if (value > 0) {
                                           let percent =
@@ -359,7 +361,7 @@ class Result extends Component {
                           return (
                             <tr key={i}>
                               <td>{i + 1}</td>
-                              {gradeIds.map((id, i) => {
+                              {gradeIds.slice(0).reverse().map((id, i) => {
                                 const value = candidate.profile[id];
                                 const percent = (
                                   (value / numVotes) *
diff --git a/src/components/views/Vote.jsx b/src/components/views/Vote.jsx
index 30e38e5..b65810f 100644
--- a/src/components/views/Vote.jsx
+++ b/src/components/views/Vote.jsx
@@ -6,7 +6,7 @@ import {toast, ToastContainer} from 'react-toastify';
 import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
 import {faCheck} from '@fortawesome/free-solid-svg-icons';
 import {resolve} from 'url';
-import {i18nGrades} from '../../Util';
+import {i18nGrades,grades} from '../../Util';
 import {AppContext} from '../../AppContext';
 import {errorMessage} from '../../Errors';
 
@@ -169,6 +169,7 @@ class Vote extends Component {
   render() {
     const {t} = this.props;
     const {redirectTo, candidates, electionGrades} = this.state;
+    const offsetGrade = grades.length-this.state.numGrades;
 
     if (redirectTo) {
       return <Redirect to={redirectTo} />;
@@ -220,7 +221,7 @@ class Vote extends Component {
                   <hr className="d-lg-none" />
                 </Col>
                 {this.state.electionGrades.map((grade, gradeId) => {
-                  console.assert(gradeId < this.state.numGrades) 
+                  console.assert(gradeId < this.state.numGrades)
                   return (
                     <Col
                       xs={this.state.colSizeGradeXs}
@@ -229,7 +230,7 @@ class Vote extends Component {
                       key={gradeId}
                       className="text-lg-center">
                       <label
-                        htmlFor={'candidateGrade' + candidateId + '-' + gradeId}
+                        htmlFor={'candidateGrade' + candidateId + '-' + (grade.value-offsetGrade)}
                         className="check">
                         <small
                           className="nowrap d-lg-none ml-2 bold badge"
@@ -239,7 +240,7 @@ class Vote extends Component {
                             ) {
                               return (
                                 JSON.stringify(ratedCandidat) ===
-                                JSON.stringify({id: candidate.id, value: gradeId})
+                                JSON.stringify({id: candidate.id, value: (grade.value-offsetGrade)})
                               );
                             })
                               ? {backgroundColor: grade.color, color: '#fff'}
@@ -253,16 +254,16 @@ class Vote extends Component {
                         <input
                           type="radio"
                           name={'candidate' + candidateId}
-                          id={'candidateGrade' + candidateId + '-' + gradeId}
+                          id={'candidateGrade' + candidateId + '-' + (grade.value-offsetGrade)}
                           data-index={candidateId}
                           data-id={candidate.id}
-                          value={gradeId}
+                          value={grade.value-offsetGrade}
                           onClick={this.handleGradeClick}
                           defaultChecked={this.state.ratedCandidates.find(
                             function(element) {
                               return (
                                 JSON.stringify(element) ===
-                                JSON.stringify({id: candidate.id, value: gradeId})
+                                JSON.stringify({id: candidate.id, value: grade.value-offsetGrade})
                               );
                             },
                           )}
@@ -275,7 +276,7 @@ class Vote extends Component {
                             ) {
                               return (
                                 JSON.stringify(ratedCandidat) ===
-                                JSON.stringify({id: candidate.id, value: gradeId})
+                                JSON.stringify({id: candidate.id, value: (grade.value-offsetGrade)})
                               );
                             })
                               ? {backgroundColor: grade.color, color: '#fff'}

From ce5cf17212c739e4fcb0ce90c027a93743a29b4f Mon Sep 17 00:00:00 2001
From: Clement G <clement@garrot.org>
Date: Mon, 20 Apr 2020 20:34:15 +0200
Subject: [PATCH 3/3] refactor(sorting-grade): make sorting grade code clearer

---
 src/components/views/Result.jsx |  7 ++++---
 src/components/views/Vote.jsx   | 15 ++++++++-------
 2 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/src/components/views/Result.jsx b/src/components/views/Result.jsx
index b579564..b47cdaf 100644
--- a/src/components/views/Result.jsx
+++ b/src/components/views/Result.jsx
@@ -11,7 +11,7 @@ import {
   CardBody,
   Table,
 } from 'reactstrap';
-import {grades, i18nGrades} from '../../Util';
+import {i18nGrades} from '../../Util';
 import {AppContext} from '../../AppContext';
 import {errorMessage, Error} from '../../Errors';
 
@@ -166,8 +166,8 @@ class Result extends Component {
   render() {
     const {errorMessage, candidates, electionGrades} = this.state;
     const {t} = this.props;
-    const offsetGrade = grades.length-(this.state.numGrades);
     const i18nGradesObject = i18nGrades();
+    const offsetGrade = i18nGradesObject.length-(this.state.numGrades);
 
 
     if (errorMessage && errorMessage !== '') {
@@ -203,6 +203,7 @@ class Result extends Component {
             <hr className="mb-5" />
             <ol>
               {candidates.map((candidate, i) => {
+                const gradeValue=candidate.grade+offsetGrade;
                 return (
                   <li key={i} className="mt-2">
                     <span className="mt-2 ml-2">{candidate.name}</span>
@@ -212,7 +213,7 @@ class Result extends Component {
                         backgroundColor: electionGrades.slice(0).reverse()[(candidate.grade)].color,
                         color: '#fff',
                       }}>
-                      {i18nGradesObject.slice(0).reverse()[candidate.grade+offsetGrade].label}
+                      {i18nGradesObject.slice(0).reverse()[gradeValue].label}
                     </span>
                     {/* <span className="badge badge-dark mt-2 ml-2">
                       {(100 * candidate.score).toFixed(1)}%
diff --git a/src/components/views/Vote.jsx b/src/components/views/Vote.jsx
index b65810f..793ed5c 100644
--- a/src/components/views/Vote.jsx
+++ b/src/components/views/Vote.jsx
@@ -6,7 +6,7 @@ import {toast, ToastContainer} from 'react-toastify';
 import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
 import {faCheck} from '@fortawesome/free-solid-svg-icons';
 import {resolve} from 'url';
-import {i18nGrades,grades} from '../../Util';
+import {i18nGrades} from '../../Util';
 import {AppContext} from '../../AppContext';
 import {errorMessage} from '../../Errors';
 
@@ -169,7 +169,7 @@ class Vote extends Component {
   render() {
     const {t} = this.props;
     const {redirectTo, candidates, electionGrades} = this.state;
-    const offsetGrade = grades.length-this.state.numGrades;
+    const offsetGrade = i18nGrades().length-this.state.numGrades;
 
     if (redirectTo) {
       return <Redirect to={redirectTo} />;
@@ -222,6 +222,7 @@ class Vote extends Component {
                 </Col>
                 {this.state.electionGrades.map((grade, gradeId) => {
                   console.assert(gradeId < this.state.numGrades)
+                  const gradeValue = grade.value-offsetGrade;
                   return (
                     <Col
                       xs={this.state.colSizeGradeXs}
@@ -230,7 +231,7 @@ class Vote extends Component {
                       key={gradeId}
                       className="text-lg-center">
                       <label
-                        htmlFor={'candidateGrade' + candidateId + '-' + (grade.value-offsetGrade)}
+                        htmlFor={'candidateGrade' + candidateId + '-' + gradeValue}
                         className="check">
                         <small
                           className="nowrap d-lg-none ml-2 bold badge"
@@ -240,7 +241,7 @@ class Vote extends Component {
                             ) {
                               return (
                                 JSON.stringify(ratedCandidat) ===
-                                JSON.stringify({id: candidate.id, value: (grade.value-offsetGrade)})
+                                JSON.stringify({id: candidate.id, value: gradeValue})
                               );
                             })
                               ? {backgroundColor: grade.color, color: '#fff'}
@@ -254,7 +255,7 @@ class Vote extends Component {
                         <input
                           type="radio"
                           name={'candidate' + candidateId}
-                          id={'candidateGrade' + candidateId + '-' + (grade.value-offsetGrade)}
+                          id={'candidateGrade' + candidateId + '-' + gradeValue}
                           data-index={candidateId}
                           data-id={candidate.id}
                           value={grade.value-offsetGrade}
@@ -263,7 +264,7 @@ class Vote extends Component {
                             function(element) {
                               return (
                                 JSON.stringify(element) ===
-                                JSON.stringify({id: candidate.id, value: grade.value-offsetGrade})
+                                JSON.stringify({id: candidate.id, value: gradeValue})
                               );
                             },
                           )}
@@ -276,7 +277,7 @@ class Vote extends Component {
                             ) {
                               return (
                                 JSON.stringify(ratedCandidat) ===
-                                JSON.stringify({id: candidate.id, value: (grade.value-offsetGrade)})
+                                JSON.stringify({id: candidate.id, value: gradeValue})
                               );
                             })
                               ? {backgroundColor: grade.color, color: '#fff'}