{"action":"created","issue":{"url":"https://api.github.com/repos/facebook/react-devtools/issues/677","repository_url":"https://api.github.com/repos/facebook/react-devtools","labels_url":"https://api.github.com/repos/facebook/react-devtools/issues/677/labels{/name}","comments_url":"https://api.github.com/repos/facebook/react-devtools/issues/677/comments","events_url":"https://api.github.com/repos/facebook/react-devtools/issues/677/events","html_url":"https://github.com/facebook/react-devtools/pull/677","id":226059216,"number":677,"title":"Dim component tags that are HOCs","user":{"login":"mattvagni","id":1372762,"avatar_url":"https://avatars0.githubusercontent.com/u/1372762?v=3","gravatar_id":"","url":"https://api.github.com/users/mattvagni","html_url":"https://github.com/mattvagni","followers_url":"https://api.github.com/users/mattvagni/followers","following_url":"https://api.github.com/users/mattvagni/following{/other_user}","gists_url":"https://api.github.com/users/mattvagni/gists{/gist_id}","starred_url":"https://api.github.com/users/mattvagni/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/mattvagni/subscriptions","organizations_url":"https://api.github.com/users/mattvagni/orgs","repos_url":"https://api.github.com/users/mattvagni/repos","events_url":"https://api.github.com/users/mattvagni/events{/privacy}","received_events_url":"https://api.github.com/users/mattvagni/received_events","type":"User","site_admin":false},"labels":[{"id":196859157,"url":"https://api.github.com/repos/facebook/react-devtools/labels/CLA%20Signed","name":"CLA Signed","color":"cccccc","default":false},{"id":244176563,"url":"https://api.github.com/repos/facebook/react-devtools/labels/GH%20Review:%20review-needed","name":"GH Review: review-needed","color":"fbca04","default":false}],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":14,"created_at":"2017-05-03T17:30:21Z","updated_at":"2017-06-12T16:00:29Z","closed_at":null,"pull_request":{"url":"https://api.github.com/repos/facebook/react-devtools/pulls/677","html_url":"https://github.com/facebook/react-devtools/pull/677","diff_url":"https://github.com/facebook/react-devtools/pull/677.diff","patch_url":"https://github.com/facebook/react-devtools/pull/677.patch"},"body":"### Description:\r\nIn issue: https://github.com/facebook/react-devtools/issues/676\r\n\r\nIn order to test this behavior I updated the example application to set the display name on it's `HigherOrderComponent` to match the common pattern described in the issue above. \r\n\r\n### Screenshots\r\nBy default this PR dims components in the tree view that are considered to be higher order components (have a `()` in their displayName):\r\n\r\n<img width=\"1440\" alt=\"screen shot 2017-05-29 at 7 23 44 pm\" src=\"https://cloud.githubusercontent.com/assets/1372762/26558972/7b7a2ebe-44a4-11e7-806f-5762e59da0f1.png\">\r\n\r\nWhen a component is selected however it is not dimmed. \r\n\r\n<img width=\"1440\" alt=\"screen shot 2017-05-29 at 7 24 05 pm\" src=\"https://cloud.githubusercontent.com/assets/1372762/26558999/9d09efb0-44a4-11e7-94c6-19bf493e632d.png\">\r\n\r\nAlso when a component is selected, the components 'close tag' is **not** dimmed. This makes it easier to determine what component you've selected in cases like this where a few HOCs are nested.\r\n\r\n<img width=\"1440\" alt=\"screen shot 2017-05-29 at 7 24 14 pm\" src=\"https://cloud.githubusercontent.com/assets/1372762/26559016/b8dc7fbe-44a4-11e7-8828-5206617a7cde.png\">\r\n\r\nIt is also not dimmed when shown in the search results:\r\n\r\n<img width=\"1440\" alt=\"screen shot 2017-05-29 at 7 24 26 pm\" src=\"https://cloud.githubusercontent.com/assets/1372762/26559007/a5390d6a-44a4-11e7-9482-e234c54f7c8a.png\">\r\n\r\n\r\n\r\n"},"comment":{"url":"https://api.github.com/repos/facebook/react-devtools/issues/comments/307834747","html_url":"https://github.com/facebook/react-devtools/pull/677#issuecomment-307834747","issue_url":"https://api.github.com/repos/facebook/react-devtools/issues/677","id":307834747,"user":{"login":"bvaughn","id":29597,"avatar_url":"https://avatars3.githubusercontent.com/u/29597?v=3","gravatar_id":"","url":"https://api.github.com/users/bvaughn","html_url":"https://github.com/bvaughn","followers_url":"https://api.github.com/users/bvaughn/followers","following_url":"https://api.github.com/users/bvaughn/following{/other_user}","gists_url":"https://api.github.com/users/bvaughn/gists{/gist_id}","starred_url":"https://api.github.com/users/bvaughn/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/bvaughn/subscriptions","organizations_url":"https://api.github.com/users/bvaughn/orgs","repos_url":"https://api.github.com/users/bvaughn/repos","events_url":"https://api.github.com/users/bvaughn/events{/privacy}","received_events_url":"https://api.github.com/users/bvaughn/received_events","type":"User","site_admin":false},"created_at":"2017-06-12T16:00:29Z","updated_at":"2017-06-12T16:00:29Z","body":"Haven't had a chance to look at the colors yet. Will try to look today! Did have a quick thought about this point though:\r\n\r\n> Also, since the label for the new theme color was longer than the other I increased the width of all the `ColorInput` components.\r\n\r\nI'd prefer we shorter the label (eg \"HOCs\" or maybe just \"Higher Order\") rather than increase the width of the field by 2 rems. What are your thoughts?"}}
{"actor":{"display_login":"bvaughn"}}