From 2429a0d775b5033f2c20236646ba4321d7908751 Mon Sep 17 00:00:00 2001
From: Rodrigo Pedroso <>
Date: Tue, 25 Jun 2019 11:23:33 -0400
Subject: [PATCH] Clean up unused sagas

---
 src/components/App.jsx   |  8 +----
 src/components/Posts.jsx | 54 ++++++++++++++---------------
 src/sagas/api-saga.js    | 73 ++++++++++------------------------------
 3 files changed, 44 insertions(+), 91 deletions(-)

diff --git a/src/components/App.jsx b/src/components/App.jsx
index c7088cd..fbed8a6 100644
--- a/src/components/App.jsx
+++ b/src/components/App.jsx
@@ -1,5 +1,4 @@
 import React from 'react'
-import List from './List'
 import Form from './Form'
 import Post from './Posts'
 
@@ -8,12 +7,7 @@ export default function App() {
 		<div className = 'row mt-5'>
 
 			<div className = 'col-md-4 offset-md-1'>
-				<h2>Articles</h2>
-				<List />
-			</div>
-
-			<div className = 'col-md-4 offset-md-1'>
-				<h2>Add a new article</h2>
+				<h2>Choose a candidate</h2>
 				<Form />
 			</div>
 
diff --git a/src/components/Posts.jsx b/src/components/Posts.jsx
index 31e12d3..f8326e1 100644
--- a/src/components/Posts.jsx
+++ b/src/components/Posts.jsx
@@ -4,7 +4,7 @@ import { getHillaryData } from "../actions/index"
 import { getTrumpData } from "../actions/index"
 
 export function Post(props) {
-	let { articles, articlesTrump, articlesHillary, candidate, getHillaryData, getTrumpData } = props
+	let { articlesTrump, articlesHillary, candidate, getHillaryData, getTrumpData } = props
 
 	// Fetch tweets when user clicks on candidate's button
 	useEffect(() => {
@@ -21,41 +21,39 @@ export function Post(props) {
 	return (
 		<div>
 			<p>@{cand}</p>
-			<ul className="list-group list-group-flush">
-				{articles.map(el => (
-					<li className="list-group-item" key={el.id_str}>
-						<p>{el.created_at}</p>
-						<p>{el.text}</p>
-					</li>
-				))}
-			</ul>
 
-			<p>Hillary stream</p>
-			<ul className="list-group list-group-flush">
-				{articlesHillary.map(el => (
-					<li className="list-group-item" key={el.id_str}>
-						<p>{el.created_at}</p>
-						<p>{el.text}</p>
-					</li>
-				))}
-			</ul>
+			{cand === 'Hillary Clinton' && (
+				<div>
+					<ul className="list-group list-group-flush">
+						{articlesHillary.map(el => (
+							<li className="list-group-item" key={el.id_str}>
+								<p>{el.created_at}</p>
+								<p>{el.text}</p>
+							</li>
+						))}
+					</ul>
+				</div>
+			)}
+
+			{cand === 'Donald Trump' && (
+				<div>
+					<ul className="list-group list-group-flush">
+						{articlesTrump.map(el => (
+							<li className="list-group-item" key={el.id_str}>
+								<p>{el.created_at}</p>
+								<p>{el.text}</p>
+							</li>
+						))}
+					</ul>
+				</div>
+			)}
 
-			<p>Trump stream</p>
-			<ul className="list-group list-group-flush">
-				{articlesTrump.map(el => (
-					<li className="list-group-item" key={el.id_str}>
-						<p>{el.created_at}</p>
-						<p>{el.text}</p>
-					</li>
-				))}
-			</ul>
 		</div>
 	)
 }
 
 function mapStateToProps(state) {
 	return {
-		articles: state.remoteArticles.slice(0, 10),
 		articlesHillary: state.remoteArticlesHillary.slice(0, 10),
 		articlesTrump: state.remoteArticlesTrump.slice(0, 10),
 		candidate: state.candidate
diff --git a/src/sagas/api-saga.js b/src/sagas/api-saga.js
index 1274d23..1981b38 100644
--- a/src/sagas/api-saga.js
+++ b/src/sagas/api-saga.js
@@ -1,4 +1,4 @@
-import { takeEvery, call, put, all, take, actionChannel } from 'redux-saga/effects'
+import { takeEvery, call, put, all, take } from 'redux-saga/effects'
 import { eventChannel } from 'redux-saga'
 import openSocket from 'socket.io-client'
 
@@ -9,52 +9,23 @@ export default function* watcherSaga() {
 	])
 }
 
-// Hillary worker
-function* workerHillary() {
-	yield takeEvery('DATA_HILLARY_REQUESTED', workerHillarySaga)
-}
-
-function* workerHillarySaga() {
-	try {
-		const payload = yield call(getHillaryData)
-		yield put({ type: 'DATA_LOADED', payload })
-	} catch (e) {
-		yield put({ type: 'API_ERRORED', payload: e })
-	}
-}
-
-function getHillaryData() {
-	return fetch('http://localhost:3030/api/twitter?hashtag=Hillary%20Clinton')
-		.then(response => response.json())
-}
-
-// Trump worker
-function* workerTrump() {
-	yield takeEvery('DATA_TRUMP_REQUESTED', workerTrumpSaga) // listenServerSaga
-}
-
-function* workerTrumpSaga() {
-	try {
-		const payload = yield call(getTrumpData)
-		yield put({ type: 'DATA_LOADED', payload })
-	} catch (e) {
-		yield put({ type: 'API_ERRORED', payload: e })
-	}
-}
-
-function getTrumpData() {
-	socket.disconnect()
-	return fetch('http://localhost:3030/api/twitter?hashtag=Donald%20Trump')
-		.then(response => response.json())
-}
-
-
-
-// ---------- Stream ----------------
 const socketServerURL = 'http://localhost:3030'
 let socket
 
-// Hillary
+// Create channel
+const createSocketChannel = (socket, tweet)=> eventChannel((emit) => {
+	const handler = (data) => {
+		emit(data)
+	}
+	socket.on('tweet', handler);
+	return () => {
+		socket.off('tweet', handler)
+	}
+})
+
+
+// ----------- Hillary ------------
+
 function* workerHillaryStream() {
 	yield takeEvery('DATA_HILLARY_REQUESTED', listenHillarySaga)
 }
@@ -72,17 +43,6 @@ const connectHillary = () => {
 	})
 }
 
-// This is how a channel is created
-const createSocketChannel = (socket, tweet)=> eventChannel((emit) => {
-	const handler = (data) => {
-		emit(data)
-	};
-	socket.on('tweet', handler);
-	return () => {
-		socket.off('tweet', handler)
-	};
-});
-
 // saga that listens to the socket and puts the new data into the reducer
 const listenHillarySaga = function* () {
 	// connect to the server
@@ -98,7 +58,8 @@ const listenHillarySaga = function* () {
 	}
 }
 
-// Trump
+// ----------- Trump ------------
+
 function* workerTrumpStream() {
 	yield takeEvery('DATA_TRUMP_REQUESTED', listenTrumpSaga)
 }