text: import {connect} from 'react-redux';
  import {delete as del, put} from 'axios/index';
  
  import {deleteTodo, toggleTodo} from '../actions';
  import TodoList from '../components/TodoList';
  
  // eslint-disable-next-line no-undef
  const serverUrl = TODOMVC_BACKEND_URL;
  
  const getVisibleTodos = (todos, filter) => {
      switch (filter) {
          case 'SHOW_ALL':
              return todos;
          case 'SHOW_COMPLETED':
              return todos.filter((todo) => todo.completed);
          case 'SHOW_ACTIVE':
              return todos.filter((todo) => !todo.completed);
          default:
              throw new Error(`Unknown filter: ${filter}`);
      }
  };
  
  const handleError = (error) => {
      // eslint-disable-next-line no-console
      console.log(error);
      // eslint-disable-next-line no-alert
      alert('An error has occurred. See the developer console for details.');
  };
  
  const buildOptions = (auth) => ({
      headers: {
          authorization: auth.idToken
      }
  });
  
  export const mapStateToProps = (state) => ({
      auth: state.auth,
      todos: getVisibleTodos(state.todos, state.visibilityFilter)
  });
  
  export const mapDispatchToProps = (dispatch) => ({
      deleteTodo: async (auth, todo) => {
          try {
              dispatch(deleteTodo(todo.id));
  
              await del(`${serverUrl}todos/${todo.id}`, buildOptions(auth));
          } catch (error) {
              handleError(error);
          }
      },
      toggleTodo: async (auth, todo) => {
          try {
              dispatch(toggleTodo(todo.id));
  
              await put(`${serverUrl}todos`, {
                  completed: !todo.completed,
                  id: todo.id,
                  text: todo.text
              }, buildOptions(auth));
          } catch (error) {
              handleError(error);
          }
      }
  });
  
  export default connect(
      mapStateToProps,
      mapDispatchToProps
  )(TodoList);
  