i1yas

className не принимает на вход функцию, только строки
Соотвественно передача пропса isWeekend в div бесполезна

Внутри map делать вот такое

if (todo.id === id) todo.completed = !todo.completed
return todo

Действительно, что могло пойти не так.

Strict Mode, в частности:

Strict mode can’t automatically detect side effects for you, but it can help you spot them by making them a little more deterministic. This is done by intentionally double-invoking the following methods:

...
setState updater functions (the first argument)
...

Вот это выражение:

if (todo.id === id) todo.completed = !todo.completed

это сайд-эффект.

Должно быть:

if (todo.id === id) return { ...todo, completed: !todo.completed }

Документация по редьюсерам https://redux.js.org/basics/reducers
В частности:

It's very important that the reducer stays pure. Things you should never do inside a reducer:
Mutate its arguments;
Perform side effects like API calls and routing transitions;
Call non-pure functions, e.g. Date.now() or Math.random().

Вы мутируете приходящий state

Чинить надо как-то так:

export function commentsReducer(state = {data: [], marker: false}, action) {
    switch (action.type) {
        case Comments.ADD_COMMENT: {
            let newData = state.data.slice(); // копируем массив
            newData.push({
                postId: action.payload.postId,
                body: action.payload.body,
                name: action.payload.name,
                id: state.data[state.data.length - 1].id + 1
            });
            
            // никакого state = ...
            return {...state, is_fetching: false, data: newData};
        }
    }
    return state;
}

setStates(prev => {
      prev.map(data => {
        if (data.id === Number(id)) {
          (data.state === 2) ? data.state = 0 : ++data.state
        }
      })
    })

Функция передаваемая в setStates не возвращает ничего, просто делает map и забывает результат, соотвественно в стейт ложится undefined, у которого метода .map нет, о чем и говорит ошибка
Нужно добавить:
return prev.map...

В map вы делаете похожу ошибку, плюс еще зачем-то мутируете данные.

if (data.id === Number(id)) {
          (data.state === 2) ? data.state = 0 : ++data.state
        }

Все что не попадет под это условие станет undefined, т.е. у вас массив будет такой структуры [,,,{},]
Внутри map надо переписать так:

data => {
        if (data.id === Number(id)) {
          return (data.state === 2) ? {...data, state: 0} : {...data, state: data.state + 1}          
        }
        return data
}

Посмотрите про синтакс стрелочных функций, если не знаете.
Без фигурных скобок () => expression
C фигурными скобками () => { return expression }
Возрат объекта () => ({ someObjectField: ... })

Вы же сами props скипаете

<Route path='/dialogue/:id' render={() => <DialogList />}/>

DialogList не получает никаких пропсов, вы его завернули в компонент, который игнорирует их, делайте тогда так:

<Route path='/dialogue/:id' render={(props) => <DialogList {...props}/>}/>

newArray = [
 ...todoData.slice(0, idx),
 ...todoData.slice(idx + 1)
]

Ну вот так я бы не советовал объединять массивы, лучше:

todoData.slice(0, idx).concat(todoData.slice(idx + 1))

Ну этот вариант скорее всего экономия на спичках, лучше использовать фильтр, если вы не оперируете каким-то невероятным количеством данных на клиенте (что уже странно).

В реакте есть конвенция, что теги с маленькой буквы трактуются как html теги, а с большой как компоненты.
Назовите компонент Footer

Тоже часто сталкивался с этой "проблемой". Фишка в том, что flow рассматривает самые худшие сценарии.
Вот ответ на SO
Такой тип позволяет сделать такую штуку:

function map(items: Array<Item>) {
  ...
  items.push({name: "Vasya"});
  ...
}
map(list)

Пушим объект типа Items, локально все ок, только мы его пушим в массив типа Array<Users>, у которого более строгий тип. Поэтому флоу ругается.
Решение:
function map<T: {name: string}>(items: Array<T>) {

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

<Image className="card-img-top profile__img img-vehicle" source={{uri:`https://localhost/image/${params.name.image}.jpg`}} />

class FeedPost extends Component {
  constructor(props) {
    super(props);
    this.state = {
      showComments: false
    }
  }
  handler = () => {
    this.setState({
      showComments: !this.state.showComments
    })
  };
  render = () => {
    const {post} = this.props;
    return <li>
      <div>{post.title}</div>
      <div
        onClick={this.handler}
        style={{
          cursor: "pointer",
          color: "blue",
          textDecoration: "underline",
          userSelect: "none"
        }}
      >
        {this.state.showComments ? "Hide comments" : "Show comments"}
      </div>
      {this.state.showComments && (
        <ul>
          {post.comments.map((comment, i) => (
            <li key={i}>{comment.text}</li>
          ))}
        </ul>
      )}
      <Link to={`/post/${post.id}`}>Open</Link>
    </li>
  }
}

Остальные компоненты не нужно трогать.

Правила должны идти в другом порядке. Пример
Это как if, если ты используешь min-width, то надо перебирать разрешения по возрастанию.

Вызываю где-то в коде без аргументов и все ок, Flow не видит проблем
api.addBlogPost()

Не может быть, будет ругаться в обоих случаях. Вот
Может где-то // @flow забыли

в моем понимании это что-то на подобии такого: a= b+c или a=b.

Выражение - это любая конструкция, которая вычисляется в значение. Одна переменная написанная просто так - это тоже выражение:

const a = 1;
a; // это выражение

Собственно, по умолчанию, пропсы реакта принимают строки, если нужно передать что-то другое, то нужно использовать фигурные скобки, даже если это число.

const addNumber = number => {
    return () => {
      setValue(prevValue => {
        const newValue = prevValue + number;
        if(newValue.length > 3) return prevValue;
        return newValue;
      });
    };
  };

onInput="checkLength(3,this)"
JSX - не html. Обработка событий в JSX. И вообще нужно почитать побольше про JSX.
Странное использование this, он не будет указывать куда надо, если так нужен DOM элемент, то нужно вытащить его из события:

<input id="txtF" type="number" onInput={e => checkLength(3, e.target)} />

Вам нужно хранить состоние данного элемента, вопрос где. Компонент может принимать на вход пропс и коллбек onClick, либо компонент может внутри себя рулить состоянием и обрабаывать нажатие. Для первого вам понадобится либо родительский компонент с состоянием и функциями обработчиками, либо отдельное хранилище состояния. Вариант с внутренним хранением состояния проще (но не всегда подходит):

const Element = props => {
  const [styleEnabled, setStyle] = useState(false);

  return (
    <div
      className={`myDIV ${styleEnabled ? "mystyle" : ""}`}
      onClick={e => setStyle(!styleEnabled)}
    >
      Toggle me
    </div>
  );
};

Ссылка на песочницу