Merge 4bd6f63 into 8b26bb6

.eslintrc.yml

@@ -11,40 +11,27 @@ globals:
   process: false  # allow webpack `process.env[*]` variables
 
 rules:
-  max-len: [warn, { code: 120 }]
-  # exceptions from eslint:recommended:
+  # Intentional exceptions to Airbnb rules:
+  no-alert: off  # currently used in the UI
+  no-plusplus: [error, allowForLoopAfterthoughts: true]
+  no-underscore-dangle: [error, allow: [__REDUX_DEVTOOLS_EXTENSION_COMPOSE__]]
   no-unused-vars: [error, argsIgnorePattern: "^_" ]
-  # exceptions from plugin:react/recommended:
-  react/no-find-dom-node: warn
-  react/prop-types: off           # TODO: #123
+  react/jsx-no-target-blank: off
 
-  # Airbnb style exceptions that we'll eventually fix:
-  import/prefer-default-export: warn
+  # Airbnb exceptions that we should fix:
+  no-console: off
   no-param-reassign: warn
   no-restricted-globals: warn
-  prefer-destructuring: warn
-  react/forbid-prop-types: warn
-  react/jsx-no-target-blank: warn
-  react/no-unused-state: warn
-  react/prefer-stateless-function: warn
+  react/no-find-dom-node: warn
+  react/prop-types: off           # TODO: #123
   react/require-default-props: warn
-  react/sort-comp: warn
-  no-console: off
-
-  # Intentional Airbnb exceptions:
-  no-alert: off  # currently used in the UI
-  no-plusplus: [error, allowForLoopAfterthoughts: true]
-  no-underscore-dangle: [error, allow: [__REDUX_DEVTOOLS_EXTENSION_COMPOSE__]]
 
   # TODO: #118 accessibility
   jsx-a11y/anchor-is-valid: off
   jsx-a11y/click-events-have-key-events: off
   jsx-a11y/label-has-for: off
   jsx-a11y/no-static-element-interactions: off
 
-  # Fixable exceptions to Airbnb style guide.
-  react/jsx-indent: off
-
 overrides:
   # server:
   - files: [ "index.html.js", "server.js", "webpack.config.js" ]
@@ -65,3 +52,6 @@ overrides:
   - files: [ "actions.js" ]
     rules:
       no-use-before-define: off
+  - files: [ "index.html.js" ]
+    rules:
+      max-len: off

src/__test__/__snapshots__/label-pane.test.jsx.snap

@@ -8,12 +8,14 @@ exports[`LabelPane matches snapshot 1`] = `
     type="text/css"
   >
     .label.label-label-1.selected{background-color:red}
-    .label.label-label-1.selected:not(.no-hover):hover{background-color:white;border-color:red;color:red}
-    .label.label-label-1:not(.selected){background-color:white;border-color:red;color:red}
+    .label.label-label-1.selected:not(.no-hover):hover,
+    .label.label-label-1:not(.selected)
+    {background-color:white;border-color:red;color:red}
     .label.label-label-1:not(.no-hover):hover{background-color:red;color:white}
     .label.label-label-2.selected{background-color:green}
-    .label.label-label-2.selected:not(.no-hover):hover{background-color:white;border-color:green;color:green}
-    .label.label-label-2:not(.selected){background-color:white;border-color:green;color:green}
+    .label.label-label-2.selected:not(.no-hover):hover,
+    .label.label-label-2:not(.selected)
+    {background-color:white;border-color:green;color:green}
     .label.label-label-2:not(.no-hover):hover{background-color:green;color:white}
   </style>
   <div
@@ -59,12 +61,14 @@ exports[`LabelPane not editable 1`] = `
     type="text/css"
   >
     .label.label-label-1.selected{background-color:red}
-    .label.label-label-1.selected:not(.no-hover):hover{background-color:white;border-color:red;color:red}
-    .label.label-label-1:not(.selected){background-color:white;border-color:red;color:red}
+    .label.label-label-1.selected:not(.no-hover):hover,
+    .label.label-label-1:not(.selected)
+    {background-color:white;border-color:red;color:red}
     .label.label-label-1:not(.no-hover):hover{background-color:red;color:white}
     .label.label-label-2.selected{background-color:green}
-    .label.label-label-2.selected:not(.no-hover):hover{background-color:white;border-color:green;color:green}
-    .label.label-label-2:not(.selected){background-color:white;border-color:green;color:green}
+    .label.label-label-2.selected:not(.no-hover):hover,
+    .label.label-label-2:not(.selected)
+    {background-color:white;border-color:green;color:green}
     .label.label-label-2:not(.no-hover):hover{background-color:green;color:white}
   </style>
   <div
