fix(getGtfsPlusSpec): Move sorting from GtfsPlusVersionSummary to getGtfsPlusSpec().

Author: binh-dam-ibigroup

lib/common/util/config.js

@@ -37,7 +37,7 @@ export function getGtfsPlusSpec (): Array<GtfsSpecTable> {
   const CONFIG: DataToolsConfig = window.DT_CONFIG
   const GTFS_PLUS_SPEC = CONFIG.specifications.gtfsplus
   if (!GTFS_PLUS_SPEC) throw new Error('GTFS+ yml configuration file is not defined!')
-  return GTFS_PLUS_SPEC
+  return GTFS_PLUS_SPEC.sort((table1, table2) => table1.name.localeCompare(table2.name))
 }
 
 /**

lib/gtfsplus/components/GtfsPlusVersionSummary.js

@@ -203,42 +203,40 @@ export default class GtfsPlusVersionSummary extends Component<Props, State> {
                   </tr>
                 </thead>
                 <tbody>
-                  {getGtfsPlusSpec()
-                    .sort((table1, table2) => table1.name.localeCompare(table2.name))
-                    .map((table, index) => {
-                      const issueCount = this.validationIssueCount(table.id)
-                      const tableLevelIssues = this._getTableLevelIssues(table.id)
-
-                      return (
-                        <tr
-                          rowSpan={tableLevelIssues ? 2 : 1}
-                          key={index}
-                          className={tableLevelIssues
-                            ? 'danger'
-                            : +issueCount > 0 && 'warning'
+                  {getGtfsPlusSpec().map((table, index) => {
+                    const issueCount = this.validationIssueCount(table.id)
+                    const tableLevelIssues = this._getTableLevelIssues(table.id)
+
+                    return (
+                      <tr
+                        rowSpan={tableLevelIssues ? 2 : 1}
+                        key={index}
+                        className={tableLevelIssues
+                          ? 'danger'
+                          : +issueCount > 0 && 'warning'
+                        }
+                        style={{ color: this.isTableIncluded(table.id) === 'Yes' ? 'black' : 'lightGray' }}>
+                        <td>
+                          {table.name}
+                          {tableLevelIssues
+                            ? <small>
+                              <br />
+                              {tableLevelIssues.length} critical table issue(s):
+                              <ul>
+                                {tableLevelIssues.map((issue, i) =>
+                                  <li key={i}>{issue.fieldName}: {issue.description}</li>)}
+                              </ul>
+                            </small>
+                            : null
                           }
-                          style={{ color: this.isTableIncluded(table.id) === 'Yes' ? 'black' : 'lightGray' }}>
-                          <td>
-                            {table.name}
-                            {tableLevelIssues
-                              ? <small>
-                                <br />
-                                {tableLevelIssues.length} critical table issue(s):
-                                <ul>
-                                  {tableLevelIssues.map((issue, i) =>
-                                    <li key={i}>{issue.fieldName}: {issue.description}</li>)}
-                                </ul>
-                              </small>
-                              : null
-                            }
-                          </td>
-                          <td>{this.isTableIncluded(table.id)}</td>
-                          <td>{this.tableRecordCount(table.id)}</td>
-                          <td>{issueCount}</td>
-                          <td />
-                        </tr>
-                      )
-                    })}
+                        </td>
+                        <td>{this.isTableIncluded(table.id)}</td>
+                        <td>{this.tableRecordCount(table.id)}</td>
+                        <td>{issueCount}</td>
+                        <td />
+                      </tr>
+                    )
+                  })}
                 </tbody>
               </Table>
             </Panel>