codingnninja

function preprocessImage(canvas) {
    const ctx = canvas.getContext('2d');
    const image = ctx.getImageData(0,0,canvas.width, canvas.height);
    blurARGB(image.data, canvas, 1);
    dilate(image.data, canvas);
    invertColors(image.data);
    thresholdFilter(image.data, 0.4);
    return image;
}

codingnninja

import React from 'react';

class App extends React.Component {

  constructor() {
    super();
    this.state = {
      error: null,
      isLoaded: false,
      items: []

codingnninja

updateFoodItem(event) {
  event.preventDefault();
  const updatedFood = this.state.food;
  const updatedCost = this.state.cost;
  const updatedFoodItem = Object.assign({}, this.state.foodItem, { food: updatedFood, cost: updatedCost })
  const foodItems = this.state.foodItems.map((foodItem) => (foodItem.id === this.state.foodItem.id ? updatedFoodItem : foodItem));
  this.setState({ food:'', cost: '', foodItems: foodItems});
}

codingnninja

editFoodItem(foodItem) {
  this.setEditing(true);
  this.setState({
    food:foodItem.food,
    cost:foodItem.cost,
    foodItem: foodItem
  });
}

setEditing(value) {

codingnninja

boughtFoodItem(currentFoodItem) {
  const updatedCurrentFoodItem = Object.assign({}, currentFoodItem, { status: true });
  const foodItems = this.state.foodItems.map((foodItem, index) => (foodItem.id === currentFoodItem.id ? updatedCurrentFoodItem : foodItem));
  this.setState({foodItems: foodItems})
}

codingnninja

deleteFoodItem(id) {
  const foodItems = this.state.foodItems.filter( item => item.id !== id );
  this.setState({foodItems: foodItems});
}

codingnninja

render() {
    const { cost, food, foodItems, editing } = this.state;
      return (
        <div className="App">
          <div className="row App-main">
            <FoodItemList 
              foodItems= {foodItems} 
              deleteFoodItem={this.deleteFoodItem}
              boughtFoodItem={this.boughtFoodItem}
              editFoodItem={this.editFoodItem}

codingnninja

 addFoodItem(event){
    event.preventDefault()
    if (!this.state.food) return;
    const foodItem = {
      id: this.state.foodItems.length + 1,
      food: this.state.food,
      cost: this.state.cost,
      userId: this.state.userId,
      statu: this.state.status
    };

codingnninja

import React from 'react';
import FoodItemList from './FoodItemList';
import AddFoodItem from './AddFoodItem';
import './App.css';
import EditFoodItem from './EditFoodItem';
class App extends React.Component {

  constructor() {
    super();
    this.state = {

codingnninja

handleInputChange(event) {
  const target = event.target;
  const value = target.value;
  const name = target.name;
 
  this.setState({
    [name]:value
  })
}