@@ -106,24 +110,29 @@ exports[`LabelPane sorts labels 1`] = `
     type="text/css"
   >
     .label.label-id-0.selected{background-color:undefined}
-    .label.label-id-0.selected:not(.no-hover):hover{background-color:white;border-color:undefined;color:undefined}
-    .label.label-id-0:not(.selected){background-color:white;border-color:undefined;color:undefined}
+    .label.label-id-0.selected:not(.no-hover):hover,
+    .label.label-id-0:not(.selected)
+    {background-color:white;border-color:undefined;color:undefined}
     .label.label-id-0:not(.no-hover):hover{background-color:black;color:white}
     .label.label-id-4.selected{background-color:undefined}
-    .label.label-id-4.selected:not(.no-hover):hover{background-color:white;border-color:undefined;color:undefined}
-    .label.label-id-4:not(.selected){background-color:white;border-color:undefined;color:undefined}
+    .label.label-id-4.selected:not(.no-hover):hover,
+    .label.label-id-4:not(.selected)
+    {background-color:white;border-color:undefined;color:undefined}
     .label.label-id-4:not(.no-hover):hover{background-color:black;color:white}
     .label.label-id-3.selected{background-color:undefined}
-    .label.label-id-3.selected:not(.no-hover):hover{background-color:white;border-color:undefined;color:undefined}
-    .label.label-id-3:not(.selected){background-color:white;border-color:undefined;color:undefined}
+    .label.label-id-3.selected:not(.no-hover):hover,
+    .label.label-id-3:not(.selected)
+    {background-color:white;border-color:undefined;color:undefined}
     .label.label-id-3:not(.no-hover):hover{background-color:black;color:white}
     .label.label-id-2.selected{background-color:undefined}
-    .label.label-id-2.selected:not(.no-hover):hover{background-color:white;border-color:undefined;color:undefined}
-    .label.label-id-2:not(.selected){background-color:white;border-color:undefined;color:undefined}
+    .label.label-id-2.selected:not(.no-hover):hover,
+    .label.label-id-2:not(.selected)
+    {background-color:white;border-color:undefined;color:undefined}
     .label.label-id-2:not(.no-hover):hover{background-color:black;color:white}
     .label.label-id-1.selected{background-color:undefined}
-    .label.label-id-1.selected:not(.no-hover):hover{background-color:white;border-color:undefined;color:undefined}
-    .label.label-id-1:not(.selected){background-color:white;border-color:undefined;color:undefined}
+    .label.label-id-1.selected:not(.no-hover):hover,
+    .label.label-id-1:not(.selected)
+    {background-color:white;border-color:undefined;color:undefined}
     .label.label-id-1:not(.no-hover):hover{background-color:black;color:white}
   </style>
   <div
@@ -211,12 +220,14 @@ exports[`LabelPane with selected labels 1`] = `
     type="text/css"
   >
     .label.label-label-1.selected{background-color:red}
-    .label.label-label-1.selected:not(.no-hover):hover{background-color:white;border-color:red;color:red}
-    .label.label-label-1:not(.selected){background-color:white;border-color:red;color:red}
+    .label.label-label-1.selected:not(.no-hover):hover,
+    .label.label-label-1:not(.selected)
+    {background-color:white;border-color:red;color:red}
     .label.label-label-1:not(.no-hover):hover{background-color:red;color:white}
     .label.label-label-2.selected{background-color:green}
-    .label.label-label-2.selected:not(.no-hover):hover{background-color:white;border-color:green;color:green}
-    .label.label-label-2:not(.selected){background-color:white;border-color:green;color:green}
+    .label.label-label-2.selected:not(.no-hover):hover,
+    .label.label-label-2:not(.selected)
+    {background-color:white;border-color:green;color:green}
     .label.label-label-2:not(.no-hover):hover{background-color:green;color:white}
   </style>
   <div

src/__test__/auth.test.js

@@ -1,5 +1,6 @@
 import { removeOauthParams } from '../data/auth';
 
