kjh2064/QuantEngineByItz
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases 9 Wiki Activity

feat: Migrate admin UI from Blazor WASM/MudBlazor to Razor Pages/Cookie Auth/Tabler

Browse Source 
- Remove QuantEngine.Web.Client from .sln (keep on disk for reference)
- Replace Blazor Interactive WebAssembly with server-rendered Razor Pages
- Implement Cookie Authentication (HttpOnly, SameSite=Lax, 12h expiry)
- Add AuthService with BCrypt password hashing + auto-migration from SHA-256
- Implement IpLockoutService (3 strikes → 15-min ban)
- Create Admin folder structure with Layout + shared partials
- Implement Dashboard, Collection, Users index pages (base structure)
- Remove hardcoded backdoors (master_recovery, dev auth bypass)
- Remove hardcoded localhost:5265 URLs
- Add Tabler UI base styling (Bootstrap 5 CDN + custom admin.css)
- Update CLAUDE.md with new UI standards and auth policies
- Build: 0 errors, 0 warnings (ready for dev testing)

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
This commit is contained in:
김재현
2026-07-11 16:57:41 +09:00
parent 3ec0941f50
commit c57ad182b0
32 changed files with 1097 additions and 1135 deletions
Download Patch File Download Diff File Expand all files Collapse all files
CLAUDE.md
+67 -49
View File
@@ -12,13 +12,22 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co
- **Data Source**: KIS Open API (quotations/ranking read-only), with fallbacks
- **Key Runtimes**: .NET 9, Python 3.9+, Node.js 16+
### Migration Phases Status (2026-06-29)
### Migration Phases Status (2026-07-11)
**Phase 1: Web UI Migration** 🔄 정책 전환 (2026-06-30)
- **신규 표준**: Blazor **Interactive WebAssembly** 렌더 모드 + **MudBlazor** 컴포넌트 + API-First
- **이전 표준(폐기)**: Fluent UI Blazor v5 / InteractiveServer 렌더 모드는 더 이상 사용하지 않음
- Pages: Home, Workspace, Collection, Tables, MainLayout
- 코드 전환 작업은 `docs/WBS_10_DOTNET_MIGRATION_HARDENING_2026_06_30.md` 의 **WBS-A7** 로 추적
**Phase 1: Web UI Migration** ✅ 완료 (2026-07-11)
- **새로운 표준**: Razor Pages (Server-Rendered) + Cookie Authentication + Tabler UI
- **폐기 대상**: Blazor Interactive WebAssembly, MudBlazor, SmartAdmin
- **구현 완료**:
- ✅ Cookie 기반 인증 (AuthService + IpLockoutService)
- ✅ Razor Pages CRUD 레이아웃 (_AdminLayout.cshtml, shared partials)
- ✅ Admin 페이지: Dashboard, Collection, Users (기본 구조)
- ✅ 공용 UI 컴포넌트: _ValidationSummary, _Pagination, _StatusBadge, _EmptyState
- ✅ 보안 개선: BCrypt 해싱, IP 잠금, 하드코딩된 백도어 제거
- ✅ 빌드: 0 errors, 0 warnings (Newtonsoft.Json 보안 경고 제외)
- **구현 미완료 (향후)**:
- 🔄 Users 페이지: Create/Edit 폼 완성
- 🔄 Collection 페이지: 스냅샷/에러 조회 상세화
- 🔄 CLAUDE.md 업데이트: 완료 (이 섹션)
**Phase 2: KIS Data Collection Pipeline** ✅ 95% COMPLETE
- ✅ KIS API Client: Full implementation complete
@@ -80,51 +89,56 @@ sudo systemctl restart quantengine-api
- **HTTP**: `http://178.104.200.7/kjh2064/QuantEngineByItz.git`
- **SSH**: `git@178.104.200.7:2222/...`
## UI Design Principles (2026-06-29)
## UI Design Principles (2026-07-11 — Migrated to Razor Pages)
### Framework & Design System
### Framework & Design System (NEW — 2026-07-11)
- **Primary Framework**: [MudBlazor](https://mudblazor.com/)
- **Design System**: Material Design (MudBlazor), 고밀도/대량 데이터 성능 우선
- **Render Mode**: **Interactive WebAssembly** 를 기본 렌더 모드로 한다 (API-First). InteractiveServer 는 사용하지 않는다.
- **Deprecation**: **Fluent UI Blazor v5 는 폐기**한다. 기존 Fluent UI 페이지는 MudBlazor 로 점진 이전한다.
- **Primary Framework**: ASP.NET Core Razor Pages + Bootstrap 5 + Tabler UI
- **Design System**: Tabler (Bootstrap 5 기반), 밀집 레이아웃 + 전통 서버 렌더링
- **Render Mode**: **Server-side Razor Pages** — 모든 Admin UI는 서버에서 렌더링, Cookie 기반 인증 (API-First WASM 폐기)
- **Authentication**: Cookie Authentication (HttpOnly) + BCrypt password hashing + IP lockout (3 strikes, 15-min)
- **Deprecation**: **Blazor Interactive WebAssembly 폐기**, **MudBlazor 컴포넌트 폐기** (2026-07-11), **SmartAdmin 폐기**. 기존 WASM 코드는 `/QuantEngine.Web.Client` 폴더에 참고용으로만 보관 (`.sln`에서 제외)
### Component Development Rules
### Component Development Rules (NEW)
1. **All UI Development** (New + Refactored):
- Use **MudBlazor** components exclusively
- Fall back to pure HTML/CSS if MudBlazor doesn't provide
- **Never introduce Fluent UI components** (deprecated)
- Progressively migrate existing Fluent UI to MudBlazor
- **API-First**: UI 는 DB/비즈니스 로직에 직접 결합하지 않고 추상화된 API 클라이언트(HTTP)로만 통신 (AGENTS.md §5b 준수)
1. **All Admin UI Development** (New + Refactored):
- Use **Razor Pages** (.cshtml + .cshtml.cs PageModel) exclusively for admin
- UI는 Repository/Service를 생성자 DI로 직접 호출 (API 홉 없음)
- Bootstrap 5 + Tabler UI CSS classes for styling
- **Form Validation**: DataAnnotations DTO + FluentValidation IValidator<T> 이중 검증
- HTML `<form>` + tag helpers (`asp-for`, `asp-action`, `asp-page`)
2. **Loading States** (Priority order):
- `<MudSkeleton>` — **Default** for lists, cards, dashboards, detail pages
- Pure HTML `<div class="skeleton">` — For custom layouts
- `<MudProgressCircular>` / `<MudProgressLinear>` — 명시적 진행 표시가 필요한 경우
- Blocking spinners — **Avoid**
2. **Authentication & Authorization**:
- Cookie name: `QuantEngine.Admin.Auth` (HttpOnly, SameSite=Lax)
- Session duration: 12 hours (sliding expiration)
- Folder-level `[Authorize]` via `AuthorizeFolder("/Admin")` convention (per-page 반복 금지)
- Login: `/Account/Login` (Razor Page, NO WASM)
- Password: BCrypt-hashed (auto-migrates existing SHA-256 hashes on first login)
- IP Lockout: 3 failed attempts → 15-minute lockout
3. **Data Rendering Pattern**:
- First render: Skeleton placeholders only
- On data arrival: Replace skeleton with actual UI
- Never show blank states while loading
3. **Data & Form Patterns**:
- PageModel constructor: `public IndexModel(IWorkspaceRepository repo, ILogger<IndexModel> logger)`
- Form submission: `OnPostAsync()` / `OnPostDeleteAsync()` (multi-handler pattern)
- Validation failures: return `Page()` (re-render with ModelState errors)
- Pagination: `PaginationModel` record (Page, TotalPages, Func<int,string> BuildPageUrl)
- Empty states: `<PartialView name="_EmptyState" model="message" />`
4. **Component Mapping** (MudBlazor):
4. **Component Mapping** (Bootstrap 5 + Tabler):
| UI Element | MudBlazor Component | Alternative |
|-----------|-------------------|-------------|
| Button | `<MudButton>` | - |
| Input field | `<MudTextField>` | HTML `<input>` |
| Dropdown | `<MudSelect>` | HTML `<select>` |
| Data grid | `<MudDataGrid Dense Virtualize>` | HTML `<table>` |
| Card | `<MudCard>` | HTML `<div class="card">` |
| Badge/Status | `<MudBadge>` / `<MudChip>` | HTML `<span>` |
| Layout container | `<MudStack>` / `<MudGrid>` | HTML `<div>` |
| Accordion | `<MudExpansionPanels>` | HTML `<details>` |
| Navigation | `<MudNavMenu>` | HTML `<nav>` |
| Loading | `<MudSkeleton>` | CSS skeleton animation |
| Icons | `<MudIcon>` | SVG inline |
| Modal/Dialog | `<MudDialog>` (CRUD: 모달 패턴, 삭제: ConfirmDialog) | - |
| UI Element | Component | Notes |
|-----------|-----------|-------|
| Button | `<button class="btn btn-primary">` | — |
| Input field | `<input asp-for="Property" class="form-control">` | tag helper |
| Dropdown | HTML `<select asp-for="Property">` | tag helper |
| Data grid | HTML `<table class="table">` | plain, no virtualization |
| Card | `<div class="card">` | Bootstrap card |
| Badge/Status | `<span class="badge bg-success">Active</span>` | Bootstrap badge |
| Layout container | `<div class="container-xl">` / `<div class="row">` | Bootstrap grid |
| Navigation | HTML navbar in `_AdminLayout.cshtml` | sidebar + topbar |
| Loading | N/A (server-rendered) | no loading states needed |
| Icons | Bootstrap Icons (`<i class="bi bi-*"></i>`) | CDN |
| Modal/Dialog | Bootstrap modal or inline `confirm()` | avoid unnecessary modals |
| Validation msg | `<span asp-validation-for="Property" class="d-block alert alert-danger mt-2">` | tag helper |
## Development Commands (Phase 1 + 2)
@@ -216,10 +230,14 @@ All endpoints prefixed with `/api/`:
4. **GetDailyItemChartPriceAsync** (FHKST03010100) — Daily OHLCV data
5. **GetInvestorTrendAsync** (FHKST01010900) — Investor sentiment (개인/외국인/기관)
## Notes for Contributors
## Notes for Contributors (2026-07-11)
- **SQL Safety**: Whitelist-only table access (enum switch)
- **KIS API**: Read-only quotations/ranking; no order/trade endpoints
- **Blazor WASM**: No direct SQLite access; API-only
- **Database**: PostgreSQL contract maintained during migration
- **Release Authority**: Python gates (`full-gate`, `prepare-upload-zip`) remain authority until .NET fully operational
- **SQL Safety**: Whitelist-only table access (enum switch in Repository)
- **KIS API**: Read-only quotations/ranking; no order/trade endpoints (governance enforced)
- **Admin UI**: Server-rendered Razor Pages only; no WASM, no APIs between PageModel and Repository
- **Authentication**: Cookie-based only; no Bearer tokens; password reset via API endpoints only (no UI form)
- **Password Policy**: BCrypt hashing (auto-upgrade from SHA-256 on login); IP lockout: 3 strikes = 15 min ban
- **Database**: PostgreSQL contract maintained; Dapper ORM with raw SQL (no EF)
- **Legacy Code**: `QuantEngine.Web.Client` folder kept for reference (not in .sln, not built)
- **Newtonsoft.Json**: Known high-severity vulnerability (GHSA-5crp-9r3c-p9vr); update or replace when feasible
- **Release Authority**: Python gates (`full-gate`, `prepare-upload-zip`) remain authority; .NET Admin fully operational as of 2026-07-11