From 2e90b8790a1cbdfd11d4fbd417737dda864d8449 Mon Sep 17 00:00:00 2001 From: Jhia Turner Date: Mon, 17 Sep 2018 22:21:47 -0400 Subject: [PATCH 1/3] fix airbnb linter issues --- client/src/ArtyomCommands.js | 40 ++--- client/src/components/AddRecipe.jsx | 195 ++++++++++++--------- client/src/components/App.jsx | 161 ++++++++--------- client/src/components/Commands.jsx | 39 +++-- client/src/components/EditDeleteRecipe.jsx | 118 ++++++------- client/src/components/KitchenAssistant.jsx | 21 +-- client/src/components/Recipe.jsx | 79 +++++---- client/src/components/Selection.jsx | 54 +++--- client/src/components/SignIn.jsx | 40 ++--- client/src/components/Steps.jsx | 71 ++++---- client/src/index.jsx | 4 +- database/index.js | 24 +-- database/sampleData.js | 33 ++-- package.json | 8 +- server/index.js | 58 +++--- util/sampleData.js | 18 +- 16 files changed, 495 insertions(+), 468 deletions(-) diff --git a/client/src/ArtyomCommands.js b/client/src/ArtyomCommands.js index 04370ca..6210ffc 100644 --- a/client/src/ArtyomCommands.js +++ b/client/src/ArtyomCommands.js @@ -1,74 +1,72 @@ // ArtyomCommands.js export default class ArtyomCommandsManager { constructor(ArtyomInstance) { - this._artyom = ArtyomInstance; + this.artyom = ArtyomInstance; } loadCommands(recipeInfo) { - let Artyom = this._artyom; - console.log('this is recipe info', recipeInfo); - console.log(recipeInfo.recipe) + const Artyom = this.artyom; return Artyom.addCommands([ { - indexes: ["What ingredients do I need?"], + indexes: ['what ingredients do I need?'], action: () => { Artyom.say(`You need ${recipeInfo.recipe.ingredients}`); - } + }, }, { - indexes: ["What is the prep time?"], + indexes: ['what is the prep time?'], action: () => { Artyom.say(`Prep time is ${recipeInfo.recipe.prepTime}`); - } + }, }, { - indexes: ["What is the cook time?"], + indexes: ['what is the cook time?'], action: () => { Artyom.say(`Cook time is ${recipeInfo.recipe.cookTime}`); - } + }, }, { - indexes: ["Thank you"], + indexes: ['thank you'], action: () => { - Artyom.say(`You're welcome`); + Artyom.say('You\'re welcome'); }, }, { - indexes: ['lets Begin'], + indexes: ['lets begin'], action: () => { Artyom.say(`Step ${recipeInfo.currentStep + 1 + ', ' + recipeInfo.recipe.steps[0]}`); - } + }, }, { indexes: ['what\'s next'], action: () => { recipeInfo.clickNext(); - } + }, }, { indexes: ['what\'s the previous step'], action: () => { recipeInfo.clickPrev(); - } + }, }, { indexes: ['what\'s the first step'], action: () => { recipeInfo.clickFirst(); - } + }, }, { indexes: ['take me to the last step'], action: () => { recipeInfo.clickLast(); - } + }, }, { - indexes: ['Return to recipe overview'], + indexes: ['return to recipe overview'], action: () => { recipeInfo.clickExit(); - } - } + }, + }, ]); } } diff --git a/client/src/components/AddRecipe.jsx b/client/src/components/AddRecipe.jsx index 3c96da6..69365ab 100644 --- a/client/src/components/AddRecipe.jsx +++ b/client/src/components/AddRecipe.jsx @@ -14,8 +14,7 @@ class AddRecipe extends React.Component { servings: '', ingredient: '', step: '', - servings: '', - } + }; this.setName = this.setName.bind(this); this.setIngredients = this.setIngredients.bind(this); this.setSteps = this.setSteps.bind(this); @@ -32,80 +31,79 @@ class AddRecipe extends React.Component { setName(e) { this.setState({ - name: e.target.value - }) + name: e.target.value, + }); } setCookTime(e) { this.setState({ - cookTime: e.target.value + cookTime: e.target.value, }); } setPrepTime(e) { this.setState({ - prepTime: e.target.value + prepTime: e.target.value, }); } setServings(e) { this.setState({ - servings: e.target.value - }) + servings: e.target.value, + }); } setIngredient(e) { this.setState({ - ingredient: e.target.value + ingredient: e.target.value, }); } setIngredients() { - this.setState({ - ingredients: [...this.state.ingredients, this.state.ingredient] - }) + ingredients: [...this.state.ingredients, this.state.ingredient], + }); $('#ingredientsField').val(''); } setStep(e) { this.setState({ - step: e.target.value + step: e.target.value, }); } setSteps() { this.setState({ - steps: [...this.state.steps, this.state.step] - }) + steps: [...this.state.steps, this.state.step], + }); $('#stepsField').val(''); } undoIngredients() { - let newIngredients = this.state.ingredients.slice(0, -1); + const newIngredients = this.state.ingredients.slice(0, -1); this.setState({ - ingredients: newIngredients - }) + ingredients: newIngredients, + }); } undoSteps() { - let newSteps = this.state.steps.slice(0, -1); + const newSteps = this.state.steps.slice(0, -1); this.setState({ - steps: newSteps - }) + steps: newSteps, + }); } submitRecipe() { if (this.state.name) { - let recipe = { + const recipe = { username: this.state.username, name: this.state.name, ingredients: this.state.ingredients, steps: this.state.steps, cookTime: this.state.cookTime, prepTime: this.state.prepTime, - servings: this.state.servings - } + servings: this.state.servings, + }; this.post('/recipe', recipe); } else { alert('Must fill out name form!'); @@ -113,80 +111,115 @@ class AddRecipe extends React.Component { } post(url, data) { - var context = this; + const context = this; // console.log('DATA GOING INTO SERVER:', data) $.ajax({ type: 'POST', - url: url, - data: data - }) - .done((data) => { - console.log(data) - context.props.changeView('selection'); - // console.log('POST Request: Successful'); - }) - .fail(() => { - console.log('POST Request: Failed'); + url, + data, }) + .done((returnedData) => { + console.log(returnedData); + context.props.changeView('selection'); + }) + .fail(() => { + console.log('POST Request: Failed'); + }); } render() { return (
-

