add logger and formdata

src/container/fetchPage.js

@@ -6,7 +6,9 @@ import { takeInputValue, getWeather } from "../actions/weather";
 
 class FetchPage extends Component {
 	state = {
-		foo: 1
+		foo: 1,
+		files: null,
+		photo: null
 	};
 
 	add = () => this.setState(prevState => ({ foo: prevState.foo + 1 }));
@@ -21,9 +23,31 @@ class FetchPage extends Component {
 		getWeather(city);
 	};
 
+	change = e => {
+		const reader = new FileReader();
+
+		const file = e.target.files[0];
+
+		this.setState({ file });
+
+		reader.onloadend = () => {
+			this.setState({
+				photo: reader.result
+			});
+		};
+		reader.readAsDataURL(file);
+	};
+
+	post = () => {
+		const file = new FormData();
+
+		file.append("profilePhoto", this.state.file);
+	};
+
 	render() {
 		const { weather, error } = this.props;
-		// console.log("weather", weather);
+
+		const { photo } = this.state;
 		return (
 			<div className="page">
 				<input className="page__input page__input--blue" type="text" onChange={this.change} />
@@ -31,6 +55,12 @@ class FetchPage extends Component {
 					SHOW
 				</button>
 
+				<div>
+					<img src={photo} alt="asdfas" />
+					<input type="file" onChange={e => this.change(e)} />
+					<button onClick={this.post}>POST FILE</button>
+				</div>
+
 				<div>{weather && weather.location && weather.location.city}</div>
 				<div>{error && error}</div>
 

src/saga/loads/getLoads.js

@@ -13,6 +13,8 @@ export default function* getLoads({ payload }) {
 			}
 		});
 
+		// const data = yield call(() => fetch("https://dog.ceo/api/breeds/image/random").then(res => res.json()));
+
 		// const all = yield race({
 		// 	loads: call(),
 		// 	user: call()

src/state/state.js

@@ -8,10 +8,17 @@ import reducers from "../Reducers";
 
 const sagaMiddleware = createSagaMiddleware();
 
+const log = state => next => action => {
+	console.log("PrevState", state.getState());
+	next(action);
+	console.log("action", action);
+	console.log("nextState", state.getState());
+};
+
 export default createStore(
 	reducers,
 	// applyMiddleware(thunk, logger)
-	applyMiddleware(thunk, sagaMiddleware)
+	applyMiddleware(thunk, sagaMiddleware, log)
 );
 
 sagaMiddleware.run(saga);