Added color to liked/disliked buttons and fixed issue with deleting queue items.

frontend/app/js/ducks/stationInfo.js

@@ -157,8 +157,10 @@ function reducer(state = initialState, action) {
 		userCount = action.station.userCount;
 
 		songList = fromJS(action.station.songList.map((song) => {
-			song.songId = song._id;
-			delete song._id;
+			if (!song.songId) {
+				song.songId = song._id;
+				delete song._id;
+			}
 			return song;
 		}));
 
@@ -205,8 +207,10 @@ function reducer(state = initialState, action) {
 		});
 	case QUEUE_INDEX:
 		songList = fromJS(action.songList.map((song) => {
-			song.songId = song._id;
-			delete song._id;
+			if (!song.songId) {
+				song.songId = song._id;
+				delete song._id;
+			}
 			return song;
 		}));
 
@@ -215,8 +219,10 @@ function reducer(state = initialState, action) {
 		});
 	case QUEUE_UPDATE:
 		songList = fromJS(action.songList.map((song) => {
-			song.songId = song._id;
-			delete song._id;
+			if (!song.songId) {
+				song.songId = song._id;
+				delete song._id;
+			}
 			return song;
 		}));
 

frontend/app/js/views/Station/Views/Queue/SongItem.jsx

@@ -9,8 +9,13 @@ import { connect } from "react-redux";
 import io from "io";
 
 @connect(state => ({
+	user: {
+		loggedIn: state.session.get("loggedIn"),
+		userId: state.session.get("userId"),
+		role: state.session.get("role"),
+	},
 	station: {
-		stationId: state.station.info.get("id"),
+		stationId: state.station.info.get("stationId"),
 		owner: state.station.info.get("ownerId"),
 	},
 }))
@@ -22,14 +27,14 @@ export default class SongItem extends Component {
 	deleteSong = (songId) => {
 		io.getSocket((socket) => {
 			socket.emit("stations.removeFromQueue", this.props.station.stationId, songId, (data) => {
-				if (data.status === "success") this.messages.clearAddSuccess("Successfully removed song.");
-				else this.messages.clearAddError("Failed to remove song.", data.message);
+				//if (data.status === "success") this.messages.clearAddSuccess("Successfully removed song.");
+				//else this.messages.clearAddError("Failed to remove song.", data.message);
 			});
 		});
 	};
 
 	isOwner = () => {
-		if (this.props.loggedIn) {
+		if (this.props.user.loggedIn) {
 			if (this.props.user.role === "admin") return true;
 			if (this.props.user.userId === this.props.station.owner) return true;
 		}
@@ -61,7 +66,7 @@ export default class SongItem extends Component {
 					}
 					{
 						(showDelete)
-						? <i onClick={ () => { this.deleteSong(song.get("songId")) } }>Delete</i>
+						? <i style={{ color: "black" }} onClick={ () => { this.deleteSong(song.get("songId")) } }>Delete</i>
 						: null
 					}
 				</div>

frontend/app/styles/station.scss

@@ -139,6 +139,14 @@ main#station {
 					margin-left: 24px;
 				}
 
+				.liked {
+					color: green;
+				}
+
+				.disliked {
+					color: red;
+				}
+
 				i {
 					font-size: 24px;
 					float: left;