+/* eslint-disable max-len */
 describe('removeOauthParams', () => {
   test('removes parameters', () => {
     expect(removeOauthParams('http://localhost/path')).toEqual('http://localhost/path');

src/__test__/event_details-page.test.jsx → src/__test__/event-details-page.test.jsx

@@ -6,7 +6,8 @@ import EventDetailsPage from '../pages/details/event-details-page';
 describe('EventDetailsPage', () => {
   moment.tz.setDefault('EST');
   test('loading', () => {
-    const component = renderer.create(<EventDetailsPage eventData={null} setSidebarMode={() => undefined} />);
+    const jsx = <EventDetailsPage eventData={null} setSidebarMode={() => undefined} />;
+    const component = renderer.create(jsx);
     const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
@@ -19,7 +20,8 @@ describe('EventDetailsPage', () => {
       end: moment('2018-05-07T10:00:00-05:00'),
       allDay: false,
     };
-    const component = renderer.create(<EventDetailsPage eventData={event} setSidebarMode={() => undefined} />);
+    const jsx = <EventDetailsPage eventData={event} setSidebarMode={() => undefined} />;
+    const component = renderer.create(jsx);
     const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
@@ -32,7 +34,8 @@ describe('EventDetailsPage', () => {
       end: moment('2018-05-07T23:59:59-05:00'),
       allDay: true,
     };
-    const component = renderer.create(<EventDetailsPage eventData={event} setSidebarMode={() => undefined} />);
+    const jsx = <EventDetailsPage eventData={event} setSidebarMode={() => undefined} />;
+    const component = renderer.create(jsx);
     const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });
@@ -45,7 +48,8 @@ describe('EventDetailsPage', () => {
       end: moment('2018-05-08T23:59:59-05:00'),
       allDay: true,
     };
-    const component = renderer.create(<EventDetailsPage eventData={event} setSidebarMode={() => undefined} />);
+    const jsx = <EventDetailsPage eventData={event} setSidebarMode={() => undefined} />;
+    const component = renderer.create(jsx);
     const tree = component.toJSON();
     expect(tree).toMatchSnapshot();
   });

src/components/label-pane.jsx

@@ -63,8 +63,9 @@ export default class LabelPane extends React.Component {
       // snapshots.
       return [
         `${sel}.selected{background-color:${color}}`,
-        `${sel}.selected:not(.no-hover):hover{background-color:white;border-color:${color};color:${color}}`,
-        `${sel}:not(.selected){background-color:white;border-color:${color};color:${color}}`,
+        `${sel}.selected:not(.no-hover):hover,`,
+        `${sel}:not(.selected)`,
+        `{background-color:white;border-color:${color};color:${color}}`,
         `${sel}:not(.no-hover):hover{background-color:${color || 'black'};color:white}`,
       ].join('\n');
     }

src/components/material-button.jsx

@@ -1,5 +1,5 @@
-// This component is an add (+) button following the Material Design style, like the button to create an event in
-// Google Calendar
+// This component is an add (+) button following the Material Design style, like
+// the button to create an event in Google Calendar.
 
 import PropTypes from 'prop-types';
 import React, { Component } from 'react';

src/components/sidebar-header.jsx

@@ -2,7 +2,7 @@ import PropTypes from 'prop-types';
 import * as React from 'react';
 import OlinLogo from '../../assets/olin-logo-beta.svg';
 
-export const SidebarHeader = props => (
+const SidebarHeader = props => (
   <header className="header-content">
     <a onClick={props.homeClicked} alt="Home" title="Home">
       <OlinLogo className="olin-logo" />
@@ -14,3 +14,5 @@ export const SidebarHeader = props => (
 SidebarHeader.propTypes = {
   homeClicked: PropTypes.func.isRequired,
 };
+
+export default SidebarHeader;

src/containers/calendar-container.js

@@ -74,6 +74,7 @@ const mapDispatchToProps = dispatch => ({
 });
 
 // Connect props to Redux state and actions
-const CalendarContainer = connect(mapStateToProps, mapDispatchToProps)(withServerData(CalendarPage));
+const GuardedCalendarPage = withServerData(CalendarPage);
+const CalendarContainer = connect(mapStateToProps, mapDispatchToProps)(GuardedCalendarPage);
 
 export default CalendarContainer;

src/containers/import-container.js

@@ -1,4 +1,5 @@
-// This container is a sort of middleware between the React import component and the Redux data store
+// This container is a sort of middleware between the React import component and
+// the Redux data store
 
 import { connect } from 'react-redux';
 import * as ga from 'react-ga';

src/containers/labels-container.js

@@ -1,6 +1,11 @@
 import { connect } from 'react-redux';
 import LabelsPage from '../pages/labels/labels';
-import { refreshLabelsIfNeeded, setPageTitlePrefix, setSidebarMode, updateLabel } from '../data/actions';
+import {
+  refreshLabelsIfNeeded,
+  setPageTitlePrefix,
+  setSidebarMode,
+  updateLabel,
+} from '../data/actions';
 import SidebarModes from '../data/sidebar-modes';
 
 // Pass data from the Redux state to the React component

src/containers/subscription-container.js

@@ -1,12 +1,9 @@
-// This container is a sort of middleware between the React import component and the Redux data store
+// This container is a sort of middleware between the React import component and
+// the Redux data store
 
 import { connect } from 'react-redux';
 import * as ga from 'react-ga';
-import {
-  setSidebarMode,
-  toggleSidebarCollapsed,
-  setPageTitlePrefix,
-} from '../data/actions';
+import { setSidebarMode, toggleSidebarCollapsed, setPageTitlePrefix } from '../data/actions';
 import SubscriptionEditorPage from '../pages/subscription/subscription';
 
 // This function passes values/objects from the Redux state to the React component as props