Приведи пример структуры проекта когда внедряем новый функционал

Смотри, ну вот реально, как же заебало это бардак в проектах устраивать! Ты открываешь папку components, а там — пиздец, хуй пойми что: кнопки, формы, хедеры, футеры, хуи, палки, дрова, всё в одну кучу! Потом ищешь, где логика к одному фичу прикручена, а она размазана по трём континентам и двум вселенным, блядь.

Так вот, слушай сюда, пока я не взорвался. Есть одна охуенно простая идея, называется Feature-Sliced Design. Суть в том, чтобы не срать по углам, а класть всё по полочкам. Смотри, как это выглядит, если делать по-человечески:

src/
  features/                    <-- Вот тут вся магия живёт!
    newFeature/               <-- Берём одну фичу, например, "Корзина" или "Лента новостей"
      components/             <-- Компоненты, которые ТОЛЬКО этой фиче принадлежат
        NewComponent.tsx      <-- Вот этот красавец
        NewComponent.styles.ts
      hooks/                  <-- Кастомные хуки, которые ТОЛЬКО тут нужны
        useNewFeature.ts
      types/                  <-- Типы и интерфейсы, локальные для фичи
        newFeatureTypes.ts
      utils/                  <-- Вспомогательные функции-помощники
        newFeatureUtils.ts
      index.ts                <-- Главный выход в свет! Отсюда всё экспортируем
  shared/                     <-- А это наш общак, склад запчастей
    components/               <-- То, что везде юзается: Кнопка, Инпут, Модалка
      Button.tsx
    hooks/                    <-- Хуки общие, типа useLocalStorage
      useCommonHook.ts
    types/                    <-- Глобальные типы, от которых всё пляшет
      commonTypes.ts
  app/                        <-- Всё, что касается глобальной конфигурации
    store/                    <-- Слайсы для стейт-менеджера
      newFeatureSlice.ts
    routes.ts                 <-- Маршрутизация
    App.tsx                   <-- Само приложение, мать его

Основные правила, которые надо вбить себе в башку, чтобы не быть мудаком:

1. Функционал группируется в папку features. Каждая фича — это как отдельный модуль, микросервис в миниатюре. Всё, что ей нужно для жизни, лежит внутри неё. Она самодостаточная, как ёж в тумане.
2. Каждая фича содержит все необходимые части. Не надо бегать по всему проекту и собирать пазл. Компоненты, логика, типы, стили — всё тут, под рукой. Удобно, блядь!
3. Общие элементы выносятся в shared. Если кнопка или хук юзается в пяти разных фичах — ему не место в одной из них. Он идёт на общую полку, в shared. Чтобы не было дублей и чтобы все одним говном мазались.
4. Глобальные настройки в app. Роутинг, стейт-менеджмент (глобальные слайсы), провайдеры — это всё живёт здесь. Выше только небо.
5. Экспорт через index.ts для чистого импорта. Это, блядь, гениально просто. Внутри папки фичи создаёшь index.ts и пишешь там что-то типа:

export { NewComponent } from './components/NewComponent';
export { useNewFeature } from './hooks/useNewFeature';
// и так далее...

И тогда, когда тебе эта фича понадобится в другом месте, ты импортируешь её красиво и понятно, без этих долбаных относительных путей в три этажа:

// Вместо этого ужаса:
// import { NewComponent } from '../../../../features/newFeature/components/NewComponent';

// Делаешь так — чисто, аккуратно, по-взрослому:
import { NewComponent, useNewFeature } from 'features/newFeature';

Вот и вся философия, ёпта. Не размазывай логику, не создавай спагетти-код, клади вещи на свои места. И тогда жить станет проще, а код — не таким ебучем для понимания. Всем чмоки в этом чате!