Skip to content

Commit d5177a0

Browse files
goto-bus-stopgoto-bus-stop
committed
*: update style to conform to [email protected]
1 parent d1467f5 commit d5177a0

39 files changed

+202
-94
lines changed

‎.eslintrc

+4-12
Original file line numberDiff line numberDiff line change
@@ -9,20 +9,12 @@
99
"new-cap": [ "error", {
1010
"capIsNewExceptions": [ "DragDropContext", "DragSource", "DropTarget", "DragLayer", "ThemeDecorator" ]
1111
} ],
12-
// This rule is very heavy-handed and breaks a lot of places where we use
13-
// parentheses for readability, particularly in React components where
14-
// multiline JSX is surrounded by parens:
15-
//
16-
// return (
17-
// <Component>
18-
// stuff
19-
// </Component>
20-
// )
21-
"no-extra-parens": "off",
2212
// Conflicts with `_id` property names returned from the üWave HTTP API
2313
"no-underscore-dangle": "off",
2414
"global-require": "off",
25-
// Temporarily disabled, see https://github.com/benmosher/eslint-plugin-import/issues/317
26-
"import/no-mutable-exports": "off"
15+
"react/jsx-filename-extension": "off",
16+
// devDependencies are allowed in tests and build stuff. The eslintrc in
17+
// src/ disallows using devDependencies in client app code.
18+
"import/no-extraneous-dependencies": ["error", { "devDependencies": true }]
2719
}
2820
}

‎src/.eslintrc

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"rules": {
3+
"import/no-extraneous-dependencies": ["error", { "devDependencies": false }]
4+
},
5+
"env": {
6+
"browser": true
7+
}
8+
}

‎src/actions/BoothActionCreators.js

