{"action":"created","comment":{"url":"https://api.github.com/repos/Yoast/yoast-components/pulls/comments/185195033","pull_request_review_id":116528865,"id":185195033,"diff_hunk":"@@ -0,0 +1,126 @@\n+import React from \"react\";\n+import { FormattedMessage } from \"react-intl\";\n+import styled from \"styled-components\";\n+import colors from \"../../../../style-guide/colors.json\";\n+import PropTypes from \"prop-types\";\n+\n+let KeywordField = styled.input`\n+\tmargin-right: 0.5em;\n+\tborder-color: ${ props => props.borderColor };\n+`;\n+\n+const ErrorText = styled.div`\n+\tfont-size: 1em;\n+\tcolor: ${ colors.$color_red};\n+\tmargin: 1em 0;\n+\tmin-height: 1.8em;\n+`;\n+\n+class KeywordInput extends React.Component {\n+\t/**\n+\t * Constructs a KeywordInput component\n+\t *\n+\t * @param {Object} props The props for this input field component.\n+\t *\n+\t * @returns {void}\n+\t */\n+\tconstructor( props ) {\n+\t\tsuper( props );\n+\n+\t\tthis.state = {\n+\t\t\tshowErrorMessage: false,\n+\t\t\tkeyword: props.keyword,\n+\t\t};\n+\t}\n+\n+\t/**\n+\t * Checks the keyword input for comma-separated words\n+\t *\n+\t * @param {String} keywordText The text of the input\n+\t *\n+\t * @returns {void}\n+\t */\n+\tcheckKeywordInput( keywordText ) {\n+\t\tlet separatedWords = keywordText.split( \",\" );\n+\t\tif ( separatedWords.length > 1 ) {\n+\t\t\tthis.setState( { showErrorMessage: true } );\n+\t\t} else {\n+\t\t\tthis.setState( { showErrorMessage: false } );\n+\t\t}\n+\t}\n+\n+\t/**\n+\t * Displays the error message\n+\t *\n+\t * @param {String} input \t\t The text of the input\n+\t *\n+\t * @returns {Element} ErrorText  The error message element\n+\t */\n+\tdisplayErrorMessage( input = \"\" ) {\n+\t\tif ( this.state.showErrorMessage && input !== \"\" ) {\n+\t\t\treturn (\n+\t\t\t\t<ErrorText>\n+\t\t\t\t\t<FormattedMessage","path":"composites/Plugin/Shared/components/KeywordInput.js","position":63,"original_position":63,"commit_id":"2f4aef4f434dbbaae1070eac22f458cefa1b6865","original_commit_id":"2f4aef4f434dbbaae1070eac22f458cefa1b6865","user":{"login":"igorschoester","id":35524806,"avatar_url":"https://avatars1.githubusercontent.com/u/35524806?v=4","gravatar_id":"","url":"https://api.github.com/users/igorschoester","html_url":"https://github.com/igorschoester","followers_url":"https://api.github.com/users/igorschoester/followers","following_url":"https://api.github.com/users/igorschoester/following{/other_user}","gists_url":"https://api.github.com/users/igorschoester/gists{/gist_id}","starred_url":"https://api.github.com/users/igorschoester/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/igorschoester/subscriptions","organizations_url":"https://api.github.com/users/igorschoester/orgs","repos_url":"https://api.github.com/users/igorschoester/repos","events_url":"https://api.github.com/users/igorschoester/events{/privacy}","received_events_url":"https://api.github.com/users/igorschoester/received_events","type":"User","site_admin":false},"body":"After confirming with @IreneStr, we will no longer be using `react-intl` in the future. Since you are explicitly adding the `enzyme-react-intl` package to test this and we might forget to remove this later. Please remove this component and test package (but still use `role=\"alert\"` of course!).","created_at":"2018-05-01T09:52:31Z","updated_at":"2018-05-01T09:54:52Z","html_url":"https://github.com/Yoast/yoast-components/pull/482#discussion_r185195033","pull_request_url":"https://api.github.com/repos/Yoast/yoast-components/pulls/482","author_association":"CONTRIBUTOR","_links":{"self":{"href":"https://api.github.com/repos/Yoast/yoast-components/pulls/comments/185195033"},"html":{"href":"https://github.com/Yoast/yoast-components/pull/482#discussion_r185195033"},"pull_request":{"href":"https://api.github.com/repos/Yoast/yoast-components/pulls/482"}}},"pull_request":{"url":"https://api.github.com/repos/Yoast/yoast-components/pulls/482","id":184957663,"html_url":"https://github.com/Yoast/yoast-components/pull/482","diff_url":"https://github.com/Yoast/yoast-components/pull/482.diff","patch_url":"https://github.com/Yoast/yoast-components/pull/482.patch","issue_url":"https://api.github.com/repos/Yoast/yoast-components/issues/482","number":482,"state":"open","locked":false,"title":"Implement input field component for keyword","user":{"login":"danielFangstrom","id":7872022,"avatar_url":"https://avatars3.githubusercontent.com/u/7872022?v=4","gravatar_id":"","url":"https://api.github.com/users/danielFangstrom","html_url":"https://github.com/danielFangstrom","followers_url":"https://api.github.com/users/danielFangstrom/followers","following_url":"https://api.github.com/users/danielFangstrom/following{/other_user}","gists_url":"https://api.github.com/users/danielFangstrom/gists{/gist_id}","starred_url":"https://api.github.com/users/danielFangstrom/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/danielFangstrom/subscriptions","organizations_url":"https://api.github.com/users/danielFangstrom/orgs","repos_url":"https://api.github.com/users/danielFangstrom/repos","events_url":"https://api.github.com/users/danielFangstrom/events{/privacy}","received_events_url":"https://api.github.com/users/danielFangstrom/received_events","type":"User","site_admin":false},"body":"## Summary\r\n\r\nThis PR can be summarized in the following changelog entry:\r\n\r\n* Adds a keyword input field component \r\n\r\n## Relevant technical choices:\r\n\r\n* Checks the keyword input and displays an error text under the field in case it finds comma separated words\r\n* Saves the result of the check (whether or not to show the error message) in the state\r\n\r\n## Test instructions\r\n\r\nThis PR can be tested by following these steps:\r\n\r\n* Run `yarn install`, `yarn start`, go to `http://localhost:3333/`, and go to the `Keyword` tab\r\n* Typing a single word in the input field should not display the error message\r\n* Typing two words separated by whitespace should not display the error message\r\n* Typing two or more words separated by commas should display the error message underneath the input field\r\n\r\nFixes #466 \r\n","created_at":"2018-04-30T13:35:06Z","updated_at":"2018-05-01T09:54:52Z","closed_at":null,"merged_at":null,"merge_commit_sha":"85d351585e85fc0c5510f9f1171411128aa5641d","assignee":null,"assignees":[],"requested_reviewers":[],"requested_teams":[],"labels":[],"milestone":null,"commits_url":"https://api.github.com/repos/Yoast/yoast-components/pulls/482/commits","review_comments_url":"https://api.github.com/repos/Yoast/yoast-components/pulls/482/comments","review_comment_url":"https://api.github.com/repos/Yoast/yoast-components/pulls/comments{/number}","comments_url":"https://api.github.com/repos/Yoast/yoast-components/issues/482/comments","statuses_url":"https://api.github.com/repos/Yoast/yoast-components/statuses/2f4aef4f434dbbaae1070eac22f458cefa1b6865","head":{"label":"Yoast:466-implement-keyword-input-field-component","ref":"466-implement-keyword-input-field-component","sha":"2f4aef4f434dbbaae1070eac22f458cefa1b6865","user":{"login":"Yoast","id":4690436,"avatar_url":"https://avatars0.githubusercontent.com/u/4690436?v=4","gravatar_id":"","url":"https://api.github.com/users/Yoast","html_url":"https://github.com/Yoast","followers_url":"https://api.github.com/users/Yoast/followers","following_url":"https://api.github.com/users/Yoast/following{/other_user}","gists_url":"https://api.github.com/users/Yoast/gists{/gist_id}","starred_url":"https://api.github.com/users/Yoast/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Yoast/subscriptions","organizations_url":"https://api.github.com/users/Yoast/orgs","repos_url":"https://api.github.com/users/Yoast/repos","events_url":"https://api.github.com/users/Yoast/events{/privacy}","received_events_url":"https://api.github.com/users/Yoast/received_events","type":"Organization","site_admin":false},"repo":{"id":64846946,"name":"yoast-components","full_name":"Yoast/yoast-components","owner":{"login":"Yoast","id":4690436,"avatar_url":"https://avatars0.githubusercontent.com/u/4690436?v=4","gravatar_id":"","url":"https://api.github.com/users/Yoast","html_url":"https://github.com/Yoast","followers_url":"https://api.github.com/users/Yoast/followers","following_url":"https://api.github.com/users/Yoast/following{/other_user}","gists_url":"https://api.github.com/users/Yoast/gists{/gist_id}","starred_url":"https://api.github.com/users/Yoast/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Yoast/subscriptions","organizations_url":"https://api.github.com/users/Yoast/orgs","repos_url":"https://api.github.com/users/Yoast/repos","events_url":"https://api.github.com/users/Yoast/events{/privacy}","received_events_url":"https://api.github.com/users/Yoast/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/Yoast/yoast-components","description":"Accessible React components by Yoast","fork":false,"url":"https://api.github.com/repos/Yoast/yoast-components","forks_url":"https://api.github.com/repos/Yoast/yoast-components/forks","keys_url":"https://api.github.com/repos/Yoast/yoast-components/keys{/key_id}","collaborators_url":"https://api.github.com/repos/Yoast/yoast-components/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/Yoast/yoast-components/teams","hooks_url":"https://api.github.com/repos/Yoast/yoast-components/hooks","issue_events_url":"https://api.github.com/repos/Yoast/yoast-components/issues/events{/number}","events_url":"https://api.github.com/repos/Yoast/yoast-components/events","assignees_url":"https://api.github.com/repos/Yoast/yoast-components/assignees{/user}","branches_url":"https://api.github.com/repos/Yoast/yoast-components/branches{/branch}","tags_url":"https://api.github.com/repos/Yoast/yoast-components/tags","blobs_url":"https://api.github.com/repos/Yoast/yoast-components/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/Yoast/yoast-components/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/Yoast/yoast-components/git/refs{/sha}","trees_url":"https://api.github.com/repos/Yoast/yoast-components/git/trees{/sha}","statuses_url":"https://api.github.com/repos/Yoast/yoast-components/statuses/{sha}","languages_url":"https://api.github.com/repos/Yoast/yoast-components/languages","stargazers_url":"https://api.github.com/repos/Yoast/yoast-components/stargazers","contributors_url":"https://api.github.com/repos/Yoast/yoast-components/contributors","subscribers_url":"https://api.github.com/repos/Yoast/yoast-components/subscribers","subscription_url":"https://api.github.com/repos/Yoast/yoast-components/subscription","commits_url":"https://api.github.com/repos/Yoast/yoast-components/commits{/sha}","git_commits_url":"https://api.github.com/repos/Yoast/yoast-components/git/commits{/sha}","comments_url":"https://api.github.com/repos/Yoast/yoast-components/comments{/number}","issue_comment_url":"https://api.github.com/repos/Yoast/yoast-components/issues/comments{/number}","contents_url":"https://api.github.com/repos/Yoast/yoast-components/contents/{+path}","compare_url":"https://api.github.com/repos/Yoast/yoast-components/compare/{base}...{head}","merges_url":"https://api.github.com/repos/Yoast/yoast-components/merges","archive_url":"https://api.github.com/repos/Yoast/yoast-components/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/Yoast/yoast-components/downloads","issues_url":"https://api.github.com/repos/Yoast/yoast-components/issues{/number}","pulls_url":"https://api.github.com/repos/Yoast/yoast-components/pulls{/number}","milestones_url":"https://api.github.com/repos/Yoast/yoast-components/milestones{/number}","notifications_url":"https://api.github.com/repos/Yoast/yoast-components/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/Yoast/yoast-components/labels{/name}","releases_url":"https://api.github.com/repos/Yoast/yoast-components/releases{/id}","deployments_url":"https://api.github.com/repos/Yoast/yoast-components/deployments","created_at":"2016-08-03T13:10:33Z","updated_at":"2018-04-30T12:58:29Z","pushed_at":"2018-05-01T07:51:12Z","git_url":"git://github.com/Yoast/yoast-components.git","ssh_url":"git@github.com:Yoast/yoast-components.git","clone_url":"https://github.com/Yoast/yoast-components.git","svn_url":"https://github.com/Yoast/yoast-components","homepage":"","size":2440,"stargazers_count":16,"watchers_count":16,"language":"JavaScript","has_issues":true,"has_projects":true,"has_downloads":true,"has_wiki":true,"has_pages":false,"forks_count":3,"mirror_url":null,"archived":false,"open_issues_count":72,"license":{"key":"gpl-3.0","name":"GNU General Public License v3.0","spdx_id":"GPL-3.0","url":"https://api.github.com/licenses/gpl-3.0"},"forks":3,"open_issues":72,"watchers":16,"default_branch":"develop"}},"base":{"label":"Yoast:develop","ref":"develop","sha":"add6a3558a6df94db6e8417b03cc7ebb023e7d56","user":{"login":"Yoast","id":4690436,"avatar_url":"https://avatars0.githubusercontent.com/u/4690436?v=4","gravatar_id":"","url":"https://api.github.com/users/Yoast","html_url":"https://github.com/Yoast","followers_url":"https://api.github.com/users/Yoast/followers","following_url":"https://api.github.com/users/Yoast/following{/other_user}","gists_url":"https://api.github.com/users/Yoast/gists{/gist_id}","starred_url":"https://api.github.com/users/Yoast/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Yoast/subscriptions","organizations_url":"https://api.github.com/users/Yoast/orgs","repos_url":"https://api.github.com/users/Yoast/repos","events_url":"https://api.github.com/users/Yoast/events{/privacy}","received_events_url":"https://api.github.com/users/Yoast/received_events","type":"Organization","site_admin":false},"repo":{"id":64846946,"name":"yoast-components","full_name":"Yoast/yoast-components","owner":{"login":"Yoast","id":4690436,"avatar_url":"https://avatars0.githubusercontent.com/u/4690436?v=4","gravatar_id":"","url":"https://api.github.com/users/Yoast","html_url":"https://github.com/Yoast","followers_url":"https://api.github.com/users/Yoast/followers","following_url":"https://api.github.com/users/Yoast/following{/other_user}","gists_url":"https://api.github.com/users/Yoast/gists{/gist_id}","starred_url":"https://api.github.com/users/Yoast/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Yoast/subscriptions","organizations_url":"https://api.github.com/users/Yoast/orgs","repos_url":"https://api.github.com/users/Yoast/repos","events_url":"https://api.github.com/users/Yoast/events{/privacy}","received_events_url":"https://api.github.com/users/Yoast/received_events","type":"Organization","site_admin":false},"private":false,"html_url":"https://github.com/Yoast/yoast-components","description":"Accessible React components by Yoast","fork":false,"url":"https://api.github.com/repos/Yoast/yoast-components","forks_url":"https://api.github.com/repos/Yoast/yoast-components/forks","keys_url":"https://api.github.com/repos/Yoast/yoast-components/keys{/key_id}","collaborators_url":"https://api.github.com/repos/Yoast/yoast-components/collaborators{/collaborator}","teams_url":"https://api.github.com/repos/Yoast/yoast-components/teams","hooks_url":"https://api.github.com/repos/Yoast/yoast-components/hooks","issue_events_url":"https://api.github.com/repos/Yoast/yoast-components/issues/events{/number}","events_url":"https://api.github.com/repos/Yoast/yoast-components/events","assignees_url":"https://api.github.com/repos/Yoast/yoast-components/assignees{/user}","branches_url":"https://api.github.com/repos/Yoast/yoast-components/branches{/branch}","tags_url":"https://api.github.com/repos/Yoast/yoast-components/tags","blobs_url":"https://api.github.com/repos/Yoast/yoast-components/git/blobs{/sha}","git_tags_url":"https://api.github.com/repos/Yoast/yoast-components/git/tags{/sha}","git_refs_url":"https://api.github.com/repos/Yoast/yoast-components/git/refs{/sha}","trees_url":"https://api.github.com/repos/Yoast/yoast-components/git/trees{/sha}","statuses_url":"https://api.github.com/repos/Yoast/yoast-components/statuses/{sha}","languages_url":"https://api.github.com/repos/Yoast/yoast-components/languages","stargazers_url":"https://api.github.com/repos/Yoast/yoast-components/stargazers","contributors_url":"https://api.github.com/repos/Yoast/yoast-components/contributors","subscribers_url":"https://api.github.com/repos/Yoast/yoast-components/subscribers","subscription_url":"https://api.github.com/repos/Yoast/yoast-components/subscription","commits_url":"https://api.github.com/repos/Yoast/yoast-components/commits{/sha}","git_commits_url":"https://api.github.com/repos/Yoast/yoast-components/git/commits{/sha}","comments_url":"https://api.github.com/repos/Yoast/yoast-components/comments{/number}","issue_comment_url":"https://api.github.com/repos/Yoast/yoast-components/issues/comments{/number}","contents_url":"https://api.github.com/repos/Yoast/yoast-components/contents/{+path}","compare_url":"https://api.github.com/repos/Yoast/yoast-components/compare/{base}...{head}","merges_url":"https://api.github.com/repos/Yoast/yoast-components/merges","archive_url":"https://api.github.com/repos/Yoast/yoast-components/{archive_format}{/ref}","downloads_url":"https://api.github.com/repos/Yoast/yoast-components/downloads","issues_url":"https://api.github.com/repos/Yoast/yoast-components/issues{/number}","pulls_url":"https://api.github.com/repos/Yoast/yoast-components/pulls{/number}","milestones_url":"https://api.github.com/repos/Yoast/yoast-components/milestones{/number}","notifications_url":"https://api.github.com/repos/Yoast/yoast-components/notifications{?since,all,participating}","labels_url":"https://api.github.com/repos/Yoast/yoast-components/labels{/name}","releases_url":"https://api.github.com/repos/Yoast/yoast-components/releases{/id}","deployments_url":"https://api.github.com/repos/Yoast/yoast-components/deployments","created_at":"2016-08-03T13:10:33Z","updated_at":"2018-04-30T12:58:29Z","pushed_at":"2018-05-01T07:51:12Z","git_url":"git://github.com/Yoast/yoast-components.git","ssh_url":"git@github.com:Yoast/yoast-components.git","clone_url":"https://github.com/Yoast/yoast-components.git","svn_url":"https://github.com/Yoast/yoast-components","homepage":"","size":2440,"stargazers_count":16,"watchers_count":16,"language":"JavaScript","has_issues":true,"has_projects":true,"has_downloads":true,"has_wiki":true,"has_pages":false,"forks_count":3,"mirror_url":null,"archived":false,"open_issues_count":72,"license":{"key":"gpl-3.0","name":"GNU General Public License v3.0","spdx_id":"GPL-3.0","url":"https://api.github.com/licenses/gpl-3.0"},"forks":3,"open_issues":72,"watchers":16,"default_branch":"develop"}},"_links":{"self":{"href":"https://api.github.com/repos/Yoast/yoast-components/pulls/482"},"html":{"href":"https://github.com/Yoast/yoast-components/pull/482"},"issue":{"href":"https://api.github.com/repos/Yoast/yoast-components/issues/482"},"comments":{"href":"https://api.github.com/repos/Yoast/yoast-components/issues/482/comments"},"review_comments":{"href":"https://api.github.com/repos/Yoast/yoast-components/pulls/482/comments"},"review_comment":{"href":"https://api.github.com/repos/Yoast/yoast-components/pulls/comments{/number}"},"commits":{"href":"https://api.github.com/repos/Yoast/yoast-components/pulls/482/commits"},"statuses":{"href":"https://api.github.com/repos/Yoast/yoast-components/statuses/2f4aef4f434dbbaae1070eac22f458cefa1b6865"}},"author_association":"CONTRIBUTOR"}}
{"actor":{"display_login":"igorschoester"}}