Антон Спирин

Дублирующиеся свойства в литерале объекта переопределяют друг друга. В созданный объект попадает значение последнего. Пример.

Поэтому объект, возвращаемый вызовом функции:

prevState => ({
  counter: prevState.counter + 1,
  counter: prevState.counter + 1,
})

при prevState.counter === 0, будет создаваться как:

{
  counter: 0 + 1,
  counter: 0 + 1,  // результат этого выражения попадет в созданный объект
}

и на выходе получится объект:
{ counter: 1 }
Он и будет подмешан в новый объект состояния.

Можно так.

Исправленная версия.
1. Изменен протокол с http на https.
2. Исправлена опечатка в переменной isLoaded(было isloaded).

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

1. Добавляем скрипт в html шаблон к которому крепится приложение.
2. Инициализируем пустой массив в точке входа:
window._rutarget = [];
3. Пользуемся в любой части приложения:
window._rutarget.push({ 'event': 'showOffer' });

Можно написать свою обертку:

window._rutarget = [];

const AdService = {
  showOffer() {
    window._rutarget.push({'event': 'showOffer'});
  }, 
};

export default AdService;

В React Native тэг script использовать не получится, можно разве попробовать использовать WebVIew.

case ADD_PRODUCT_COMMENT:
  return {
    ...state,
    comments: {
      ...state.comments,
      allComments: [
        ...state.comments.allComments,
        action.payload,
      ],
     },
  };

Главная проблема вашей логики в том, что вы используете два источника правды для одних и тех же данных: локальное состояние и хранилище redux. Непонятно зачем вы вообще храните эти данные в локальном состоянии компонента.

По-хорошему, ваш запрос за комментариями надо вынести в асинхронное действие, а данные прокидывать в компонент из store вызовом connect.

class Example extends React.Component {
  componentDidMount() {
    const { fetchComments, productSlug } = this.props;
    fetchProductCommentsBySlug(productSlug);
  }

  handleRemoveComment = id => {
    this.props.removeProductCommentById(id); 
  };

  handleSubmitComment = e => {
    // ...
    this.props.postProductComment(productComment);
  };
  
  render() {
    const { comments, users } = this.props;
    // ...
  }
}

const mapStateToProps = state => ({
  users: usersSelector(state),
  comments: commentsSelector(state),
});

const mapDispatchToProps = {
  fetchProductCommentsBySlug,
  removeProductCommentById,
  postProductComment,
};

connect(mapStateToProps, mapDispatchToProps)(Example);

Interceptors

Неправильно. По-хорошему у вас должно быть состояние корзины с объектами описывающими позиции. Как минимум это количество и id продукта:

{
  product_id: "223af-b4535-54e21-31233-12a122-b453d",
  quantity: 2.
}

По ним уже циклом и отображают позиции корзины, подставляя нужные товары.
Total будет надежней считать в редьюсере. Значение total надо пересчитывать заново при каждом добавлении/удалении позиций из корзины и изменении их количества. Для этого будет удобно складывать в объект позиции еще и цену товара.

Для решения вашей проблемы вам достаточно обновлять все данные одним вызовом:

onClick(e) {
  const { value, type } = e.target.dataset;

  this.setState({
    letter: this.state.letter + value,
    lastType: this.state.newType,
    newType: type,
    compareType: type === this.state.newType,
  });
}

Вы передаете вторым аргументом в useEffect пустой массив. Это значит, что функция колбек будет вызвана только при монтировании компонента. Вам следует передавать в массив второго аргумента match.url, тогда колбек будет вызываться после монтирования и каждый раз при изменении url.

const Hat = ({ match }) => {
  // ...
  useEffect(() => {
    fetch(`https://foo0022.firebaseio.com//male/hat.json`)
      .then(res => res.json())
      .then(setArrProd);
  }, [match.url]);
  // ...
}

Можно обернуть вызов xhr в Promise:

function promiseWrapper(url) {
  return new Promise(resolve => {
    const xhr = new XMLHttpRequest();
    xhr.open('GET', url);
    xhr.send();
    xhr.onload = () => {
      resolve(xhr.response);
    };
  });
}

вызвать последовательно:

async function getData() {
  const [res1] = await promiseWrapper(url1);
  const [res2] = await promiseWrapper(url2);

  return res1 + res2;
}

и уповать на сборщик мусора.

Вариант 1. Использовать шаблонный литерал:
<Link to={`/${item.anchor}`}>

MDN: Шаблонные строки.

Вариант 2. Конкатенация строк:
<Link to={'/' + item.anchor}>

class ComponentA extends React.PureComponent {
  state = { isMounted: true };

  removeB = () => {
    this.setState({ isMounted: false });
  };

  render() {
    const { isMounted } = this.state;

    return (
      <div>
        {isMounted && <ComponentB />}
        <ComponentC onClick={this.removeB} />
      </div>
    );
  }
}

Ничто не мешает вам передавать объект cinema в компонент целиком:

{this.state.cinemas.map(cinema => <ListItemCinema key={cinema.id} cinema={cinema} />)}

const ListItemCinema = ({ cinema }) => {
  const { subway, shortTitle, labels, title, mail } = cinema.attributes;
  
  /* some code */  

  return (
    <div>
      {/* some code */}
      <ul>
        {subway.map(station => <li key={station.name}>{station.name}</li>)}
      </ul>
    </div>
  );
}

Cсылки по теме:
Build your own Front-end Framework / Library
Didact: a DIY guide to build your own React
https://github.com/pomber/didact
Build Your Own React — A Step By Step Guide