{"action":"created","issue":{"url":"https://api.github.com/repos/code-dot-org/code-dot-org/issues/7063","repository_url":"https://api.github.com/repos/code-dot-org/code-dot-org","labels_url":"https://api.github.com/repos/code-dot-org/code-dot-org/issues/7063/labels{/name}","comments_url":"https://api.github.com/repos/code-dot-org/code-dot-org/issues/7063/comments","events_url":"https://api.github.com/repos/code-dot-org/code-dot-org/issues/7063/events","html_url":"https://github.com/code-dot-org/code-dot-org/pull/7063","id":137678290,"number":7063,"title":"React Wrapper Step 4: Extract PlaySpaceHeader from ejs","user":{"login":"islemaster","id":1615761,"avatar_url":"https://avatars.githubusercontent.com/u/1615761?v=3","gravatar_id":"","url":"https://api.github.com/users/islemaster","html_url":"https://github.com/islemaster","followers_url":"https://api.github.com/users/islemaster/followers","following_url":"https://api.github.com/users/islemaster/following{/other_user}","gists_url":"https://api.github.com/users/islemaster/gists{/gist_id}","starred_url":"https://api.github.com/users/islemaster/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/islemaster/subscriptions","organizations_url":"https://api.github.com/users/islemaster/orgs","repos_url":"https://api.github.com/users/islemaster/repos","events_url":"https://api.github.com/users/islemaster/events{/privacy}","received_events_url":"https://api.github.com/users/islemaster/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":{"login":"bcjordan","id":206973,"avatar_url":"https://avatars.githubusercontent.com/u/206973?v=3","gravatar_id":"","url":"https://api.github.com/users/bcjordan","html_url":"https://github.com/bcjordan","followers_url":"https://api.github.com/users/bcjordan/followers","following_url":"https://api.github.com/users/bcjordan/following{/other_user}","gists_url":"https://api.github.com/users/bcjordan/gists{/gist_id}","starred_url":"https://api.github.com/users/bcjordan/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/bcjordan/subscriptions","organizations_url":"https://api.github.com/users/bcjordan/orgs","repos_url":"https://api.github.com/users/bcjordan/repos","events_url":"https://api.github.com/users/bcjordan/events{/privacy}","received_events_url":"https://api.github.com/users/bcjordan/received_events","type":"User","site_admin":false},"milestone":null,"comments":2,"created_at":"2016-03-01T20:30:15Z","updated_at":"2016-03-02T01:04:25Z","closed_at":null,"pull_request":{"url":"https://api.github.com/repos/code-dot-org/code-dot-org/pulls/7063","html_url":"https://github.com/code-dot-org/code-dot-org/pull/7063","diff_url":"https://github.com/code-dot-org/code-dot-org/pull/7063.diff","patch_url":"https://github.com/code-dot-org/code-dot-org/pull/7063.patch"},"body":"Make `PlaySpaceHeader` render by the top-level component instead of directly by designMode.js.\r\n\r\nTo do this, App Lab gets its own top-level component `AppLabView` - we don't want to put this feature on our standard `AppView` component because most puzzle types won't ever need to render this header.\r\n\r\nA few general transformations were needed to make this possible.\r\n\r\n1. Extracted `Applab.render()` so we can update the whole view any time, not just once inside `Applab.init()`.  Our `ProtectedStatefulDiv`s are doing their job for the first time!\r\n1. That render method needs to query the current state (for now) so a few design mode properties got accessors to help with that.\r\n1. `AppLabView` ends up taking all of `PlaySpaceHeader`'s properties so it can pass them along.  For now, that means lots of scaffolding.  I hope to clean this up soon with Redux.\r\n\r\nI thought about introducing Redux as well to clean up this PR, but it's going to require updating React to v0.14.x which will be a big change on its own, so I'm stopping here for now and will consider that the next step.\r\n\r\nSome additional cleanup:\r\n\r\n* Certain logic (e.g. whether to show/hide the view data button) got moved into `AppLabView` and out of applab.js.\r\n* Cleaned up the last vestiges of `designToggleRow` (former name of `PlaySpaceHeader`).\r\n* Removed some methods that got reduced to simple pass-throughs.\r\n\r\nNext steps:\r\n\r\n* Update React from v0.13 to v0.14\r\n* Start using react-redux, move props into the Redux store one at a time\r\n  * `activeScreenId` would be a good place to start\r\n  * Moving the code mode / design mode state into Redux (and out of the toggle) would be a big win.\r\n  * Level properties (which shouldn't change after initial render) to avoid lots of passthrough for these effectively global properties.\r\n\r\n_Step 4 from [this design document](https://docs.google.com/document/d/1itHwWa0ilE4FAMjDuqxkWXSqp_d0z7lhTeMFJybFH0w/edit?usp=sharing)._"},"comment":{"url":"https://api.github.com/repos/code-dot-org/code-dot-org/issues/comments/191002318","html_url":"https://github.com/code-dot-org/code-dot-org/pull/7063#issuecomment-191002318","issue_url":"https://api.github.com/repos/code-dot-org/code-dot-org/issues/7063","id":191002318,"user":{"login":"islemaster","id":1615761,"avatar_url":"https://avatars.githubusercontent.com/u/1615761?v=3","gravatar_id":"","url":"https://api.github.com/users/islemaster","html_url":"https://github.com/islemaster","followers_url":"https://api.github.com/users/islemaster/followers","following_url":"https://api.github.com/users/islemaster/following{/other_user}","gists_url":"https://api.github.com/users/islemaster/gists{/gist_id}","starred_url":"https://api.github.com/users/islemaster/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/islemaster/subscriptions","organizations_url":"https://api.github.com/users/islemaster/orgs","repos_url":"https://api.github.com/users/islemaster/repos","events_url":"https://api.github.com/users/islemaster/events{/privacy}","received_events_url":"https://api.github.com/users/islemaster/received_events","type":"User","site_admin":false},"created_at":"2016-03-02T01:04:25Z","updated_at":"2016-03-02T01:04:25Z","body":"Ready for review.  CC @Bjvanminnen @davidsbailey @Hamms @joshlory "}}