Alexandroppolus

Исправленный вариант - https://codesandbox.io/s/immutable-breeze-ycwnoy

Почему исходный не работал: в компонент А передавалась функция, которая замыкала count. Компонент по факту монтирования вешал функцию в onclick дива, и больше никак не менял этот див. То есть в обработчике клика навсегда застревала функция, которая была создана на первом рендере Арр и замкнула count===0. При повторном рендере Арр создавались новые функции, но они не применялись.

в новом варианте навтыкал console.log, чтобы было видно, когда и что происходит.

const FormCreateReview = React.memo(() => {
   ... 
});

а если так?

type UseUserData = [UserType[], (v: UserType[]) => void]

interface Name {
    name: string;
}

interface LastName {
    lastName: string;
    family: string[];
}

function Component(props: Name): React.ReactElement;
function Component(props: LastName): React.ReactElement;
function Component(props: Name | LastName): React.ReactElement {
    if ('family' in props) {
        return <b>{props.lastName}</b>
    } else {
        return <b>{props.name}</b>
    }
}

Использовать React.memo для MyItem

export default const MyItem = React.memo(({ item, setNewItemData }) => {
   ....
});

в компоненте Test функцию setNewItemData обернуть в useCallback, чтобы она была постоянной. Для этого внутри неё использовать setItems с передачей в него функции, чтобы setNewItemData не зависело от items

let [items, setItems] = useState(myData);

    const setNewItemData = useCallback((itemId, data) => {
        setItems((items) => {
            return items.map(item => {
                if (item.id !== itemId) {
                    return item;
                }
    
                return {...item, data}
            });
        });
    }, [setItems]);

const [search,setSearch] = useState(null);

поменяй стартовое значение
const [search,setSearch] = useState('');

а то до замены этого стейта, в фильтре тасков делается task.includes(null) и возвращает false, потому что в этой функции аргумент приводится к строке, null превращается в 'null'

лучше определить тип явно, а при создании контекста воткнуть пустую заглушку - всё равно через провайдер будет подставлено реальное значение.

type MyContextType = {
  name: string;
  link: string;
  owner: {
    _id: string;
  };
}

const context = React.createContext({} as MyContextType);

А какая версия роутера? В 6 нет пропса render, есть element

Иногда может оптимизировать. Например

const [x, setX] = useState(0);
const f = useCallback(() => setX(x => x + 1), []);

Здесь f одна и та же, не пересоздается на каждый новый х. Если f передавать в пропсы мемо-компонента, он не будет апдейтиться, если не зависит от х.

Сделай не метку на карте, а отдельный элемент, позиционированный в центре контейнера с картой. Тогда он не будет ездить при перетаскивании. По завершении перетаскивания - смотреть координаты центра карты, это считать как место где стоит указатель

App не помечен как observer, потому не перерендеривается при изменении chatMsgStore.chatmsg, и его useEffect срабатывает только один раз, в начале.
Про addChatMsg(msg) не понял вопроса.

static async getAllPosts() {

убери static

import { Routes, Route, useParams } from 'react-router-dom';

const UserDetailsPage = () => {
	const { id } = useParams();
	return <UserDetails userId={ id } />}}/>
}

<Route path='/users/:id' element={<UserDetailsPage />}/>