{"action":"created","comment":{"url":"https://api.github.com/repos/LambdaSchool/React-Todo/pulls/comments/221436626","pull_request_review_id":160090120,"id":221436626,"node_id":"MDI0OlB1bGxSZXF1ZXN0UmV2aWV3Q29tbWVudDIyMTQzNjYyNg==","diff_hunk":"@@ -1,13 +1,139 @@\n-import React from 'react';\n+import React from \"react\";\n+import TodoList from \"../src/components/TodoComponents/TodoList\";\n+import TodoForm from \"../src/components/TodoComponents/TodoForm\";\n+import Img from '../src/components/TodoComponents/Img';\n+import Music from '../src/components/Music';\n \n class App extends React.Component {\n   // you will need a place to store your state in this component.\n   // design `App` to be the parent component of your application.\n   // this component is going to take care of state, and any change handlers you need to work with your state\n+  constructor() {\n+    super();\n+\n+    this.state = {\n+      play: false,\n+      pause: true,\n+      search: \"\",\n+      todo: \"\",\n+      todos: []\n+    };\n+  }\n+\n+  inputChange = event => {\n+    this.setState({\n+      todo: event.target.value\n+    });\n+\n+    localStorage.setItem('todo', JSON.stringify(event.target.value));\n+  };\n+\n+  addTodo = event => {\n+    event.preventDefault();\n+    this.setState({\n+        todos: [\n+          ...this.state.todos,\n+          {\n+            task: this.state.todo,\n+            id: Date.now(),\n+            completed: false\n+          }\n+        ],\n+        todo: \"\"\n+    });\n+    localStorage.setItem('todos', JSON.stringify(this.state.todos));\n+    localStorage.setItem('todo', '');\n+  };\n+\n+  clear = (event, todoComplete) => {\n+    event.preventDefault();\n+    const notDone = this.state.todos.filter(todo => todo.completed === false);\n+    console.log(notDone);\n+    this.setState({\n+      todos: notDone\n+    });\n+    localStorage.setItem('todos', JSON.stringify(notDone));\n+  };\n+\n+  clickHandler = todoId => {\n+    this.setState({\n+      todos: this.state.todos.map(todo => {\n+        if (todo.id === todoId) {\n+          return {\n+            task: todo.task,\n+            id: todo.id,\n+            completed: !todo.completed\n+          };\n+        } else {\n+          return todo;\n+        }\n+      })\n+    });\n+  };\n+\n+  searchFunc = (event) => {\n+    const match = this.state.todos.filter(todo => todo.task.includes(this.state.search) ? todo : null);\n+    console.log(match);\n+    this.setState({\n+      search: event.target.value,\n+      todos: match\n+    })\n+    console.log(this.state.todos);\n+  };\n+\n+  reload = () => {\n+    window.location.reload();\n+  };\n+\n+  play = () => {\n+  this.setState({ play: true, pause: false })\n+    this.audio.play();\n+  }\n+  \n+\n+  hydrateStateWithLocalStorage() {\n+    for (let key in this.state) {\n+      if (localStorage.hasOwnProperty(key)) {\n+        \n+        let value = localStorage.getItem(key);\n+        try {\n+          value = JSON.parse(value);\n+          this.setState({ [key]: value });\n+        } catch (e) {\n+          this.setState({ [key]: value });\n+        }\n+      }\n+    }\n+  };\n+\n+  componentDidMount() {\n+    this.hydrateStateWithLocalStorage();\n+    this.setState({\n+      todo: '',\n+    })\n+ };\n+\n   render() {\n+    this.url = \"http://66.90.93.122/ost/super-mario-world-original-soundtrack/wmaahzolgz/3%20-%20Map%202%20%28Overworld%29.mp3\";\n+    this.audio = new Audio(this.url);\n     return (\n       <div>\n-        <h2>Welcome to your Todo App!</h2>\n+        <Img />\n+        <div className={'container'}>\n+          <Music play={this.play} />\n+          <h1>Todo List:</h1>\n+          <TodoList todos={this.state.todos} clickHandler={this.clickHandler} />\n+          <TodoForm","path":"src/App.js","position":128,"original_position":128,"commit_id":"33f0b472fa5cff80e6560c10543dd406af02ee37","original_commit_id":"33f0b472fa5cff80e6560c10543dd406af02ee37","user":{"login":"juliankohlman","id":13293021,"node_id":"MDQ6VXNlcjEzMjkzMDIx","avatar_url":"https://avatars0.githubusercontent.com/u/13293021?v=4","gravatar_id":"","url":"https://api.github.com/users/juliankohlman","html_url":"https://github.com/juliankohlman","followers_url":"https://api.github.com/users/juliankohlman/followers","following_url":"https://api.github.com/users/juliankohlman/following{/other_user}","gists_url":"https://api.github.com/users/juliankohlman/gists{/gist_id}","starred_url":"https://api.github.com/users/juliankohlman/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/juliankohlman/subscriptions","organizations_url":"https://api.github.com/users/juliankohlman/orgs","repos_url":"https://api.github.com/users/juliankohlman/repos","events_url":"https://api.github.com/users/juliankohlman/events{/privacy}","received_events_url":"https://api.github.com/users/juliankohlman/received_events","type":"User","site_admin":false},"body":"Multiple props on separate lines look great and are easy to read 👍 ","created_at":"2018-09-29T18:47:04Z","updated_at":"2018-09-29T18:47:05Z","html_url":"https://github.com/LambdaSchool/React-Todo/pull/492#discussion_r221436626","pull_request_url":"https://api.github.com/repos/LambdaSchool/React-Todo/pulls/492","author_association":"NONE","_links":{"self":{"href":"https://api.github.com/repos/LambdaSchool/React-Todo/pulls/comments/221436626"},"html":{"href":"https://github.com/LambdaSchool/React-Todo/pull/492#discussion_r221436626"},"pull_request":{"href":"https://api.github.com/repos/LambdaSchool/React-Todo/pulls/492"}}},"pull_request":{"url":"https://api.github.com/repos/LambdaSchool/React-Todo/pulls/492","id":218122844,"node_id":"MDExOlB1bGxSZXF1ZXN0MjE4MTIyODQ0","html_url":"https://github.com/LambdaSchool/React-Todo/pull/492","diff_url":"https://github.com/LambdaSchool/React-Todo/pull/492.diff","patch_url":"https://github.com/LambdaSchool/React-Todo/pull/492.patch","issue_url":"https://api.github.com/repos/LambdaSchool/React-Todo/issues/492","number":492,"state":"open","locked":false,"title":"Angelina La Salle React-Todo","user":{"login":"alasalle","id":41298841,"node_id":"MDQ6VXNlcjQxMjk4ODQx","avatar_url":"https://avatars1.githubusercontent.com/u/41298841?v=4","gravatar_id":"","url":"https://api.github.com/users/alasalle","html_url":"https://github.com/alasalle","followers_url":"https://api.github.com/users/alasalle/followers","following_url":"https://api.github.com/users/alasalle/following{/other_user}","gists_url":"https://api.github.com/users/alasalle/gists{/gist_id}","starred_url":"https://api.github.com/users/alasalle/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/alasalle/subscriptions","organizations_url":"https://api.github.com/users/alasalle/orgs","repos_url":"https://api.github.com/users/alasalle/repos","events_url":"https://api.github.com/users/alasalle/events{/privacy}","received_events_url":"https://api.github.com/users/alasalle/received_events","type":"User","site_admin":false},"body":"@juliankohlman","created_at":"2018-09-25T21:19:40Z","updated_at":"2018-09-29T18:47:05Z","closed_at":null,"merged_at":null,"merge_commit_sha":"8ea58c9d028fdf38e314546f415081849a03492a","assignee":null,"assignees":[],"requested_reviewers":[],"requested_teams":[],"labels":[],"milestone":null,"commits_url":"https://api.github.com/repos/LambdaSchool/React-Todo/pulls/492/commits","review_comments_url":"https://api.github.com/repos/LambdaSchool/React-Todo/pulls/492/comments","review_comment_url":"https://api.github.com/repos/LambdaSchool/React-Todo/pulls/comments{/number}","comments_url":"https://api.github.com/repos/LambdaSchool/React-Todo/issues/492/comments","statuses_url":"https://api.github.com/repos/LambdaSchool/React-Todo/statuses/33f0b472fa5cff80e6560c10543dd406af02ee37","head":{"label":"alasalle:master","ref":"master","sha":"33f0b472fa5cff80e6560c10543dd406af02ee37","user":{"login":"alasalle","id":41298841,"node_id":"MDQ6VXNlcjQxMjk4ODQx","avatar_url":"https://avatars1.githubusercontent.com/u/41298841?v=4","gravatar_id":"","url":"https://api.github.com/users/alasalle","html_url":"https://github.com/alasalle","followers_url":"https://api.github.com/users/alasalle/followers","following_url":"https://api.github.com/users/alasalle/following{/other_user}","gists_url":"https://api.github.com/users/alasalle/gists{/gist_id}","starred_url":"https://api.github.com/users/alasalle/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/alasalle/subscriptions","organizations_url":"https://api.github.com/users/alasalle/orgs","repos_url":"https://api.github.com/users/alasalle/repos","events_url":"https://api.github.com/users/alasalle/events{/privacy}","received_events_url":"https://api.github.com/users/alasalle/received_events","type":"User","site_admin":false},"repo":{"id":150275424,"node_id":"MDEwOlJlcG9zaXRvcnkxNTAyNzU0MjQ=","name":"React-Todo","full_name":"alasalle/React-Todo","private":false,"owner":{"login":"alasalle","id":41298841,"node_id":"MDQ6VXNlcjQxMjk4ODQx","avatar_url":"https://avatars1.githubusercontent.com/u/41298841?v=4","gravatar_id":"","url":"https://api.github.com/users/alasalle","html_url":"https://github.com/alasalle","followers_url":"https://api.github.com/users/alasalle/followers","following_url":"https://api.github.com/users/alasalle/following{/other_user}","gists_url":"https://api.github.com/users/alasalle/gists{/gist_id}","starred_url":"https://api.github.com/users/alasalle/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/alasalle/subscriptions","organizations_url":"https://api.github.com/users/alasalle/orgs","repos_url":"https://api.github.com/users/alasalle/repos","events_url":"https://api.github.com/users/alasalle/events{/privacy}","received_events_url":"https://api.github.com/users/alasalle/received_events","type":"User","site_admin":false},"html_url":"https://github.com/alasalle/React-Todo","description":null,"fork":true,"url":"https://api.github.com/repos/alasalle/React-Todo","forks_url":"https://api.github.com/repos/alasalle/React-Todo/forks","keys_url":"https://api.github.com/repos/alasalle/React-Todo/keys{/key_id}","collaborators_url":"https://api.github.com/repos/alasalle/React-Todo/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/alasalle/React-Todo/teams","hooks_url":"https://api.github.com/repos/alasalle/React-Todo/hooks","issue_events_url":"https://api.github.com/repos/alasalle/React-Todo/issues/events{/number}","events_url":"https://api.github.com/repos/alasalle/React-Todo/events","assignees_url":"https://api.github.com/repos/alasalle/React-Todo/assignees{/user}","branches_url":"https://api.github.com/repos/alasalle/React-Todo/branches{/branch}","tags_url":"https://api.github.com/repos/alasalle/React-Todo/tags","blobs_url":"https://api.github.com/repos/alasalle/React-Todo/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/alasalle/React-Todo/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/alasalle/React-Todo/git/refs{/sha}","trees_url":"https://api.github.com/repos/alasalle/React-Todo/git/trees{/sha}","statuses_url":"https://api.github.com/repos/alasalle/React-Todo/statuses/{sha}","languages_url":"https://api.github.com/repos/alasalle/React-Todo/languages","stargazers_url":"https://api.github.com/repos/alasalle/React-Todo/stargazers","contributors_url":"https://api.github.com/repos/alasalle/React-Todo/contributors","subscribers_url":"https://api.github.com/repos/alasalle/React-Todo/subscribers","subscription_url":"https://api.github.com/repos/alasalle/React-Todo/subscription","commits_url":"https://api.github.com/repos/alasalle/React-Todo/commits{/sha}","git_commits_url":"https://api.github.com/repos/alasalle/React-Todo/git/commits{/sha}","comments_url":"https://api.github.com/repos/alasalle/React-Todo/comments{/number}","issue_comment_url":"https://api.github.com/repos/alasalle/React-Todo/issues/comments{/number}","contents_url":"https://api.github.com/repos/alasalle/React-Todo/contents/{+path}","compare_url":"https://api.github.com/repos/alasalle/React-Todo/compare/{base}...{head}","merges_url":"https://api.github.com/repos/alasalle/React-Todo/merges","archive_url":"https://api.github.com/repos/alasalle/React-Todo/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/alasalle/React-Todo/downloads","issues_url":"https://api.github.com/repos/alasalle/React-Todo/issues{/number}","pulls_url":"https://api.github.com/repos/alasalle/React-Todo/pulls{/number}","milestones_url":"https://api.github.com/repos/alasalle/React-Todo/milestones{/number}","notifications_url":"https://api.github.com/repos/alasalle/React-Todo/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/alasalle/React-Todo/labels{/name}","releases_url":"https://api.github.com/repos/alasalle/React-Todo/releases{/id}","deployments_url":"https://api.github.com/repos/alasalle/React-Todo/deployments","created_at":"2018-09-25T14:06:34Z","updated_at":"2018-09-29T05:13:04Z","pushed_at":"2018-09-29T05:13:02Z","git_url":"git://github.com/alasalle/React-Todo.git","ssh_url":"git@github.com:alasalle/React-Todo.git","clone_url":"https://github.com/alasalle/React-Todo.git","svn_url":"https://github.com/alasalle/React-Todo","homepage":null,"size":353,"stargazers_count":0,"watchers_count":0,"language":"JavaScript","has_issues":false,"has_projects":true,"has_downloads":true,"has_wiki":true,"has_pages":false,"forks_count":0,"mirror_url":null,"archived":false,"open_issues_count":0,"license":null,"forks":0,"open_issues":0,"watchers":0,"default_branch":"master"}},"base":{"label":"LambdaSchool:master","ref":"master","sha":"a1e7a54e8c69674d1e732e0445490d7bbba62fb2","user":{"login":"LambdaSchool","id":24780114,"node_id":"MDEyOk9yZ2FuaXphdGlvbjI0NzgwMTE0","avatar_url":"https://avatars1.githubusercontent.com/u/24780114?v=4","gravatar_id":"","url":"https://api.github.com/users/LambdaSchool","html_url":"https://github.com/LambdaSchool","followers_url":"https://api.github.com/users/LambdaSchool/followers","following_url":"https://api.github.com/users/LambdaSchool/following{/other_user}","gists_url":"https://api.github.com/users/LambdaSchool/gists{/gist_id}","starred_url":"https://api.github.com/users/LambdaSchool/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/LambdaSchool/subscriptions","organizations_url":"https://api.github.com/users/LambdaSchool/orgs","repos_url":"https://api.github.com/users/LambdaSchool/repos","events_url":"https://api.github.com/users/LambdaSchool/events{/privacy}","received_events_url":"https://api.github.com/users/LambdaSchool/received_events","type":"Organization","site_admin":false},"repo":{"id":97628204,"node_id":"MDEwOlJlcG9zaXRvcnk5NzYyODIwNA==","name":"React-Todo","full_name":"LambdaSchool/React-Todo","private":false,"owner":{"login":"LambdaSchool","id":24780114,"node_id":"MDEyOk9yZ2FuaXphdGlvbjI0NzgwMTE0","avatar_url":"https://avatars1.githubusercontent.com/u/24780114?v=4","gravatar_id":"","url":"https://api.github.com/users/LambdaSchool","html_url":"https://github.com/LambdaSchool","followers_url":"https://api.github.com/users/LambdaSchool/followers","following_url":"https://api.github.com/users/LambdaSchool/following{/other_user}","gists_url":"https://api.github.com/users/LambdaSchool/gists{/gist_id}","starred_url":"https://api.github.com/users/LambdaSchool/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/LambdaSchool/subscriptions","organizations_url":"https://api.github.com/users/LambdaSchool/orgs","repos_url":"https://api.github.com/users/LambdaSchool/repos","events_url":"https://api.github.com/users/LambdaSchool/events{/privacy}","received_events_url":"https://api.github.com/users/LambdaSchool/received_events","type":"Organization","site_admin":false},"html_url":"https://github.com/LambdaSchool/React-Todo","description":null,"fork":false,"url":"https://api.github.com/repos/LambdaSchool/React-Todo","forks_url":"https://api.github.com/repos/LambdaSchool/React-Todo/forks","keys_url":"https://api.github.com/repos/LambdaSchool/React-Todo/keys{/key_id}","collaborators_url":"https://api.github.com/repos/LambdaSchool/React-Todo/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/LambdaSchool/React-Todo/teams","hooks_url":"https://api.github.com/repos/LambdaSchool/React-Todo/hooks","issue_events_url":"https://api.github.com/repos/LambdaSchool/React-Todo/issues/events{/number}","events_url":"https://api.github.com/repos/LambdaSchool/React-Todo/events","assignees_url":"https://api.github.com/repos/LambdaSchool/React-Todo/assignees{/user}","branches_url":"https://api.github.com/repos/LambdaSchool/React-Todo/branches{/branch}","tags_url":"https://api.github.com/repos/LambdaSchool/React-Todo/tags","blobs_url":"https://api.github.com/repos/LambdaSchool/React-Todo/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/LambdaSchool/React-Todo/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/LambdaSchool/React-Todo/git/refs{/sha}","trees_url":"https://api.github.com/repos/LambdaSchool/React-Todo/git/trees{/sha}","statuses_url":"https://api.github.com/repos/LambdaSchool/React-Todo/statuses/{sha}","languages_url":"https://api.github.com/repos/LambdaSchool/React-Todo/languages","stargazers_url":"https://api.github.com/repos/LambdaSchool/React-Todo/stargazers","contributors_url":"https://api.github.com/repos/LambdaSchool/React-Todo/contributors","subscribers_url":"https://api.github.com/repos/LambdaSchool/React-Todo/subscribers","subscription_url":"https://api.github.com/repos/LambdaSchool/React-Todo/subscription","commits_url":"https://api.github.com/repos/LambdaSchool/React-Todo/commits{/sha}","git_commits_url":"https://api.github.com/repos/LambdaSchool/React-Todo/git/commits{/sha}","comments_url":"https://api.github.com/repos/LambdaSchool/React-Todo/comments{/number}","issue_comment_url":"https://api.github.com/repos/LambdaSchool/React-Todo/issues/comments{/number}","contents_url":"https://api.github.com/repos/LambdaSchool/React-Todo/contents/{+path}","compare_url":"https://api.github.com/repos/LambdaSchool/React-Todo/compare/{base}...{head}","merges_url":"https://api.github.com/repos/LambdaSchool/React-Todo/merges","archive_url":"https://api.github.com/repos/LambdaSchool/React-Todo/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/LambdaSchool/React-Todo/downloads","issues_url":"https://api.github.com/repos/LambdaSchool/React-Todo/issues{/number}","pulls_url":"https://api.github.com/repos/LambdaSchool/React-Todo/pulls{/number}","milestones_url":"https://api.github.com/repos/LambdaSchool/React-Todo/milestones{/number}","notifications_url":"https://api.github.com/repos/LambdaSchool/React-Todo/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/LambdaSchool/React-Todo/labels{/name}","releases_url":"https://api.github.com/repos/LambdaSchool/React-Todo/releases{/id}","deployments_url":"https://api.github.com/repos/LambdaSchool/React-Todo/deployments","created_at":"2017-07-18T17:57:38Z","updated_at":"2018-09-03T07:48:07Z","pushed_at":"2018-09-29T18:28:36Z","git_url":"git://github.com/LambdaSchool/React-Todo.git","ssh_url":"git@github.com:LambdaSchool/React-Todo.git","clone_url":"https://github.com/LambdaSchool/React-Todo.git","svn_url":"https://github.com/LambdaSchool/React-Todo","homepage":null,"size":338,"stargazers_count":6,"watchers_count":6,"language":"HTML","has_issues":true,"has_projects":true,"has_downloads":true,"has_wiki":true,"has_pages":false,"forks_count":636,"mirror_url":null,"archived":false,"open_issues_count":311,"license":null,"forks":636,"open_issues":311,"watchers":6,"default_branch":"master"}},"_links":{"self":{"href":"https://api.github.com/repos/LambdaSchool/React-Todo/pulls/492"},"html":{"href":"https://github.com/LambdaSchool/React-Todo/pull/492"},"issue":{"href":"https://api.github.com/repos/LambdaSchool/React-Todo/issues/492"},"comments":{"href":"https://api.github.com/repos/LambdaSchool/React-Todo/issues/492/comments"},"review_comments":{"href":"https://api.github.com/repos/LambdaSchool/React-Todo/pulls/492/comments"},"review_comment":{"href":"https://api.github.com/repos/LambdaSchool/React-Todo/pulls/comments{/number}"},"commits":{"href":"https://api.github.com/repos/LambdaSchool/React-Todo/pulls/492/commits"},"statuses":{"href":"https://api.github.com/repos/LambdaSchool/React-Todo/statuses/33f0b472fa5cff80e6560c10543dd406af02ee37"}},"author_association":"NONE"}}
{"actor":{"display_login":"juliankohlman"}}