+ )
+ }
+}
diff --git a/src/components/Login/LoginActions.js b/src/components/Login/LoginActions.js
new file mode 100644
index 0000000..3486766
--- /dev/null
+++ b/src/components/Login/LoginActions.js
@@ -0,0 +1,21 @@
+const axios = require('axios');
+
+export const updateUsername = (value) => ({
+ type: 'UPDATE_USERNAME',
+ payload: value,
+})
+
+export const updatePassword = (value) => ({
+ type: 'UPDATE_PASSWORD',
+ payload: value,
+})
+
+export const postLogin = (userData) => {
+ return {
+ type: 'POST_LOGIN',
+ payload: axios.post('api/users/login', userData)
+ .then(response => {
+ return response.data
+ })
+ }
+}
diff --git a/src/components/Login/LoginReducer.js b/src/components/Login/LoginReducer.js
new file mode 100644
index 0000000..31a8d72
--- /dev/null
+++ b/src/components/Login/LoginReducer.js
@@ -0,0 +1,39 @@
+const initialstate = {
+ username: '',
+ password: '',
+}
+
+export default function LoginReducer(state = initialstate, action) {
+ const { payload, type } = action;
+
+ switch (type) {
+ case 'UPDATE_USERNAME': {
+ return {
+ ...state,
+ username: payload
+ }
+ }
+ case 'UPDATE_PASSWORD': {
+ return {
+ ...state,
+ password: payload
+ }
+ }
+ case 'POST_LOGIN_REJECTED': {
+ return {
+ ...state,
+ error: payload
+ }
+ }
+ case 'POST_LOGIN_FULFILLED': {
+ return {
+ ...state,
+ token: payload.id,
+ userID: payload.userID
+ }
+ }
+ default: {
+ return state
+ }
+ }
+}
diff --git a/src/components/Login/index.js b/src/components/Login/index.js
new file mode 100644
index 0000000..74d724a
--- /dev/null
+++ b/src/components/Login/index.js
@@ -0,0 +1,13 @@
+import { connect } from 'react-redux';
+import Login from './Login';
+
+function mapStoreToProps(store) {
+ return {
+ username: store.Login.username,
+ password: store.Login.password,
+ token: store.Login.token,
+ userID: store.Login.userID
+ };
+}
+
+export default connect(mapStoreToProps)(Login);
diff --git a/src/components/Room/Room.jsx b/src/components/Room/Room.jsx
new file mode 100644
index 0000000..d7e18d0
--- /dev/null
+++ b/src/components/Room/Room.jsx
@@ -0,0 +1,30 @@
+import React, { Component } from 'react';
+import HomePage from '../HomePage/index';
+import { withRouter } from 'react-router';
+import { updateSongs } from '../SongQueue/SQueueActions';
+import io from 'socket.io-client';
+const socket = io();
+
+class Room extends Component {
+ constructor(props) {
+ super(props);
+ const { dispatch ,match: { params } } = this.props;
+
+ socket.on('connect', () => {
+ socket.emit('room', params.queueId)
+ })
+ socket.on('update', (tracks) => {
+ dispatch(updateSongs(tracks));
+ });
+ }
+
+ render() {
+ return (
+
+
+
+
+
+
+
+
+ {(this.props.data) &&
+ this.props.data.map((listItem, index) => {
+ return
+
+ Artist: {listItem.artist}
+
+
+ Song: {listItem.name}
+
+
+
+
+ })
+ }
+
+
+ 
-