abberati

Если ты на самом деле хочешь хранить в строке шаблонную строку (

"это строка `а это шаблонная строка внутри строки ${а тут переменная, которая не будет работать, потому что шаблонная строка находится в строке}` и это строка"

), то варианта два – либо выключи правило в .eslinrc, либо выключи правило для конкретно этой строчки кода (гуглить eslint disable comment).

Способ с контекстом – единственно возможный. И это не хак, вполне себе нормальный вариант.

Добавь dispatch в массивы к остальным зависимостям, как советует warning

Эти куски кода абсолютно эквивалентны. Только поэтому редактор и смог предложить замену.

({ active, setActive, ... props })

Фарш обратно не провернуть

Или это работает только, когда это относится к одному state, а не к разным?

Да, именно так

В каких случаях сработает данный useEffect?

Когда изменится value или handler

Какой смысл его указывать в массиве зависимостей?

Если код никогда-никогда не будет меняться, будет напечатан на золотой пластинке и отправлен в космос, то смысла нет.
Если же код будет поддерживаться и меняться, то в будущем может возникнуть ситуация, когда в useCallback появятся зависимости, то есть handler будет меняться. А useEffect об этом не узнает и возникнет баг.

Короткий ответ — нет, нельзя.
Длинный ответ в документации

Не передавать, а получать. Передают снаружи, а получают изнутри. Как нравится, как удобнее — так и делай.

Не можно, а нужно

Не существует никакого react flow. Есть flow — статический анализатор кода, который скорее мёртв, чем жив. Возьмите typescript, он отлично сочетается с react и живее всех живых.

Этот синтаксис (class properties или как-то так это называется) пока не входит в стандарт, поэтому интерпретатор падает на этой строчке. Нужно настроить еслинт, чтобы он мог обрабатывать такой синтаксис. Гуглить class properties eslint setup.