/**
 * This file provided by Facebook is for non-commercial testing and evaluation
 * purposes only.  Facebook reserves all rights not expressly granted.
 *
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL
 * FACEBOOK BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN
 * ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
 * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 */ import AddTodoMutation from '../mutations/AddTodoMutation' ; import TodoList from './TodoList' ; import TodoListFooter from './TodoListFooter' ; import TodoTextInput from './TodoTextInput' ; import * as React from 'react' ; import { createFragmentContainer , graphql , RelayProp , } from 'react-relay' ; import { TodoApp_viewer } from '../__relay_artifacts__/TodoApp_viewer.graphql' ; interface Props { relay : RelayProp ; viewer : TodoApp_viewer ; } interface State { append : boolean ; } class TodoApp extends React . Component < Props , State > { state = { append : false } ; onSetAppend = ( ) => this . setState ( ( { append } ) => ( { append : ! append } ) ) ; _handleTextInputSave = ( text ) => { AddTodoMutation . commit ( this . props . relay . environment , text , this . props . viewer , this . state . append ) ; } ; render ( ) { const hasTodos = ( this . props . viewer . totalCount || 0 ) > 0 ; return ( < div > < section className = "todoapp" > < header className = "header" > < h1 > todos < /h1> < TodoTextInput autoFocus = { true } className = "new-todo" onSave = { this . _handleTextInputSave } placeholder = "What needs to be done?" / > < /header> < TodoList viewer = { this . props . viewer } / > { hasTodos && < TodoListFooter viewer = { this . props . viewer } onSetAppend = { this . onSetAppend } append = { this . state . append } / > } < /section> < footer className = "info" > < p > Double - click to edit a todo < /p> < p > Created by the < a href = "https://facebook.github.io/relay/" > Relay team < /a> < /p> < p > Part of < a href = "http://todomvc.com" > TodoMVC < /a> < /p> < /footer> < /div>); } } export default createFragmentContainer ( TodoApp , { viewer : graphql `
    fragment TodoApp_viewer on User {
      id,
      totalCount,
      ...TodoListFooter_viewer,
      ...TodoList_viewer,
    }
  ` , } ) ;