+4-1
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,10 @@ export function advance(nextBooth) {
3232
dispatch({
3333
type: ADVANCE,
3434
payload: {
35-
userID, historyID, playlistID, user,
35+
userID,
36+
historyID,
37+
playlistID,
38+
user,
3639
media: flattenPlaylistItem(media),
3740
timestamp: playedAt
3841
},

‎src/actions/ChatActionCreators.js

+3-1
Original file line numberDiff line numberDiff line change
@@ -210,7 +210,9 @@ export function muteUser(userID, { moderatorID, expiresAt }) {
210210
dispatch({
211211
type: MUTE_USER,
212212
payload: {
213-
userID, moderatorID, expiresAt,
213+
userID,
214+
moderatorID,
215+
expiresAt,
214216
expirationTimer: expireIn > 0 ?
215217
setTimeout(() => dispatch(expireMute(userID)), expireIn) : null
216218
}

‎src/actions/ErrorActionCreators.js

+1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { ERROR_DISMISS } from '../constants/actionTypes/errors';
22

3+
// eslint-disable-next-line import/prefer-default-export
34
export function dismiss() {
45
return { type: ERROR_DISMISS };
56
}

‎src/actions/PanelSelectActionCreators.js

+1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { SELECT_PANEL } from '../constants/actionTypes/panel';
22

3+
// eslint-disable-next-line import/prefer-default-export
34
export function selectPanel(name) {
45
return {
56
type: SELECT_PANEL,

‎src/components/Chat/Markup/Link.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ const Link = ({ text, href, ...props }) => (
66
href={href}
77
title={href}
88
target="_blank"
9-
rel="noreferrer"
9+
rel="noopener noreferrer"
1010
{...props}
1111
>
1212
{truncate(text, 60)}

‎src/components/Chat/index.js

+7-3
Original file line numberDiff line numberDiff line change
@@ -29,12 +29,12 @@ export default class Chat extends Component {
2929
}
3030

3131
scrollToBottom() {
32-
const el = this.refs.chat;
32+
const el = this.container;
3333
el.scrollTop = el.scrollHeight;
3434
}
3535

3636
isScrolledToBottom() {
37-
const el = this.refs.chat;
37+
const el = this.container;
3838
const lastMessage = el.lastElementChild;
3939
if (lastMessage) {
4040
const neededSize = el.scrollTop + el.offsetHeight + lastMessage.offsetHeight;
@@ -43,6 +43,10 @@ export default class Chat extends Component {
4343
return true;
4444
}
4545

46+
refContainer = container => {
47+
this.container = container;
48+
};
49+
4650
renderMotd() {
4751
if (!this.props.motd) {
4852
return null;
@@ -69,7 +73,7 @@ export default class Chat extends Component {
6973

7074
render() {
7175
return (
72-
<div className="Chat" ref="chat">
76+
<div className="Chat" ref={this.refContainer}>
7377
{this.renderMotd()}
7478
{this.props.messages.map(this.renderMessage, this)}
7579
</div>

‎src/components/Dialogs/EditMediaDialog/index.js

+31-9
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import cx from 'classnames';
22
import React, { Component, PropTypes } from 'react';
33
import Dialog from 'material-ui/Dialog';
4+
import uniqueId from 'lodash/uniqueId';
45

56
import ArtistIcon from 'material-ui/svg-icons/hardware/headset';
67
import TitleIcon from 'material-ui/svg-icons/image/music-note';
@@ -17,7 +18,7 @@ import TextField from '../../Form/TextField';
1718
// naive HH:mm:ss → seconds
1819
const parseDuration = str => str.split(':')
1920
.map(part => parseInt(part.trim(), 10))
20-
.reduce((duration, part) => duration * 60 + part, 0);
21+
.reduce((duration, part) => (duration * 60) + part, 0);
2122

2223
export default class EditMediaDialog extends Component {
2324
static propTypes = {
@@ -36,11 +37,14 @@ export default class EditMediaDialog extends Component {
3637
errors: null
3738
};
3839

40+
labelStart = uniqueId('editmedia');
41+
labelEnd = uniqueId('editmedia');
42+
3943
handleSubmit = e => {
4044
e.preventDefault();
4145

4246
const { media, onEditedMedia, onCloseDialog } = this.props;
43-
const { artist, title, start, end } = this.refs;
47+
const { artist, title, start, end } = this;
4448

4549
const startSeconds = parseDuration(start.value);
4650
const endSeconds = parseDuration(end.value);
@@ -71,6 +75,22 @@ export default class EditMediaDialog extends Component {
7175
onCloseDialog();
7276
};
7377

78+
refArtist = artist => {
79+
this.artist = artist;
80+
};
81+
82+
refTitle = title => {
83+
this.title = title;
84+
};
85+
86+
refStart = start => {
87+
this.start = start;
88+
};
89+
90+
refEnd = end => {
91+
this.end = end;
92+
};
93+
7494
render() {
7595
const {
7696
open,
@@ -89,7 +109,7 @@ export default class EditMediaDialog extends Component {
89109
if (open) {
90110
const artistInput = (
91111
<TextField
92-
ref="artist"
112+
ref={this.refArtist}
93113
className="EditMediaDialogGroup-field"
94114
placeholder="Artist"
95115
defaultValue={media.artist}
@@ -99,11 +119,11 @@ export default class EditMediaDialog extends Component {
99119
/>
100120
);
101121
const artistTitleLabel = (
102-
<label className="EditMediaDialogGroup-label">–</label>
122+
<div className="EditMediaDialogGroup-label">–</div>
103123
);
104124
const titleInput = (
105125
<TextField
106-
ref="title"
126+
ref={this.refTitle}
107127
className="EditMediaDialogGroup-field"
108128
placeholder="Title"
109129
defaultValue={media.title}
@@ -113,11 +133,12 @@ export default class EditMediaDialog extends Component {
113133
);
114134

115135
const fromLabel = (
116-
<label className="EditMediaDialogGroup-label">Play from:</label>
136+
<label htmlFor={this.labelStart} className="EditMediaDialogGroup-label">Play from:</label>
117137
);
118138
const fromInput = (
119139
<TextField
120-
ref="start"
140+
ref={this.refStart}
141+
id={this.labelStart}
121142
className="EditMediaDialogGroup-field"
122143
placeholder="0:00"
123144
defaultValue={formatDuration(media.start)}
@@ -126,11 +147,12 @@ export default class EditMediaDialog extends Component {
126147
/>
127148
);
128149
const toLabel = (
129-
<label className="EditMediaDialogGroup-label">to:</label>
150+
<label htmlFor={this.labelEnd} className="EditMediaDialogGroup-label">to:</label>
130151
);
131152
const toInput = (
132153
<TextField
133-
ref="end"
154+
ref={this.refEnd}
155+
id={this.labelEnd}
134156
className="EditMediaDialogGroup-field"
135157
placeholder={formatDuration(media.duration)}
136158
defaultValue={formatDuration(media.end)}

‎src/components/Dialogs/LoginDialog/LoginForm.js

+13-5
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react';
1+
import * as React from 'react';
22
import EmailIcon from 'material-ui/svg-icons/communication/email';
33
import PasswordIcon from 'material-ui/svg-icons/action/lock';
44
import Loader from '../../Loader';
@@ -23,11 +23,19 @@ export default class LoginForm extends React.Component {
2323
event.preventDefault();
2424
this.setState({ busy: true });
2525
this.props.onLogin({
26-
email: this.refs.email.value,
27-
password: this.refs.password.value
26+
email: this.email.value,
27+
password: this.password.value
2828
});
2929
};
3030

31+
refEmail = email => {
32+
this.email = email;
33+
};
34+
35+
refPassword = password => {
36+
this.password = password;
37+
};
38+
3139
render() {
3240
const { error } = this.props;
3341
const { busy } = this.state;
@@ -37,7 +45,7 @@ export default class LoginForm extends React.Component {
3745
{error && <FormGroup>{error.message}</FormGroup>}
3846
<FormGroup>
3947
<TextField
40-
ref="email"
48+
ref={this.refEmail}
4149
className="LoginForm-field"
4250
type="email"
4351
placeholder="E-Mail"
@@ -47,7 +55,7 @@ export default class LoginForm extends React.Component {
4755
</FormGroup>
4856
<FormGroup>
4957
<TextField
50-
ref="password"
58+
ref={this.refPassword}
5159
className="LoginForm-field"
5260
type="password"
5361
placeholder="Password"

‎src/components/Dialogs/LoginDialog/RegisterForm.js

+19-7
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react';
1+
import * as React from 'react';
22
import EmailIcon from 'material-ui/svg-icons/communication/email';
33
import PasswordIcon from 'material-ui/svg-icons/action/lock';
44
import UserIcon from 'material-ui/svg-icons/social/person';
@@ -33,9 +33,9 @@ export default class RegisterForm extends React.Component {
3333
event.preventDefault();
3434
this.setState({ busy: true });
3535
this.props.onRegister({
36-
username: this.refs.username.value,
37-
email: this.refs.email.value,
38-
password: this.refs.password.value,
36+
username: this.username.value,
37+
email: this.email.value,
38+
password: this.password.value,
3939
grecaptcha: this.state.captchaResponse
4040
});
4141
};
@@ -46,6 +46,18 @@ export default class RegisterForm extends React.Component {
4646
});
4747
};
4848

49+
refUsername = username => {
50+
this.username = username;
51+
};
52+
53+
refEmail = email => {
54+
this.email = email;
55+
};
56+
57+
refPassword = password => {
58+
this.password = password;
59+
};
60+
4961
renderCaptcha() {
5062
if (!this.props.useReCaptcha) {
5163
return null;
@@ -69,7 +81,7 @@ export default class RegisterForm extends React.Component {
6981
{error && <FormGroup>{error.message}</FormGroup>}
7082
<FormGroup>
7183
<TextField
72-
ref="username"
84+
ref={this.refUsername}
7385
className="RegisterForm-field"
7486
placeholder="Username"
7587
icon={<UserIcon color="#9f9d9e" />}
@@ -78,7 +90,7 @@ export default class RegisterForm extends React.Component {
7890
</FormGroup>
7991
<FormGroup>
8092
<TextField
81-
ref="email"
93+
ref={this.refEmail}
8294
className="RegisterForm-field"
8395
type="email"
8496
placeholder="E-Mail"
@@ -87,7 +99,7 @@ export default class RegisterForm extends React.Component {
8799
</FormGroup>
88100
<FormGroup>
89101
<TextField
90-
ref="password"
102+
ref={this.refPassword}
91103
className="RegisterForm-field"
92104
type="password"
93105
placeholder="Password"

‎src/components/Dialogs/PromptDialog/index.js

+6-2
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ export default class PromptDialog extends React.Component {
3838

3939
handleSubmit = event => {
4040
event.preventDefault();
41-
const promise = this.props.onSubmit(this.refs.input.value);
41+
const promise = this.props.onSubmit(this.input.value);
4242
if (promise && promise.then) {
4343
this.setState({ busy: true });
4444
const onDone = () => {
@@ -56,6 +56,10 @@ export default class PromptDialog extends React.Component {
5656
this.setState({ value: event.target.value });
5757
};
5858

59+
refInput = input => {
60+
this.input = input;
61+
};
62+
5963
render() {
6064
const {
6165
children,
@@ -88,7 +92,7 @@ export default class PromptDialog extends React.Component {
8892
{children}
8993
<FormGroup>
9094
<TextField
91-
ref="input"
95+
ref={this.refInput}
9296
autofocus
9397
type={inputType}
9498
placeholder={placeholder}

‎src/components/FooterBar/Responses/Favorite.js

+6-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import React, { Component, PropTypes } from 'react';
2-
import { findDOMNode } from 'react-dom';
32
import FavoritedIcon from 'material-ui/svg-icons/action/favorite';
43
import FavoriteIcon from 'material-ui/svg-icons/action/favorite-border';
54

@@ -17,7 +16,7 @@ export default class Favorite extends Component {
1716
};
1817

1918
position() {
20-
const pos = findDOMNode(this.refs.button).getBoundingClientRect();
19+
const pos = this.button.getBoundingClientRect();
2120
return {
2221
x: pos.left,
2322
y: pos.top
@@ -28,13 +27,17 @@ export default class Favorite extends Component {
2827
this.props.onFavorite(this.position());
2928
};
3029

30+
refButton = button => {
31+
this.button = button;
32+
};
33+
3134
render() {
3235
const { muiTheme } = this.context;
3336
const { active, count } = this.props;
3437
const CurrentIcon = active ? FavoritedIcon : FavoriteIcon;
3538
return (
3639
<Button
37-
ref="button"
40+
ref={this.refButton}
3841
tooltip="Favorite"
3942
onClick={this.handleFavorite}
4043
count={count}

0 commit comments

Comments
 (0)