diff --git a/src/features/network/components/NetworkContainer.js b/src/features/network/components/NetworkContainer.js index 6cf0ba4..7d33f64 100644 --- a/src/features/network/components/NetworkContainer.js +++ b/src/features/network/components/NetworkContainer.js @@ -1,7 +1,29 @@ -import React from "react"; +import React, { useContext } from "react"; +import { TextField } from "@material-ui/core"; +import { + ApplicationStateContext, + ApplicationDispatchContext +} from "../../../state/ApplicationContexts"; const NetworkContainer = () => { - return
NetworkContainer
; + const state = useContext(ApplicationStateContext); + const dispatchActions = useContext(ApplicationDispatchContext); + + const handleChange = prop => event => { + dispatchActions.onNetworkChange(prop, event.target.value); + }; + + return ( + <> +
NetworkContainer
+ + + ); }; export default NetworkContainer; diff --git a/src/state/initialState.js b/src/state/initialState.js index c972c2c..754d0e3 100644 --- a/src/state/initialState.js +++ b/src/state/initialState.js @@ -2,5 +2,8 @@ export const initialState = { credentials: { userName: "", password: "" + }, + network: { + test: "" } }; diff --git a/src/state/reducer.js b/src/state/reducer.js index ea883da..2462eda 100644 --- a/src/state/reducer.js +++ b/src/state/reducer.js @@ -10,6 +10,16 @@ export function reducer(state, action) { } }; } + case "onNetworkChange": { + const { prop, value } = action.payload; + return { + ...state, + network: { + ...state.network, + [prop]: value + } + }; + } default: { return state; } @@ -18,5 +28,7 @@ export function reducer(state, action) { export const dispatchActions = dispatch => ({ onCredentialsChange: (prop, value) => - dispatch({ type: "onCredentialsChange", payload: { prop, value } }) + dispatch({ type: "onCredentialsChange", payload: { prop, value } }), + onNetworkChange: (prop, value) => + dispatch({ type: "onNetworkChange", payload: { prop, value } }) });