Add a Recipe!

-
-
-
-
- Recipe Name: {this.setName(e)}}/>

- Cook Time: {this.setCookTime(e)}}/>

- Prep Time: {this.setPrepTime(e)}}/>

- Servings: {this.setServings(e)}}/>

- - Add Ingredient:

-

- - Add Steps:

-

- - +

+ Add a Recipe! +

+
+
+ +
+ Recipe Name: + { this.setName(e); }} /> +
+
+ Cook Time: + { this.setCookTime(e); }} /> +
+
+ Prep Time: + { this.setPrepTime(e); }} /> +
+
+ Servings: + { this.setServings(e); }} /> +
+
+ Add Ingredient: + +
+
+ +
+
+ Add Steps: + +
+
+ +
+
+
-
+
- Recipe Name: {this.state.name}

- Cook Time: {this.state.cookTime}

- Prep Time: {this.state.prepTime}

- Servings: {this.state.servings}

-
- Ingredients: -
    - {this.state.ingredients.map((ingredient, i) => { - return ( -
  • {ingredient}
    • - ) - })} -


-

-
-
- Steps: -
    - {this.state.steps.map((step, i) => { - return ( -
  1. {step}
    2. - ) - })} -


- + Recipe Name: + {this.state.name} +
+ Cook Time: + {this.state.cookTime} +
+ Prep Time: + {this.state.prepTime} +
+ Servings: + {this.state.servings} +
+
+ Ingredients: +
    + { + this.state.ingredients.map((ingredient, i) => ( +
  • + {ingredient} +
    • + )) + } +
+
+ +
+
+
+ Steps: +
    + {this.state.steps.map((step, i) => ( +
  1. {step}
    2. + ))} +
