Антон Спирин

1. У вас код невалидный. Ключевые слова class и for зарезервированны языком.
Используйте вместо className и htmlFor.
2. this.state ={url:url} Так state обновлять нельзя.
3. Создаете FormDatra но не используете.

После исправления этих пунктов, если не заведется смотрите ошибки в консоли, смотрите вкладку network, можно и сам метод подебажить тем же выводом console.log.

Определять UА и рисовать мобильные версии компонентов. Там, где хватит мобильных стилей css, использовать медиазаросы или рендерить стили по тому же UA.

Вам хватит простых условий:

render() {
  const { me, project, users } = this.props;
  const isMeModerator = isModerator(me);
  const isMeCreator = me.id === project.creator_id;
  const shouldShowSearchForm = isMeModerator || isMeCreator;

  return (
    <div>
      {shouldShowSearchForm && <Search />}
      <ul>
         {users.map(user => {
           const isUserCreator = user.id === project.creator_id;
           const shouldShowDeleteButton = (isMeModerator || isMeCreator) && !isUserCreator;

           return (
             <li key={user.id}>
               {user.name}
               {shouldShowDeleteButton && <Button>Delete</Delete>}
               {isUserCreator && <CreatorLabel />}
             </li>
           );  
         }}
      </ul>
    </div>
  );
}

Если в приложении много элементов которые зависят от ролей и полномочий можно написать контейнер с интерфейсом вида:

<PermissionsChecker requiredPermissions={permissions}>
  <SomeComponent />
</PermissionsChecker>

Тут permissions можно коннектить в PermissionsСhecker из стора и сверять с полученными в свойстве requiredPermissions и в случае наличия необходимых прав в store, возвращать дочерний компонент, в противном случае null.

Как правильно использовать this.props.children?

import React from 'react';
import ReactDOM from 'react-dom';

const SomeComponent = ({ name }) => (
  <span>{name}</span>
);

const SomeContainer = ({ children }) => (
  <div>{children}</div>
);

const Example = () => (
  <SomeContainer>
    <SomeComponent name="John" />
  </SomeContainer>
);

ReactDOM.render(
  <Example />,
  document.getElementById('root');
);

Результат:

<div id="root">
  <div>
    <span>John</span>
  </div>
</div>

Можно попробовать как-то так:

App:

<Switch>
  <Route path="/(en|ru|de|es|it|jp)" component={Routes} />
  <Redirect to={`/${currentLocale.code}${location.pathname}`} />
</Switch>

Routes:

<Switch>
  <Route exact path={match.path} component={Main} />
  <Route path={`${match.path}/other`} component={Other} />
  <Redirect to={match.url} />
</Switch>

Открываем github в поиске вводим:
1. React redux real world
2. React redux weather app
3. React redux reddit/twitter/youtube/etc client
4. React redux dashboard
5. React redux starter. Бойлерплейты тоже очень полезно изучать. Скачиваем. Открываем package.json изучаем каждый пакет в зависимостях. Отвечаем на вопросы: Что это? Зачем оно тут? Как используется? Необходимо ли оно вам? Если не, то выпиливаем без следа.

По всем пунктам смотрим именно те проекты, у которых есть какое-никакое количество звезд и форков.

Читаем все свежие статьи по теме.

React Redux links

Ваш фильтр должен лишь переключать какое-то состояние через колбек или redux action. О существовании каких-либо данных или API он знать ничего не должен.

Варианты решения:
1. Lifting state up
2. Redux или аналоги.

game_1 store:

{
  a: {},
  b: {},
  c: {},
}

game_2 store:

{
  a: {},
  b: {},
  c: {},
}

shared store:

{
  game_1: {
    a: {},
    b: {},
    c: {},
  },
  game_2: {
    a: {},
    b: {},
    c: {},
  },
}

1. Считать totalPrice и хранить в редьюсере - плохое решение. Изменять сумму на основе предыдущего значения - решение еще хуже. Напишите селектор, который будет считать totalPrice на основе cart.items или считайте сумму каждый рендер.
2. Не позволяйте добавлять дубликат товара. Вместо этого увеличивайте количество.

Вопрос можно перефразировать в Для чего используют фронтенд фреймворки?. Ответ на него легко ищется поисковиком.
Ответы на все ваши вопросы конкретно по React есть в туториале и документации на
официальном сайте. Не ленитесь и потратьте время на ознакомление.

1. Перерисовка компонента происходит, как следствие перерисовки родителя или вызовов this.setState() или this.forceUpdate().
Ее можно контролировать в class components с помощью метода жизненного цикла shouldComponentUpdate. При вызове this.forceUpdate() shouldComponentUpdate не вызывается.

2.

Изменение свойств (props) компонента, полученных от родителя или перерисовка родителя.

Получить новые свойства без перерисовки родителя невозможно.

Чтобы дочерние компоненты не перерисовывались по цепочке, вы должны реализовывать метод shouldComponentUpdate или использовать PureComponent там, где это уместно. Перерисовку функциональных компонентов контролировать нельзя(разве с помощью HOC). Использование HOC connect убирает все лишние перерисовки дочернего компонента.

3. Провайдеры это обычные компоненты. Перерисовывается родитель - перерисовываются они.

Все, что я написал выше, кроме кейса с connect, есть в официальной документации. Стоит открыть почитать.

Вангую, что должно быть так:

handleChange = e => {
 const { name, value } = e.target;

 this.setState({ [name]: value });
};

class Parent extends React.Component {
  state = {
    someStateKey: false,
  };
 
  someHandler = () => {
    this.setState({ someStateKey: true });
  };
  
  render() {
    return (
      <Wrapper>
        <ChildA someHandler={this.someHandler} />
        <ChildB stateKey={this.state.someStateKey} />
      </Wrapper>
    );
 }  
}

Lifting state up

Советую все таки осилить официальный Tutorial и документацию.

Метод componentWillMount не рекомендован к использованию. Давно вышел react-router 4.
Вы можете использовать конструктор и history.push, либо render и компонент Redirect.
Вместо PropTypes лучше использовать TypeScript или Flow.

С кодом все нормально. Либо ошибка в другом месте, либо вы выполняете сборку другой версии кода.

Очевидно, что с любого приложения использующего роутинг на стороне клиента:
1. Классика: Тodo List
2. Простенький клиент для github
3. Простенький клиент для reddit
4. Простенький клиент для twitter
5. Погодное приложение
6. Небольшой дашбоард
7. Витрина онлайн магазина
8. Поиск авиабилетов, гостиниц и подобного
и тд

Вариантов очень много.