Lint clean up

app/src/actions/stateActions.js

@@ -52,10 +52,10 @@ export const setAudioSuspended = ({ audioSuspended }) =>
 };
 
 export const setSettingsOpen = ({ settingsOpen }) =>
-({
-	type    : 'SET_SETTINGS_OPEN',
-	payload : { settingsOpen }
-});
+	({
+		type    : 'SET_SETTINGS_OPEN',
+		payload : { settingsOpen }
+	});
 
 export const setMe = ({ peerName, displayName, displayNameSet, device, loginEnabled }) =>
 {

app/src/components/Containers/HiddenPeers.js

@@ -30,7 +30,7 @@ const styles = () =>
 			fontSize           : '1.7vmin',
 			fontWeight         : 'bolder',
 			animation          : 'none',
-			'&.pulse' :
+			'&.pulse'          :
 			{
 				animation : 'pulse 0.5s'
 			}
@@ -91,7 +91,10 @@ class HiddenPeers extends React.PureComponent
 		} = this.props;
 
 		return (
-			<div className={classnames(classes.root, this.state.className)} onClick={() => openUsersTab()}>
+			<div
+				className={classnames(classes.root, this.state.className)}
+				onClick={() => openUsersTab()}
+			>
 				<p>+{hiddenPeersCount} <br /> participant
 					{(hiddenPeersCount === 1) ? null : 's'}
 				</p>

app/src/components/Containers/Me.js

@@ -34,20 +34,20 @@ const styles = () =>
 			},
 			'&.screen' :
 			{
-				order    : 1
+				order : 1
 			}
 		},
 		controls :
 		{
-			position       : 'absolute',
-			right          : 0,
-			top            : 0,
-			display        : 'flex',
-			flexDirection  : 'row',
-			padding        : '0.4vmin',
-			zIndex         : 20,
-			opacity        : 0,
-			transition     : 'opacity 0.3s',
+			position      : 'absolute',
+			right         : 0,
+			top           : 0,
+			display       : 'flex',
+			flexDirection : 'row',
+			padding       : '0.4vmin',
+			zIndex        : 20,
+			opacity       : 0,
+			transition    : 'opacity 0.3s',
 			'&.visible'   :
 			{
 				opacity : 1
@@ -62,7 +62,7 @@ const styles = () =>
 			width           : 'var(--media-control-button-size)',
 			height          : 'var(--media-control-button-size)',
 			backgroundColor : 'var(--media-control-button-color)',
-			'&:hover'    :
+			'&:hover'       :
 			{
 				opacity : 1
 			},

app/src/components/Containers/Peer.js

@@ -51,7 +51,7 @@ const styles = () =>
 			zIndex         : 20,
 			opacity        : 0,
 			transition     : 'opacity 0.3s',
-			'&.visible'   :
+			'&.visible'    :
 			{
 				opacity : 1
 			}
@@ -68,7 +68,7 @@ const styles = () =>
 			cursor             : 'pointer',
 			transitionProperty : 'opacity, background-color',
 			transitionDuration : '0.15s',
-			'&:hover' :
+			'&:hover'          :
 			{
 				opacity : 1
 			},

app/src/components/MeetingDrawer/Chat/ChatInput.js

@@ -41,14 +41,14 @@ class ChatInput extends React.PureComponent
 	}
 
 	createNewMessage = (text, sender, name, picture) =>
-	({
-		type : 'message',
-		text,
-		time : Date.now(),
-		name,
-		sender,
-		picture
-	});
+		({
+			type : 'message',
+			text,
+			time : Date.now(),
+			name,
+			sender,
+			picture
+		});
 
 	handleChange = (e) =>
 	{
@@ -121,10 +121,10 @@ ChatInput.propTypes =
 };
 
 const mapStateToProps = (state) =>
-({
-	displayName : state.me.displayName,
-	picture     : state.me.picture
-});
+	({
+		displayName : state.me.displayName,
+		picture     : state.me.picture
+	});
 
 export default withRoomContext(
 	connect(mapStateToProps)(withStyles(styles)(ChatInput))

app/src/components/MeetingDrawer/Chat/Message.js

@@ -26,7 +26,7 @@ const styles = (theme) =>
 		},
 		selfMessage :
 		{
-			marginLeft : 'auto',
+			marginLeft : 'auto'
 		},
 		remoteMessage :
 		{
@@ -48,7 +48,7 @@ const styles = (theme) =>
 			borderRadius : '50%',
 			height       : '2rem',
 			alignSelf    : 'center'
-		},
+		}
 	});
 
 const Message = (props) =>