+
+ +
-
- ) + ); } } -export default AddRecipe; \ No newline at end of file +export default AddRecipe; diff --git a/client/src/components/App.jsx b/client/src/components/App.jsx index 1c4b354..1cefaa9 100644 --- a/client/src/components/App.jsx +++ b/client/src/components/App.jsx @@ -1,11 +1,9 @@ import React from 'react'; -import $ from 'jquery'; import AddRecipe from './AddRecipe.jsx'; import Recipe from './Recipe.jsx'; import Selection from './Selection.jsx'; import SignIn from './SignIn.jsx'; -import sample from '../../../util/sampleData.js' class App extends React.Component { constructor(props) { @@ -14,9 +12,8 @@ class App extends React.Component { this.state = { username: '', view: 'login', - recipeOTD: {}, recipe: {}, - recipes: [] + recipes: [], }; this.renderComponent = this.renderComponent.bind(this); @@ -25,86 +22,57 @@ class App extends React.Component { this.selectRecipe = this.selectRecipe.bind(this); this.handleSignIn = this.handleSignIn.bind(this); this.handleSignOut = this.handleSignOut.bind(this); - // this.manageIngredientsAndSteps = this.manageIngredientsAndSteps.bind(this); - // this.getRecipes = this.getRecipes.bind(this); } - changeView(view) { - this.setState({ - view: view - }); - this.render() - } setRecipes(data) { - let allRecipes = data.map((recipe) => { - // if (!recipe.ingredients) { - // recipe.ingredients = ''; - // } - // if (!recipe.steps) { - // recipe.steps = ''; - // } - let newRecipe = { + const allRecipes = data.map((recipe) => { + const newRecipe = { name: recipe.name, cookTime: recipe.cookTime, prepTime: recipe.prepTime, servings: recipe.servings, - ingredients: recipe.ingredients ? - recipe.ingredients : '', - steps: recipe.steps ? - recipe.steps : '' - } - return newRecipe - // return this.manageIngredientsAndSteps(recipe.ingredients, recipe.steps, newRecipe) - }) + ingredients: recipe.ingredients ? recipe.ingredients : '', + steps: recipe.steps ? recipe.steps : '', + }; + return newRecipe; + }); this.setState({ - recipes: allRecipes + recipes: allRecipes, }); } - // manageIngredientsAndSteps(ingredients, steps, newRecipe) { - // if (steps.split(',') && ingredients.split(',')) { - // newRecipe.ingredients = ingredients.split(','); - // newRecipe.steps = steps.split(','); - // } else if (steps.split(',')) { - // newRecipe.ingredients = ingredients; - // newRecipe.steps = steps.split(','); - // } else if (ingredients.split(',')) { - // newRecipe.ingredients = ingredients.split(','); - // newRecipe.steps = steps; - // } else { - // newRecipe.ingredients = ingredients; - // newRecipe.steps = steps; - // } - // return newRecipe; - // } + changeView(view) { + this.setState({ + view, + }); + this.render(); + } selectRecipe(recipe) { - console.log(recipe); this.setState({ - recipe: recipe + recipe, }); this.changeView('overview'); } handleSignIn(fullName) { this.setState({ - username: fullName - }) - this.changeView('selection') + username: fullName, + }); + this.changeView('selection'); } handleSignOut() { this.setState({ - username: '' - }) + username: '', + }); } signOut() { - var context = this; - var auth2 = gapi.auth2.getAuthInstance(); - auth2.signOut().then(function () { - console.log('User signed out.'); + const context = this; + const auth2 = gapi.auth2.getAuthInstance(); + auth2.signOut().then(() => { context.handleSignOut(); context.changeView('login'); }); @@ -112,38 +80,71 @@ class App extends React.Component { renderComponent() { if (this.state.view === 'overview') { - return - } else if (this.state.view === 'add') { - return - } else { - return + return ( + + ); + } + if (this.state.view === 'add') { + return ; } + return ( + + ); } render() { if (this.state.view === 'login') { return ( -
-

CookBük

-

The only sous chef you'll ever need

- -
- ) - } - return ( -
-

this.changeView('home')}>CookBük

- -
- {this.renderComponent()} -
+
+

+ CookBük +

+

+ The only sous chef you'll ever need +

+
); } + return ( +
+

this.changeView('home')}> + CookBük +

