{"action":"created","issue":{"url":"https://api.github.com/repos/AltSchool/ember-cli-react/issues/32","repository_url":"https://api.github.com/repos/AltSchool/ember-cli-react","labels_url":"https://api.github.com/repos/AltSchool/ember-cli-react/issues/32/labels{/name}","comments_url":"https://api.github.com/repos/AltSchool/ember-cli-react/issues/32/comments","events_url":"https://api.github.com/repos/AltSchool/ember-cli-react/issues/32/events","html_url":"https://github.com/AltSchool/ember-cli-react/pull/32","id":340152521,"node_id":"MDExOlB1bGxSZXF1ZXN0MjAwNjMxMTEw","number":32,"title":"Add support to have ReactStyleFileName","user":{"login":"pswai","id":5335123,"node_id":"MDQ6VXNlcjUzMzUxMjM=","avatar_url":"https://avatars0.githubusercontent.com/u/5335123?v=4","gravatar_id":"","url":"https://api.github.com/users/pswai","html_url":"https://github.com/pswai","followers_url":"https://api.github.com/users/pswai/followers","following_url":"https://api.github.com/users/pswai/following{/other_user}","gists_url":"https://api.github.com/users/pswai/gists{/gist_id}","starred_url":"https://api.github.com/users/pswai/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/pswai/subscriptions","organizations_url":"https://api.github.com/users/pswai/orgs","repos_url":"https://api.github.com/users/pswai/repos","events_url":"https://api.github.com/users/pswai/events{/privacy}","received_events_url":"https://api.github.com/users/pswai/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":1,"created_at":"2018-07-11T09:01:14Z","updated_at":"2018-07-17T06:15:59Z","closed_at":"2018-07-17T06:15:41Z","author_association":"CONTRIBUTOR","pull_request":{"url":"https://api.github.com/repos/AltSchool/ember-cli-react/pulls/32","html_url":"https://github.com/AltSchool/ember-cli-react/pull/32","diff_url":"https://github.com/AltSchool/ember-cli-react/pull/32.diff","patch_url":"https://github.com/AltSchool/ember-cli-react/pull/32.patch"},"body":"The file name convention for Ember components is `snake-case`, however in React seems to be `PascalCase`. This PR adds support for ReactStyleFileName.\r\n\r\n### Problem\r\n\r\nLet's we at the 2 major use cases of using React in Ember:\r\n- Gaining performance boost for certain part of UI\r\n- Migrating from Ember to React\r\n\r\nFor the first scenario, using Ember's convention makes sense because Ember and React are going to coexist. Having 2 file name conventions is confusing to developers.\r\n\r\nHowever, for the second scenario, having 2 file name conventions becomes a good thing, because it shows clearly which components haven't been migrated yet. In fact, using Ember's convention for React components becomes awkward when importing components:\r\n\r\n```javascript\r\nimport React from 'npm:react';\r\nimport FancyCard from 'npm:third-party/core/FancyCard';\r\nimport TodoList from './todo-list'; // Inconsistent\r\n```\r\n\r\nAlso, it is painful at the end of the project to have to rename all React components to PascalCase and update all the imports.\r\n\r\n### Proposed Solution\r\n\r\nWith support for ReactStyleFileName, users for the second scenario can write their React components this way:\r\n\r\n```javascript\r\nimport React from 'npm:react';\r\nimport FancyCard from 'npm:third-party/core/FancyCard';\r\nimport TodoList from './TodoList'; // Consistent\r\n```\r\n\r\nWhen the migration is done, no renaming is required since we have everything in place already. (Ok not yet, the `npm:` prefix can be removed with #27).\r\n\r\n### Caveat\r\n\r\nUnfortunately we still can't use single-worded component in Handlebars:\r\n\r\n```handlebards\r\n{{!-- Doesn't work --}}\r\n{{avatar}}\r\n```\r\n\r\nHowever we can use it with the `react-component` component:\r\n\r\n```handlebars\r\n{{!-- This works --}}\r\n{{react-component 'avatar'}}\r\n```"},"comment":{"url":"https://api.github.com/repos/AltSchool/ember-cli-react/issues/comments/405471771","html_url":"https://github.com/AltSchool/ember-cli-react/pull/32#issuecomment-405471771","issue_url":"https://api.github.com/repos/AltSchool/ember-cli-react/issues/32","id":405471771,"node_id":"MDEyOklzc3VlQ29tbWVudDQwNTQ3MTc3MQ==","user":{"login":"alexgb","id":78868,"node_id":"MDQ6VXNlcjc4ODY4","avatar_url":"https://avatars1.githubusercontent.com/u/78868?v=4","gravatar_id":"","url":"https://api.github.com/users/alexgb","html_url":"https://github.com/alexgb","followers_url":"https://api.github.com/users/alexgb/followers","following_url":"https://api.github.com/users/alexgb/following{/other_user}","gists_url":"https://api.github.com/users/alexgb/gists{/gist_id}","starred_url":"https://api.github.com/users/alexgb/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/alexgb/subscriptions","organizations_url":"https://api.github.com/users/alexgb/orgs","repos_url":"https://api.github.com/users/alexgb/repos","events_url":"https://api.github.com/users/alexgb/events{/privacy}","received_events_url":"https://api.github.com/users/alexgb/received_events","type":"User","site_admin":false},"created_at":"2018-07-17T06:15:59Z","updated_at":"2018-07-17T06:15:59Z","author_association":"COLLABORATOR","body":"@pswai thanks for the great PR writeup on this one"}}
{"actor":{"display_login":"alexgb"}}