Login checks working at login screen

app/actions/login.js

 import * as types from './actionTypes';
 
+const apiKey = 'AiYinaeng4juw1cae1eiLe2Adei2Ahbahda3AiRu';
+
 export function loginSuccess(username) {
   return {
     type: types.LOGINSUCCESS,
@@ -9,23 +11,31 @@ export function loginSuccess(username) {
 export function login(username, password) {
   return (dispatch) => {
     dispatch(loginProgress());
-    return fetch('https://thalia.nu/api/login', {
+    data = {
       method: 'POST',
-    })
+      headers: {
+        Accept: 'application/json',
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify({
+        apikey: apiKey,
+        username,
+        password,
+      }),
+    };
+    return fetch('http://localhost:8000/api/login', data)
       .then(
         response => response.json())
       .then(
         (responseJson) => {
-          console.log(responseJson);
-          if(password === '42'){
+          if (responseJson.status === 'ok') {
             console.log(responseJson);
-            return dispatch(loginSuccess(username))
-          }
-          else{
-            return dispatch(loginFailure());
+            return dispatch(loginSuccess(username));
           }
+
+          return dispatch(loginFailure());
         })
-      .catch(error => {
+      .catch((error) => {
         console.error(error);
         return dispatch(loginFailure());
       });
@@ -38,8 +48,8 @@ export function loginProgress() {
   };
 }
 
-export function loginFailure(){
-  return{
+export function loginFailure() {
+  return {
     type: types.LOGINFAILURE,
   };
 }

app/components/Login.js

@@ -14,7 +14,7 @@ class Login extends Component {
   }
 
   render() {
-    const { loginError, login } = this.props;
+    const { loginError, login, loginProgress, loggedIn } = this.props;
     return (
       <View>
         <TextInput
@@ -27,7 +27,7 @@ class Login extends Component {
           onChangeText={password => this.setState({ password })}
         />
         <Button title="Log in" onPress={() => login(this.state.username, this.state.password)} />
-        <Text>{ loginError ? 'Login faal' : '' }</Text>
+        <Text>{ loggedIn ? 'Logged in' : (loginProgress ? 'Logging in' : (loginError ? 'Loggin failed' : '')) }</Text>
       </View>
     );
   }

app/reducers/login.js

@@ -3,15 +3,18 @@ import * as types from '../actions/actionTypes';
 const initialState = {
   loggedIn: false,
   loginError: false,
+  loginProgress: false,
 };
 
 export default function login(state = initialState, action = {}) {
   switch (action.type) {
-    case types.LOGIN:
-      if (action.success) {
-        return { ...state, loginError: false, loggedIn: true };
-      }
-      return { ...state, loginError: true };
+    case types.LOGINSUCCESS:
+      return { ...state, loginProgress: false, loginError: false, loggedIn: true };
+      break;
+    case types.LOGINFAILURE:
+      return { ...state, loginProgress: false, loginError: true, loggedIn: false };
+    case types.LOGINPROGRESS:
+      return { ...state, loginProgress: true, logginError: false, loggedIn: false };
     default:
       return { ...state };
   }