@@ -88,12 +88,12 @@ const Message = (props) =>
 
 Message.propTypes =
 {
-	self      : PropTypes.bool,
-	picture   : PropTypes.string,
-	text      : PropTypes.string,
-	time      : PropTypes.string,
-	name      : PropTypes.string,
-	classes   : PropTypes.object.isRequired
+	self    : PropTypes.bool,
+	picture : PropTypes.string,
+	text    : PropTypes.string,
+	time    : PropTypes.string,
+	name    : PropTypes.string,
+	classes : PropTypes.object.isRequired
 };
 
 export default withStyles(styles)(Message);

app/src/components/MeetingDrawer/Chat/MessageList.js

@@ -35,6 +35,7 @@ class MessageList extends React.PureComponent
 	{
 		if (nextProps.chatmessages.length !== this.props.chatmessages.length)
 			return true;
+
 		return false;
 	}
 
@@ -55,6 +56,7 @@ class MessageList extends React.PureComponent
 	{
 		const {
 			chatmessages,
+			myPicture,
 			classes
 		} = this.props;
 	
@@ -66,7 +68,7 @@ class MessageList extends React.PureComponent
 						const messageTime = new Date(message.time);
 
 						const picture = (message.sender === 'response' ?
-							message.picture : this.props.myPicture) || EmptyAvatar;
+							message.picture : myPicture) || EmptyAvatar;
 
 						return (
 							<Message
@@ -88,12 +90,14 @@ class MessageList extends React.PureComponent
 MessageList.propTypes =
 {
 	chatmessages : PropTypes.array,
+	myPicture    : PropTypes.string,
 	classes      : PropTypes.object.isRequired
 };
 
 const mapStateToProps = (state) =>
-({
-	chatmessages : state.chatmessages
-});
+	({
+		chatmessages : state.chatmessages,
+		myPicture    : state.me.picture
+	});
 
 export default connect(mapStateToProps, null)(withStyles(styles)(MessageList));

app/src/components/MeetingDrawer/FileSharing/File.js

@@ -12,11 +12,11 @@ const styles = (theme) =>
 	({
 		root :
 		{
-			display        : 'flex',
-			alignItems     : 'center',
-			width          : '100%',
-			padding        : theme.spacing.unit,
-			boxShadow      : '0px 1px 5px 0px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 3px 1px -2px rgba(0, 0, 0, 0.12)',
+			display              : 'flex',
+			alignItems           : 'center',
+			width                : '100%',
+			padding              : theme.spacing.unit,
+			boxShadow            : '0px 1px 5px 0px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 3px 1px -2px rgba(0, 0, 0, 0.12)',
 			'&:not(:last-child)' :
 			{
 				marginBottom : theme.spacing.unit

app/src/components/MeetingDrawer/MeetingDrawer.js

@@ -57,16 +57,14 @@ class MeetingDrawer extends React.PureComponent
 						variant='fullWidth'
 					>
 						<Tab
-							label=
-							{
+							label={
 								<Badge color='secondary' badgeContent={unreadMessages}>
 									Chat
 								</Badge>
 							}
 						/>
 						<Tab
-							label=
-							{
+							label={
 								<Badge color='secondary' badgeContent={unreadFiles}>
 									File sharing
 								</Badge>
@@ -99,7 +97,7 @@ const mapStateToProps = (state) => ({
 });
 
 const mapDispatchToProps = {
-	setToolTab     : stateActions.setToolTab
+	setToolTab : stateActions.setToolTab
 };
 
 export default connect(

app/src/components/MeetingDrawer/ParticipantList/ListMe.js

@@ -11,11 +11,11 @@ const styles = () =>
 	({
 		root :
 		{
-			padding      : '0.5rem',
-			width        : '100%',
-			overflow     : 'hidden',
-			cursor       : 'auto',
-			display      : 'flex'
+			padding  : '0.5rem',
+			width    : '100%',
+			overflow : 'hidden',
+			cursor   : 'auto',
+			display  : 'flex'
 		},
 		listPeer :
 		{
@@ -68,7 +68,7 @@ const styles = () =>
 				backgroundImage : `url(${HandIcon})`,
 				opacity         : 1
 			}
-		},
+		}
 	});
 
 const ListMe = (props) =>

app/src/components/MeetingDrawer/ParticipantList/ListPeer.js

@@ -16,11 +16,11 @@ const styles = () =>
 	({
 		root :
 		{
-			padding      : '0.5rem',
-			width        : '100%',
-			overflow     : 'hidden',
-			cursor       : 'auto',
-			display      : 'flex'
+			padding  : '0.5rem',
+			width    : '100%',
+			overflow : 'hidden',
+			cursor   : 'auto',
+			display  : 'flex'
 		},
 		listPeer :
 		{

app/src/components/MeetingDrawer/ParticipantList/ParticipantList.js

@@ -36,7 +36,7 @@ const styles = (theme) =>
 			cursor       : 'pointer',
 			'&.selected' :
 			{
-				backgroundColor: 'rgba(55, 126, 255, 1)'
+				backgroundColor : 'rgba(55, 126, 255, 1)'
 			},
 			'&:not(:last-child)' :
 			{

app/src/components/MeetingViews/Democratic.js

@@ -11,7 +11,7 @@ import ResizeObserver from 'resize-observer-polyfill';
 const RATIO = 1.334;
 const PADDING = 100;
 
-const styles = (theme) =>
+const styles = () =>
 	({
 		root :
 		{
@@ -162,7 +162,7 @@ class Democratic extends React.PureComponent
 					}
 					else
 					{
-						return('');
+						return ('');
 					}
 				})}
 				{ spotlightsLength < Object.keys(peers).length ?

app/src/components/MeetingViews/Filmstrip.js

@@ -9,7 +9,7 @@ import { withRoomContext } from '../../RoomContext';
 import Peer from '../Containers/Peer';
 import HiddenPeers from '../Containers/HiddenPeers';
 
-const styles = (theme) =>
+const styles = () =>
 	({
 		root :
 		{
@@ -70,11 +70,11 @@ const styles = (theme) =>
 		},
 		filmContent :
 		{
-			height   : '100%',
-			width    : '100%',
-			border   : '1px solid rgba(255,255,255,0.15)',
-			maxWidth : 'calc(18vh * (4 / 3))',
-			cursor   : 'pointer',
+			height      : '100%',
+			width       : '100%',
+			border      : '1px solid rgba(255,255,255,0.15)',
+			maxWidth    : 'calc(18vh * (4 / 3))',
+			cursor      : 'pointer',
 			'& .screen' :
 			{
 				maxWidth : 'calc(18vh * (2 * 4 / 3))',

app/src/components/PeerAudio/AudioPeers.js

@@ -28,9 +28,9 @@ AudioPeers.propTypes =
 };
 
 const mapStateToProps = (state) =>
-({
-	peers : state.peers
-});
+	({
+		peers : state.peers
+	});
 
 const AudioPeersContainer = connect(
 	mapStateToProps

app/src/components/VideoContainers/PeerView.js

@@ -5,9 +5,9 @@ import { withStyles } from '@material-ui/core/styles';
 import * as appPropTypes from '../appPropTypes';
 import EditableInput from '../Controls/EditableInput';
 
-const styles = (theme) =>
+const styles = () =>
 	({
-		root:
+		root :
 		{
 			position           : 'relative',
 			flex               : '100 100 auto',
@@ -32,7 +32,7 @@ const styles = (theme) =>
 			transitionProperty : 'opacity',
 			transitionDuration : '.15s',
 			backgroundColor    : 'var(--peer-video-bg-color)',
-			'&.is-me' :
+			'&.is-me'          :
 			{
 				transform : 'scaleX(-1)'
 			},
@@ -71,11 +71,11 @@ const styles = (theme) =>
 			backgroundColor : 'rgba(0, 0, 0, 0.25)',
 			'& p'           :
 			{
-				userSelect     : 'none',
-				pointerEvents  : 'none',
-				margin         : 0,
-				color          : 'rgba(255, 255, 255, 0.7)',
-				fontSize       : 10,
+				userSelect    : 'none',
+				pointerEvents : 'none',
+				margin        : 0,
+				color         : 'rgba(255, 255, 255, 0.7)',
+				fontSize      : 10,
 
 				'&:last-child' :
 				{
@@ -108,24 +108,24 @@ const styles = (theme) =>
 		},
 		displayNameStatic :
 		{
-			userSelect         : 'none',
-			cursor             : 'text',
-			fontSize           : 14,
-			fontWeight         : 400,
-			color              : 'rgba(255, 255, 255, 0.85)',
-			'&:hover' :
+			userSelect : 'none',
+			cursor     : 'text',
+			fontSize   : 14,
+			fontWeight : 400,
+			color      : 'rgba(255, 255, 255, 0.85)',
+			'&:hover'  :
 			{
-				backgroundColor: 'rgb(174, 255, 0, 0.25)'
+				backgroundColor : 'rgb(174, 255, 0, 0.25)'
 			}
 		},
 		deviceInfo :
 		{
-			marginTop          : '0.4vmin',
-			display            : 'flex',
-			flexDirection      : 'row',
-			justifyContent     : 'flex-start',
-			alignItems         : 'flex-end',
-			'& span' :
+			marginTop      : '0.4vmin',
+			display        : 'flex',
+			flexDirection  : 'row',
+			justifyContent : 'flex-start',
+			alignItems     : 'flex-end',
+			'& span'       :
 			{
 				userSelect    : 'none',
 				pointerEvents : 'none',
@@ -143,7 +143,7 @@ const styles = (theme) =>
 			display        : 'flex',
 			flexDirection  : 'column',
 			justifyContent : 'center',
-			alignItems     : 'center',
+			alignItems     : 'center'
 		},
 		volumeBar :
 		{
@@ -157,52 +157,52 @@ const styles = (theme) =>
 				height          : 0,
 				backgroundColor : 'rgba(255, 255, 0, 0.65)'
 			},
-			'&.level1'         :
+			'&.level1' :
 			{
 				height          : '10%',
 				backgroundColor : 'rgba(255, 255, 0, 0.65)'
 			},
-			'&.level2'         :
+			'&.level2' :
 			{
 				height          : '20%',
 				backgroundColor : 'rgba(255, 255, 0, 0.65)'
 			},
-			'&.level3'         :
+			'&.level3' :
 			{
 				height          : '30%',
 				backgroundColor : 'rgba(255, 255, 0, 0.65)'
 			},
-			'&.level4'         :
+			'&.level4' :
 			{
 				height          : '40%',
 				backgroundColor : 'rgba(255, 165, 0, 0.65)'
 			},
-			'&.level5'         :
+			'&.level5' :
 			{
 				height          : '50%',
 				backgroundColor : 'rgba(255, 165, 0, 0.65)'
 			},
-			'&.level6'         :
+			'&.level6' :
 			{
 				height          : '60%',
 				backgroundColor : 'rgba(255, 0, 0, 0.65)'
 			},
-			'&.level7'         :
+			'&.level7' :
 			{
 				height          : '70%',
 				backgroundColor : 'rgba(255, 0, 0, 0.65)'
 			},
-			'&.level8'         :
+			'&.level8' :
 			{
 				height          : '80%',
 				backgroundColor : 'rgba(0, 0, 0, 0.65)'
 			},
-			'&.level9'         :
+			'&.level9' :
 			{
 				height          : '90%',
 				backgroundColor : 'rgba(0, 0, 0, 0.65)'
 			},
-			'&.level10'         :
+			'&.level10' :
 			{
 				height          : '100%',
 				backgroundColor : 'rgba(0, 0, 0, 0.65)'

app/src/components/VideoContainers/ScreenView.js

@@ -5,7 +5,7 @@ import { withStyles } from '@material-ui/core/styles';
 
 const styles = () =>
 	({
-		root:
+		root :
 		{
 			position           : 'relative',
 			flex               : '100 100 auto',
@@ -30,7 +30,7 @@ const styles = () =>
 			transitionProperty : 'opacity',
 			transitionDuration : '.15s',
 			backgroundColor    : 'var(--peer-video-bg-color)',
-			'&.is-me' :
+			'&.is-me'          :
 			{
 				transform : 'scaleX(-1)'
 			},
@@ -69,11 +69,11 @@ const styles = () =>
 			backgroundColor : 'rgba(0, 0, 0, 0.25)',
 			'& p'           :
 			{
-				userSelect     : 'none',
-				pointerEvents  : 'none',
-				margin         : 0,
-				color          : 'rgba(255, 255, 255, 0.7)',
-				fontSize       : 10,
+				userSelect    : 'none',
+				pointerEvents : 'none',
+				margin        : 0,
+				color         : 'rgba(255, 255, 255, 0.7)',
+				fontSize      : 10,
 
 				'&:last-child' :
 				{

app/src/index.js

@@ -59,9 +59,11 @@ function run()
 
 	const peerName = randomString({ length: 8 }).toLowerCase();
 	const urlParser = new UrlParse(window.location.href, true);
+
 	let roomId = (urlParser.pathname).substr(1)
 		? (urlParser.pathname).substr(1).toLowerCase() : urlParser.query.roomId.toLowerCase();
 	const produce = urlParser.query.produce !== 'false';
+
 	let displayName = urlParser.query.displayName;
 	const useSimulcast = urlParser.query.simulcast === 'true';
 
@@ -94,6 +96,7 @@ function run()
 
 	// Get displayName from cookie (if not already given as param).
 	const userCookie = cookiesManager.getUser() || {};
+
 	let displayNameSet;
 
 	if (!displayName)
@@ -116,7 +119,14 @@ function run()
 		stateActions.setRoomUrl(roomUrl));
 
 	store.dispatch(
-		stateActions.setMe({ peerName, displayName, displayNameSet, device, loginEnabled: window.config.loginEnabled }));
+		stateActions.setMe({
+			peerName,
+			displayName,
+			displayNameSet,
+			device,
+			loginEnabled : window.config.loginEnabled
+		})
+	);
 
 	roomClient = new RoomClient(
 		{ roomId, peerName, displayName, device, useSimulcast, produce });

app/src/serviceWorker.js

@@ -2,7 +2,7 @@ const isLocalhost = Boolean(
 	window.location.hostname === 'localhost' ||
 	window.location.hostname === '[::1]' ||
 	window.location.hostname.match(
-	/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
+		/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
 	)
 );
 
@@ -24,12 +24,7 @@ export function register(config)
 				checkValidServiceWorker(swUrl, config);
 
 				navigator.serviceWorker.ready.then(() =>
-				{
-					console.log(
-						'This web app is being served cache-first by a service ' +
-						'worker. To learn more, visit https://bit.ly/CRA-PWA'
-					);
-				});
+				{});
 			}
 			else
 			{
@@ -58,30 +53,17 @@ function registerValidSW(swUrl, config)
 					{
 						if (navigator.serviceWorker.controller)
 						{
-							console.log(
-								'New content is available and will be used when all ' +
-								'tabs for this page are closed. See https://bit.ly/CRA-PWA.'
-							);
-
 							if (config && config.onUpdate)
 								config.onUpdate(registration);
 						}
-						else
-						{
-							console.log('Content is cached for offline use.');
-
-							// Execute callback
-							if (config && config.onSuccess)
-								config.onSuccess(registration);
-						}
+						else if (config && config.onSuccess)
+							config.onSuccess(registration);
 					}
 				};
 			};
 		})
-		.catch((error) =>
-		{
-			console.error('Error during service worker registration:', error);
-		});
+		.catch(() =>
+		{});
 }
 
 function checkValidServiceWorker(swUrl, config)
@@ -90,6 +72,7 @@ function checkValidServiceWorker(swUrl, config)
 		.then((response) =>
 		{
 			const contentType = response.headers.get('content-type');
+
 			if (response.status === 404 ||
 				(contentType != null && contentType.indexOf('javascript') === -1))
 			{
@@ -107,11 +90,7 @@ function checkValidServiceWorker(swUrl, config)
 			}
 		})
 		.catch(() =>
-		{
-			console.log(
-				'No internet connection found. App is running in offline mode.'
-			);
-		});
+		{});
 }
 
 export function unregister()