Louiefigz

import React, { Component } from 'react';
import Band from './Band';


class Bands extends Component {
  render() {
    const bands = this.props.store.getState().bands.map((band, index) => {
      return <Band key={index} band={band} store={this.props.store} />
    })
    //See how we are passing in this.props.store

Louiefigz

import React, { Component } from 'react';



class BandInput extends Component{
  constructor(){
    super();
    this.state={
      text: ""
    }

Louiefigz

import React, { Component } from 'react';


class Band extends Component {

// When we are handing the click, we would ideally want to change our current
// state to remove this item.  We need to call our dispatch function and include a DELETE
// type so we can impliment logic later in our manageBand.js.  
  handleClick(e){
    e.preventDefault();

Louiefigz

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
// Require the Provider library from react-redux below.
import { Provider } from 'react-redux';

// createStore is replacing the manual createStore that we've created in the
// previous lab.
import { createStore } from 'redux';

Louiefigz

export default function manageTasks(state = {
  tasks: [],
}, action){
  switch (action.type) {

    case 'ADD_TASK':
      return Object.assign({}, state, {
        tasks: state.tasks.concat(action.task)
      });

Louiefigz

import React, { Component } from "react";



export default class UserInput extends Component {

  constructor(props) {
    super(props);

    this.state = {

Louiefigz

import React, { Component } from 'react';

// Must use connect() here because we have our App.js wrapped in a Provider.
// Once there's a change in the state, the Provider will re-render this component
// because it is a child of App.js
import { connect } from 'react-redux';

//Below we are exporting the Tasks class so that we can call it in our
//connect(), method on the bottom. 
 export class Tasks extends Component {

Louiefigz

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import { Provider } from 'react-redux';
import { createStore } from 'redux';

// Requiring the Reducer that we just made
import manageTasks from './reducers/manageTodo';

// set a store variable and then we are going to place it as a prop

Louiefigz

import React, { Component } from 'react';
//When we use export default on a component, we would import that component without
// curly braces like UserInput Below.
import UserInput from "./components/UserInput";
//When we export a component without default:
// example: export class Test extends Component
// We would need to specify the class or constant within {}.
// In this case, we are extracting Test which means it's being exported
// without default.
import { AllTasks } from './components/Tasks';

Louiefigz

import React, { Component } from "react";


 export default class UserInput extends Component {

  constructor(props) {
    super(props);

    this.state = {
      task: ''