Feature(HW08): routing, Redux auth and HOC withAuth

[goodman74]

Реализация HW08:

• добавлен react-router (public/private страницы)
• реализован HOC withAuth для защиты /partner/*
• добавлен Redux (auth + demoIdentity)
• добавлены Login / Register (frontend-only)
• подключён Mantine, введён базовый AppFrame

[goodman74]

1. Конфигурация Backend & Frontend

В качестве API используется backend из HW06.

1.1 Запуск Backend (dotnet CLI / Visual Studio)

cd "H:\_ASP.NET\HW.OTUS\HW07.OTUS.ASP.NET"
dotnet build
dotnet run --project .\backend\PromoCodeFactory.WebHost

После запуска backend доступен по адресу:

http://localhost:8091

Этот порт используется frontend-приложением через Vite proxy.

---

1.2 Запуск Backend через Docker Compose

cd "H:\_ASP.NET\HW.OTUS\HW07.OTUS.ASP.NET"
docker compose -f docker-compose.Development.yml build
docker compose -f docker-compose.Development.yml up -d

---

1.3 Frontend

Frontend реализован на React + Vite + TypeScript (TSX).

Дополнительно (по сравнению с HW07):

ESLint
Zod

Добавлены библиотеки:

@mantine/core @mantine/hooks
react-router-dom
@reduxjs/toolkit
react-redux
@tabler/icons-react

---

1.4 Запуск Frontend

cd "H:\_ASP.NET\HW.OTUS\HW07.OTUS.ASP.NET\frontend"
npm run dev

Frontend доступен по адресу:

http://localhost:5173/

---

2. Комментарии к реализации HW08

2.1 Роутинг

• Используется декларативный роутинг (AppRoutes.tsx)

• Реализована публичная страница / (HomePage, из HW07)

• На HomePage размещены ссылки на приватные страницы:

  /partner/profile
  /partner/limits
  

• Добавлена fallback-страница (NotFoundPage)

---

2.2 Redux

Так как backend API для регистрации и авторизации в рамках задания не используется,
Login и Register реализованы как frontend-only сценарии.

Redux используется для хранения:

• демо Identity данных пользователя
• состояния авторизации

Используются отдельные slice’ы:

demoIdentitySlice — используется только в рамках ДЗ для эмуляции Login/Register
authSlice — хранит состояние авторизации

---

2.3 UI библиотека

Используется:

Mantine (включая hooks)
tabler/icons-react

---

2.4 Демонстрация применения HOC

Реализован HOC withAuth, который:

• проверяет статус авторизации пользователя
• выполняет редирект на /login, если пользователь не авторизован

Применяется к приватным страницам:

const ProtectedPartnerProfile = withAuth(PartnerProfile);
const ProtectedPartnerLimits = withAuth(PartnerLimits);

---

2.5 Демонстрация переиспользования кода

• Реализован AppFrame — общий layout (Header / Main / Footer), используемый всеми страницами
• Реализован универсальный компонент ResultBlock для отображения состояний UI (idle/loading/success/error)