Kostenitskiy_A

Попробуй так

const newArrayId = this.state.countId;
newArrayId.map((element) => { element.quantity + 1 });
this.setState({countId: newArrayId});

1 строка - создаёшь новый массив на основе объектов из this.state.countId
2 строка - перебираешь элементы нового массива и увеличиваешь quantity на 1
3 строка - меняешь своё состояние

Как я понял из описания вопроса. Тебе нужно добавить элемент в массив parameterCountry, но добавление проходит во все массивы. В данном случае тебе нужно исправить кейс reducer'а

case SET_PARAMETER_LIST:
      const newParameterCountry = [...state.parameterCountry];
      newParameterCountry.push(action.payload);
      return {
        ...state,
        parameterCountry: newParameterCountry,
      };

2 строка - создаёшь новый массив и заполняешь его элементами из предыдущего массива parameterCountry
3 строка - добавляешь элемент в созданный массив
и после возвращаешь новый объект уже с новым состоянием

В данном случае ошибка в была в кейсе reducer'a EditTodo. В reducer'е необходимо возвращаться новое состояние, а не редактировать старое. После исправлений код выглядит так:

case EDIT_TODO: {
      const index = state.todos.findIndex((todo) => todo.id == action.payload.id);
      const newTodos = [...state.todos];
      newTodos[index] = action.payload;
      return { ...state, todos: newTodos };
}

2 строка - находим индекс редактируемого элемента
3 строка - создаём новый массив на основании предыдущего состояния
4 строка - изменяем редактируемый элемент уже нового массива
5 строка - возвращаем созданное состояние

Если хочешь убрать горизонтальный скролл, примени это свойство к контейнеру в котором находятся элементы

overflow-x: hidden;