import React from 'react';
import { connect } from "react-redux";

class NotesBody extends React.Component {
    render(){
        return(
            <ul>
                {
                    this.props.notes.map((note) => {
                        return <li key={note.id}>{note.noteContent}</li>
                    })
                }
            </ul>
        );
    }
}

function mapStateToProps(state){
    console.log("[STATE NOTESBODY]", state);

    return {
    notes: state.notes
    }
}

export default connect(mapStateToProps)(NotesBody);

import { createStore } from 'redux';
import { app } from '../config/config';

const initialState = {
    database: app.database().ref().child('notities'),
    notes: []
}

const reducer = (state = initialState, action) => {
    console.log("Reducer running", action.type);

    switch(action.type){
        default:
            break;

        case "DB_NOTE_ADDED":
            console.log("DB_NOTE_ADDED", action.payload.notes);
            state = {
                ...state,
                notes: action.payload.notes
            }
            break;
    }

    return state;
}

const store = createStore(reducer);

store.subscribe(() => {
    console.log("Store updated", store.getState());
});

export default store;

var previousNotes = [
    { id: "1", noteContent: "Hoi" }
];
store.dispatch({type: "DB_NOTE_ADDED", payload: { notes: previousNotes }})