Fix/console warnings (#9)

* Remove unused scripts from index.html - Remove ONS JS & Jquery * Fix key error in SummaryTable * Fix role in reducer and node server - Add 'role' back into login reducer - Fix role returns in utils/auth.js - Add role return into checkToken route in the node server * Fix console warnings - Unused imports etc. * Fix propTypes errors - Mostly related to the value prop * Fix propType errors for ShowConfetti * Add fix for IndustryCode inputs - Use encoded square brackets * Add fixes for industry code & refs bugs - Fix use of industry code conversion - Fix max number of refs not showing (bug in reduce function)
ONSdigital · Nov 14, 2017 · 00270e5 · 00270e5
1 parent a8a5bfc
commit 00270e5
Show file tree

Hide file tree

Showing 17 changed files with 38 additions and 27 deletions.
diff --git a/index.html b/index.html
@@ -21,7 +21,4 @@
       To create a production bundle, use `npm run build`.
     -->
   </body>
-  <script src="https://cdn.ons.gov.uk/sixteens/1f354a7/js/main.js"></script>
-  <!-- There is an error in the script above, r.doubleTapToGo is not a function -->  
-  <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
 </html>
diff --git a/server/app.js b/server/app.js
@@ -133,7 +133,11 @@ app.post('/checkToken', (req, res) => {
   if (sessions[accessToken]) {
     logger.info('Valid token');
     res.setHeader('Content-Type', 'application/json');
-    res.send(JSON.stringify({ username: sessions[accessToken].username, accessToken }));
+    res.send(JSON.stringify({
+      username: sessions[accessToken].username,
+      accessToken,
+      role: sessions[accessToken].role
+    }));
   } else {
     logger.info('Invalid token');
     res.sendStatus(401);

diff --git a/src/actions/LoginActions.js b/src/actions/LoginActions.js
@@ -104,6 +104,7 @@ export function checkAuth(username, token) {
         dispatch(setUserState({
           username: data.username,
           accessToken: data.newAccessToken,
+          role: data.role,
         }));
         sessionStorage.setItem('accessToken', data.newAccessToken);
       }

diff --git a/src/components/CheckBoxInput.js b/src/components/CheckBoxInput.js
@@ -16,7 +16,7 @@ CheckBoxInput.propTypes = {
   id: PropTypes.string.isRequired,
   label: PropTypes.string.isRequired,
   onChangeFilter: PropTypes.func.isRequired,
-  value: PropTypes.string.isRequired,
+  value: PropTypes.bool.isRequired,
 };
 
 export default CheckBoxInput;
diff --git a/src/components/ChildRefTable.js b/src/components/ChildRefTable.js
@@ -48,6 +48,9 @@ class ChildRefTable extends React.Component {
     this.setState({ error: false, errorMessage: '' });
   }
   render() {
+    const business = this.props.row.original;
+    const description = (industryCodeDescription[business.industryCode] === undefined)
+      ? 'No industry code description found' : industryCodeDescription[business.industryCode];
     return (
       <div style={{ padding: '20px' }}>
         <ReactTable
@@ -66,13 +69,13 @@ class ChildRefTable extends React.Component {
               accessor: 'payeRefs',
             },
           ]}
-          defaultPageSize={1}
+          pageSize={this.state.data.length}
           loading={this.state.isLoading}
           className="-striped -highlight"
           showPaginationTop={false}
           showPaginationBottom={false}
         />
-        <h3>Industry Code: {industryCodeDescription[this.state.data.industryCode]}</h3>
+        <h4>Industry Code [{business.industryCode}]: {description}</h4>
         <ErrorModal
           show={this.state.error}
           message={this.state.errorMessage}

diff --git a/src/components/Confetti.js b/src/components/Confetti.js
@@ -30,7 +30,7 @@ class ShowConfetti extends React.Component {
     return (
       <div>
         {(this.state.count < (this.props.seconds / 0.25) && this.props.showConfetti) &&
-          <Confetti opacity={this.state.opacity} width={`${window.innerWidth}px`} height={`${window.innerHeight}px`} />
+          <Confetti opacity={this.state.opacity} width={window.innerWidth-100} height={window.innerHeight} />
         }
       </div>
     );

diff --git a/src/components/RangeForm.js b/src/components/RangeForm.js
@@ -1,8 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { Button } from 'registers-react-library';
-import Select from 'react-select';
-import 'react-select/dist/react-select.min.css';
 import { employmentBands, legalStatusBands, turnoverBands, tradingStatusBands } from '../utils/convertBands';
 import TextInput from './TextInput';
 import CheckBoxInput from './CheckBoxInput';

diff --git a/src/components/SelectInput.js b/src/components/SelectInput.js
@@ -17,12 +17,16 @@ const SelectInput = ({ id, label, bands, onChange, value }) => {
   );
 };
 
+SelectInput.defaultProps = {
+  value: '',
+};
+
 SelectInput.propTypes = {
   id: PropTypes.string.isRequired,
   label: PropTypes.string.isRequired,
   onChange: PropTypes.func.isRequired,
   bands: PropTypes.object.isRequired,
-  value: PropTypes.string.isRequired,
+  value: PropTypes.string,
 };
 
 export default SelectInput;
diff --git a/src/components/SelectMultipleInput.js b/src/components/SelectMultipleInput.js
@@ -74,12 +74,16 @@ class SelectMultipleInput extends React.Component {
   }
 }
 
+SelectMultipleInput.defaultProps = {
+  value: undefined,
+};
+
 SelectMultipleInput.propTypes = {
   id: PropTypes.string.isRequired,
   label: PropTypes.string.isRequired,
   bands: PropTypes.object.isRequired,
   onChange: PropTypes.func.isRequired,
-  value: PropTypes.array.isRequired,
+  value: PropTypes.array,
 };
 
 export default SelectMultipleInput;
diff --git a/src/components/SummaryTable.js b/src/components/SummaryTable.js
@@ -9,7 +9,7 @@ const SummaryTable = ({ title, items }) => {
         {
           items.map((item) => {
             return (
-              <div className="summary__items">
+              <div key={item.key} className="summary__items">
                 <div className="summary__question" id="">
                   {item.key}
                 </div>

diff --git a/src/components/TextInput.js b/src/components/TextInput.js
@@ -21,14 +21,15 @@ class TextInput extends React.Component {
 
 TextInput.defaultProps = {
   autoFocus: false,
+  value: '',
 };
 
 TextInput.propTypes = {
   id: PropTypes.string.isRequired,
   label: PropTypes.string.isRequired,
   onChange: PropTypes.func.isRequired,
   autoFocus: PropTypes.bool.isRequired,
-  value: PropTypes.string.isRequired,
+  value: PropTypes.string,
 };
 
 export default TextInput;
diff --git a/src/components/TextInputInline.js b/src/components/TextInputInline.js
@@ -61,14 +61,18 @@ class TextInputInline extends React.Component {
   }
 }
 
+TextInputInline.defaultProps = {
+  value: undefined,
+};
+
 TextInputInline.propTypes = {
   onChange: PropTypes.func.isRequired,
   autoFocus: PropTypes.bool.isRequired,
   id: PropTypes.string.isRequired,
   label: PropTypes.string.isRequired,
   placeholderMin: PropTypes.string.isRequired,
   placeholderMax: PropTypes.string.isRequired,
-  value: PropTypes.arr,
+  value: PropTypes.array,
 };
 
 export default TextInputInline;
diff --git a/src/utils/auth.js b/src/utils/auth.js
@@ -1,7 +1,6 @@
 // @flow
 
 import config from '../config/api-urls';
-import base64 from 'base-64';
 
 const { AUTH_URL } = config;
 
@@ -35,10 +34,11 @@ const auth = {
           const loginName: string = json.username;
           const accessToken: string = json.accessToken;
           const showConfetti: string = json.showConfetti;
+          const role: string = json.role;
           // const role: string = json.role;
           // sessionStorage.setItem('token', token);
           // Send auth request to save token username pair
-          callback(true, { username: loginName, accessToken, showConfetti });
+          callback(true, { username: loginName, accessToken, showConfetti, role });
         });
       }
       return callback(false, { message: 'Unable to login.' });
@@ -59,9 +59,9 @@ const auth = {
         return response.json().then((json) => {
           const newAccessToken: string = json.accessToken;
           const username: string = json.username;
-          // const role: string = json.role;
+          const role: string = json.role;
           // Send auth request to save token username pair
-          callback(true, { username, newAccessToken });
+          callback(true, { username, newAccessToken, role });
         });
       }
       return callback(false);

diff --git a/src/utils/formQuery.js b/src/utils/formQuery.js
@@ -16,7 +16,7 @@ export function formRangeQuery(query) {
   const queryArr = Object.keys(query).map(param => {
     if (param === 'IndustryCode') {
       // ES format: IndustryCode:[${min} TO ${max}]
-      return `${param}${SEPERATOR}[${query[param][0]} TO ${query[param][1]}]`;
+      return `${param}${SEPERATOR}%5B1${query[param][0]} TO ${query[param][1]}%5D`;
     } else if (param === 'PostCode') {
       // ES format: PostCode:(${postCode})
       return `${param}${SEPERATOR}(${query[param]})`;

diff --git a/src/utils/helperMethods.js b/src/utils/helperMethods.js
@@ -64,13 +64,13 @@ export function getLegalStatusDescription(status: string) {
 }
 
 export function maxSize(...args) {
-  return args.reduce((a, b) => (a > b ? a.length : b.length), 0);
+  return args.reduce((a, b) => (b.length > a ? b.length : a), 0);
 }
 
 export function formatData(business: {}) {
   const largestRef = maxSize(business.vatRefs, business.payeRefs);
   const formattedData = [];
-  for (let i = 0; i <= largestRef; i += 1) {
+  for (let i = 0; i <= largestRef - 1; i += 1) {
     if (i === 0) {
       formattedData.push({
         companyNo: business.companyNo,

diff --git a/src/views/Match.js b/src/views/Match.js
@@ -2,8 +2,6 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { TitleAndDescription, BreadCrumb } from 'registers-react-library';
 import { connect } from 'react-redux';
-import ReactTable from 'react-table';
-import 'react-table/react-table.css';
 import { matchSearch, setQuery, setResults } from '../actions/ApiActions';
 import { SET_MATCH_QUERY, SET_MATCH_RESULTS } from '../constants/ApiConstants';
 import ErrorModal from '../components/ErrorModal';

diff --git a/src/views/UBRNLookup.js b/src/views/UBRNLookup.js
@@ -7,11 +7,8 @@ import { SET_UBRN_QUERY, SET_UBRN_RESULTS } from '../constants/ApiConstants';
 import ErrorModal from '../components/ErrorModal';
 import UBRNForm from '../components/UBRNForm';
 import { validateUBRNSearch } from '../utils/validation';
-import config from '../config/validation';
 import ResultsTable from '../components/ResultsTable';
 
-const { UBRN } = config;
-
 class UBRNLookup extends React.Component {
   constructor(props) {
     super(props);