Aetae

У тебя две совершенно разные проблемы в одном вопросе:

1. TS тебе пишет ошибку, что тип Date не может быть children'ом для компонента, и это так. Однако дело в том, что тип у тебя задан неверно, на самом деле у тебя там никакой не Date а банальный string. Если ты поправишь типы, то всё заработает и выведет тебе то что ты передаёшь, т.е. 2012-03-23T08:25:44.962Z.

2. Чтоб превратить строку 2012-03-23T08:25:44.962Z в строку Created 7 years ago надо либо руками написать соответствующую функцию, либо воспользоваться какой-либо библиотекой для работы с датами. Например с помощью moment это будет выглядеть примерно так:

const createdFromNow = `Created ${
  moment.duration(moment().diff(data.createdAt)).humanize()
} ago`;

А ещё динамическая типизация сильно экономит время на написание кода - это очень нехилая оптимизация рабочего процесса.

Это утверждение верно относительно языков с изначально статической типизацией против языков с динамической, но не верно для TS как такового. Если не использовать маньячные правила типа обязательного ручного проставления типов, то в 80% случаев TS сам прекрасно выводит тип, без лишних телодвижений.
Огромное ускорение от типизированого автокомплита в IDE и отсутствия возможности, например, случайно кинуть в функцию объект вместо строки, с лихвой перекрывает оставшиеся 20%.
Редкие случаи когда TS писал мне "какую-то хрень" и отказывался что-то делать, заставляя сидеть и разбираться - на поверку оказывались сильно неочевидными косяками в моём коде, которые могли бы привести к реальным багам.

Можно с помощью declaration merging, но осторожно. В таких штуках все риски ты берёшь на себя:

class Widget {
  render() {
    this.doStuff();
  }
}

interface Widget {
    doStuff(): string
}

// потом это сделает сторонний код
Widget.prototype.doStuff = () => 'doingstuff';

Ну как обычно со всем остальным: вынести в общую библиотеку либо вынести в гит-модуль.

useMemo - это не магическое заклинание. Оно работает сверяя изменения переданных props не более того.
В твоём случае в useMemomemo надо обернуть сам компонент Replay, а не голый jsx.

Во-первых: не работайте с html через регулярки.
Во-вторых: см. во-первых.
В-третьих: `(?<=>)(${letter})(?=<)`

Ошибка в том что файл у вас читается как js, а не как ts. Разберитесь с конфигами.

Ещёб чужие функции мне поток останавливали.)
Нет, низя. И слава богу.

Не используйте localStorage напрямую, напишите минимальюную обёртку-hook, положите в context или используйте одну из 100500 готовых библиотек для store в react.

type Extensions = {
  Category: typeof LayoutMenuCategory;
  Item: typeof LayoutMenuItem;
};

Иначе оно для ts может быть также и undefined, а undefined - то, что написано в ошибке.

Вариантов много.
Самый вероятный(после банальной ошибки в твоём коде само собой): используется сторонняя библиотека получаемая извне без явной привязки к конкретной версии. Т.е.: обновилась библиотека, поменялся её интерфейс, код перестал работать.
Самый невероятный: с обновлением браузера изменилась какая-то мелочь в его интерпретации твоего кода. Такое практически исключено, разработчики бразуеров очень сильно пекутся об обратной совместимости.

TS тебе предельно понятно написал в чём проблема. Учись читать ошибки.

Конкретнее же: у тебя не задан тип значения которое может принимать контекст, а выведено самим TS - null(потому что именно такое значение по умолчанию ты передал).

export const Context = createContext<{
  sidebarIsOpen: boolean;
  toggleSidebar: (value: boolean) => void;
} | null>(null)

или лучше

export const Context = createContext({
  sidebarIsOpen: false,
  toggleSidebar: () => {}
});

Ну по enter у тебя же что-то происходит? Вот перед основным кодом триггерни blur руками:

document.activeElement.dispatchEvent(new Event('blur'));

Это конечно костыль, и по логике тебе надо написать кастомную обработку варианта с onChange, но и так, наверное, сойдёт.

Условно как-то так:

const betsArr = ref();
watch(<то что было в computed>, debounce((value) => betsArr.value = value, 1000));

webpack devServer, в частности функция proxy.
Webpack поднимает сервер с горячей перезагрузкой фронта, бэк сервера поднимаешь на других портах, и обращаешься к api прозрачно с помощью встроенного прокси.

Потому что не isDropped(oldVal, newVal), а isDropped(newVal, oldVal), лол.

= - это присваивание, а не изменение. В случае с объектом присваивание ссылки, но всё ещё присваивание.