{"action":"closed","issue":{"url":"https://api.github.com/repos/reactioncommerce/reaction-component-library/issues/154","repository_url":"https://api.github.com/repos/reactioncommerce/reaction-component-library","labels_url":"https://api.github.com/repos/reactioncommerce/reaction-component-library/issues/154/labels{/name}","comments_url":"https://api.github.com/repos/reactioncommerce/reaction-component-library/issues/154/comments","events_url":"https://api.github.com/repos/reactioncommerce/reaction-component-library/issues/154/events","html_url":"https://github.com/reactioncommerce/reaction-component-library/issues/154","id":343691158,"node_id":"MDU6SXNzdWUzNDM2OTExNTg=","number":154,"title":"Icons: Remove use of Font Awesome","user":{"login":"aldeed","id":3012067,"node_id":"MDQ6VXNlcjMwMTIwNjc=","avatar_url":"https://avatars1.githubusercontent.com/u/3012067?v=4","gravatar_id":"","url":"https://api.github.com/users/aldeed","html_url":"https://github.com/aldeed","followers_url":"https://api.github.com/users/aldeed/followers","following_url":"https://api.github.com/users/aldeed/following{/other_user}","gists_url":"https://api.github.com/users/aldeed/gists{/gist_id}","starred_url":"https://api.github.com/users/aldeed/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/aldeed/subscriptions","organizations_url":"https://api.github.com/users/aldeed/orgs","repos_url":"https://api.github.com/users/aldeed/repos","events_url":"https://api.github.com/users/aldeed/events{/privacy}","received_events_url":"https://api.github.com/users/aldeed/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":{"login":"machikoyasuda","id":3673236,"node_id":"MDQ6VXNlcjM2NzMyMzY=","avatar_url":"https://avatars0.githubusercontent.com/u/3673236?v=4","gravatar_id":"","url":"https://api.github.com/users/machikoyasuda","html_url":"https://github.com/machikoyasuda","followers_url":"https://api.github.com/users/machikoyasuda/followers","following_url":"https://api.github.com/users/machikoyasuda/following{/other_user}","gists_url":"https://api.github.com/users/machikoyasuda/gists{/gist_id}","starred_url":"https://api.github.com/users/machikoyasuda/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/machikoyasuda/subscriptions","organizations_url":"https://api.github.com/users/machikoyasuda/orgs","repos_url":"https://api.github.com/users/machikoyasuda/repos","events_url":"https://api.github.com/users/machikoyasuda/events{/privacy}","received_events_url":"https://api.github.com/users/machikoyasuda/received_events","type":"User","site_admin":false},"assignees":[{"login":"machikoyasuda","id":3673236,"node_id":"MDQ6VXNlcjM2NzMyMzY=","avatar_url":"https://avatars0.githubusercontent.com/u/3673236?v=4","gravatar_id":"","url":"https://api.github.com/users/machikoyasuda","html_url":"https://github.com/machikoyasuda","followers_url":"https://api.github.com/users/machikoyasuda/followers","following_url":"https://api.github.com/users/machikoyasuda/following{/other_user}","gists_url":"https://api.github.com/users/machikoyasuda/gists{/gist_id}","starred_url":"https://api.github.com/users/machikoyasuda/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/machikoyasuda/subscriptions","organizations_url":"https://api.github.com/users/machikoyasuda/orgs","repos_url":"https://api.github.com/users/machikoyasuda/repos","events_url":"https://api.github.com/users/machikoyasuda/events{/privacy}","received_events_url":"https://api.github.com/users/machikoyasuda/received_events","type":"User","site_admin":false}],"milestone":{"url":"https://api.github.com/repos/reactioncommerce/reaction-component-library/milestones/10","html_url":"https://github.com/reactioncommerce/reaction-component-library/milestone/10","labels_url":"https://api.github.com/repos/reactioncommerce/reaction-component-library/milestones/10/labels","id":3451317,"node_id":"MDk6TWlsZXN0b25lMzQ1MTMxNw==","number":10,"title":"Jupiter","description":"Core team sprint\nJuly 24, 2018 - Aug 6, 2018\nPointing: https://www.pointingpoker.com/api/sessions/8e8a4ebe-1b6d-4508-95ea-f477f3a56b6a","creator":{"login":"spencern","id":1203639,"node_id":"MDQ6VXNlcjEyMDM2Mzk=","avatar_url":"https://avatars0.githubusercontent.com/u/1203639?v=4","gravatar_id":"","url":"https://api.github.com/users/spencern","html_url":"https://github.com/spencern","followers_url":"https://api.github.com/users/spencern/followers","following_url":"https://api.github.com/users/spencern/following{/other_user}","gists_url":"https://api.github.com/users/spencern/gists{/gist_id}","starred_url":"https://api.github.com/users/spencern/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/spencern/subscriptions","organizations_url":"https://api.github.com/users/spencern/orgs","repos_url":"https://api.github.com/users/spencern/repos","events_url":"https://api.github.com/users/spencern/events{/privacy}","received_events_url":"https://api.github.com/users/spencern/received_events","type":"User","site_admin":false},"open_issues":14,"closed_issues":17,"state":"open","created_at":"2018-06-25T23:12:32Z","updated_at":"2018-08-06T21:44:45Z","due_on":"2018-08-06T07:00:00Z","closed_at":null},"comments":4,"created_at":"2018-07-23T15:50:04Z","updated_at":"2018-08-06T21:44:45Z","closed_at":"2018-08-06T21:44:44Z","author_association":"MEMBER","body":"## Background\r\n\r\nWe used Font Awesome icons in a few components. To avoid having that dependency, we should change everything to use SVGs like I did with the TextInput clear button as a test: https://github.com/reactioncommerce/reaction-component-library/blob/master/package/src/components/TextInput/v1/TextInput.js#L172\r\n\r\n## Work\r\n\r\n- Find everywhere where `fa` or `fab` classes are used\r\n- Find everywhere where Font Awesome fonts are used in pseudoelements\r\n\r\n- Find the icons on https://fontawesome.com/icons and click Download SVG button for each\r\n- Replace these icon elements with a React svg element based on the SVG you downloaded. You may have to adjust the capitalization of the SVG props. See https://reactjs.org/docs/dom-elements.html#all-supported-html-attributes\r\n\r\n- Remove font awesome from docs and update docs to explain how to properly add an SVG icon for a component.\r\n- Component injection: https://github.com/reactioncommerce/reaction-component-library/blob/815c823524e5bf4f891fff3417173869dd0f4174/styleguide/src/sections/InstallingandImporting.md#provide-the-components-context\r\n\r\n## Components\r\n\r\n1. Checkbox: checkmark pseudo-element\r\n2. TextInput: gavel, thumbs-down, thumbs-up, check-circle, pied-piper\r\n3. ErrorsBlock: exclamation-triangle\r\n\r\n## Documentation\r\n\r\nDocument our Icon policy"}}
{"actor":{"display_login":"machikoyasuda"}}