solution

[VitaliiShc]

DEMO LINK

[VitaliiShc]

[VolodymyrKirichenko]

Well done 🔥

[VolodymyrKirichenko]

u don't need null for this state.
ErrorMessage.default = ''

Suggested change

	const [errorMessage, setErrorMessage] = useState<ErrorMessage | null>(null);
	const [errorMessage, setErrorMessage] = useState<ErrorMessage>(ErrorMessage.Default);

[VolodymyrKirichenko]

1. will be better, right?
2. 2. It is better to move all useEffect to the bottom(before render), for better support, and readability

Suggested change

	(async () => {
	try {
	setTodos(await getTodos());
	} catch (err) {
	setErrorMessage(ErrorMessage.LoadError);
	}
	})();
	const getAllTodos = async () => {
	try {
	setTodos(await getTodos());
	} catch (err) {
	setErrorMessage(ErrorMessage.LoadError);
	}
	}
	getAllTodos();

[VolodymyrKirichenko]

useCallback?

[VolodymyrKirichenko]

u can use another syntax(up to u)

Suggested change

	setFilterValue: Dispatch<SetStateAction<StatusFilter>>;
	setFilterValue: (filterValue: StatusFilter) => void;

[VolodymyrKirichenko]

more readable

Suggested change

	href={`#/${value === StatusFilter.All ? '' : value}`}
	href={`#/${value !== StatusFilter.All && value}`}