+ +
+ {this.renderComponent()} +
+
+ ); + } } -export default App; \ No newline at end of file +export default App; diff --git a/client/src/components/Commands.jsx b/client/src/components/Commands.jsx index f797774..41b8762 100644 --- a/client/src/components/Commands.jsx +++ b/client/src/components/Commands.jsx @@ -1,23 +1,30 @@ import React from 'react'; -const Commands = () => { - return ( +const Commands = () => (
-

Commands:

-
- Ingredients needed for the recipe: "What ingredients do I need?"
- Check the estimated prep time: "What is the prep time?"
- Check the estimated cook time: "What is the cook time?"
- Read the first step: "Lets begin."
- Go to the next step: "What's next?"
- Go to the previous step: "What's the previous step?"
- Go to the first step: "What's the first step?"
- Go to the last step: "Take me to the last step."
- Return to the overview of the recipe: "Return to recipe overview"
+

Commands:

+
+ Ingredients needed for the recipe: "What ingredients do I need?" +
+ Check the estimated prep time: "What is the prep time?" +
+ Check the estimated cook time: "What is the cook time?" +
+ Read the first step: "Lets begin." +
+ Go to the next step: "What's next?" +
+ Go to the previous step: "What's the previous step?" +
+ Go to the first step: "What's the first step?" +
+ Go to the last step: "Take me to the last step." +
+ Return to the overview of the recipe: "Return to recipe overview" +
- ) -} +); -export default Commands; \ No newline at end of file +export default Commands; diff --git a/client/src/components/EditDeleteRecipe.jsx b/client/src/components/EditDeleteRecipe.jsx index 597181f..1ae1695 100644 --- a/client/src/components/EditDeleteRecipe.jsx +++ b/client/src/components/EditDeleteRecipe.jsx @@ -8,11 +8,11 @@ class EditDeleteRecipe extends React.Component { this.state = { username: this.props.username, name: this.props.recipe.name, - ingredients: this.props.recipe.ingredients, - steps: this.props.recipe.steps, + ingredients: this.props.recipe.ingredients.join(','), + steps: this.props.recipe.steps.join(','), cookTime: this.props.recipe.cookTime, prepTime: this.props.recipe.prepTime, - servings: this.props.recipe.servings + servings: this.props.recipe.servings, }; this.nameHandler = this.nameHandler.bind(this); this.stepsHandler = this.stepsHandler.bind(this); @@ -25,97 +25,98 @@ class EditDeleteRecipe extends React.Component { this.updateRecipe = this.updateRecipe.bind(this); } - updateRecipe (targetRecipe, editedRecipe) { - var context = this; + updateRecipe(targetRecipe, editedRecipe) { + const context = this; $.ajax({ type: 'PUT', url: '/edit', - data: {name: targetRecipe, change: editedRecipe} - }) - .done((recipe) => { - context.props.selectRecipe(JSON.parse(recipe)[0]) - context.props.changeView('overview') - }) - .fail(() => { - console.log('PUT request failed') + data: { name: targetRecipe, change: editedRecipe }, }) + .done((recipe) => { + context.props.selectRecipe(JSON.parse(recipe)[0]); + context.props.changeView('overview'); + }) + .fail(() => { + console.log('PUT request failed'); + }); } - deleteRecipe (targetRecipe, username) { - var context = this; + deleteRecipe(targetRecipe, username) { + const context = this; $.ajax({ type: 'Delete', url: '/delete', - data: {name: targetRecipe, username: username} - }) - .done((data) => { - // console.log('DELETE request success') - // context.props.setRecipes(JSON.parse(data)) - context.props.changeAppView('') - }) - .fail(() => { - console.log('DELETE request failed') + data: { name: targetRecipe, username }, }) + .done(() => { + context.props.changeAppView(''); + }) + .fail(() => { + console.log('DELETE request failed'); + }); } - deleteHandler () { - var context = this; + deleteHandler() { if (confirm('Are you sure you want to delete this recipe?')) { this.deleteRecipe(this.props.recipe.name, this.state.username); console.log(`Deleted ${this.props.recipe.name}!`); - // context.props.changeView('login'); } } + submitClickHandler() { - if (this.state.name) { - this.updateRecipe(this.props.recipe.name, this.state); - // this.props.selectRecipe(this.props.recipe); - // this.props.changeView('') - } else { - alert('Must fill out name form!') - } + this.setState({ + ingredients: this.state.ingredients.split(','), + steps: this.state.steps.split(',') + }, () => { + console.log('Edited recipe: ', this.state); + if (this.state.name) { + this.updateRecipe(this.props.recipe.name, this.state); + } else { + alert('Must fill out name form!'); + } + }); } nameHandler(event) { this.setState({ - name: event - }) + name: event.target.value, + }); } ingredientsHandler(event) { this.setState({ - ingredients: event - }) + ingredients: event.target.value, + }); } prepTimeHandler(event) { this.setState({ - prepTime: event - }) + prepTime: event.target.value, + }); } servingsHandler(event) { this.setState({ - servings: event - }) + servings: event.target.value, + }); } stepsHandler(event) { this.setState({ - steps: event - }) + steps: event.target.value, + }); } cookTimeHandler(event) { this.setState({ - cookTime: event - }) + cookTime: event.target.value, + }); } handleCancelClick() { if (confirm('You will lose all unsubmitted changes. Do you wish to continue?')) { - this.setState(this.props.recipe) - this.props.changeView('') + this.setState(this.props.recipe); + this.props.changeView(''); } } @@ -124,33 +125,32 @@ class EditDeleteRecipe extends React.Component {

Shake Things Up!

- this.nameHandler(e.target.value)}value={this.state.name}/> + this.nameHandler(e)}value={this.state.name} />

Recipe Overview

This Recipe Includes...

-