feat: implement BackButton component for consistent navigation
- Added BackButton component to standardize back navigation across pages. - Integrated BackButton into various pages, replacing custom back buttons for consistency. - Updated PageHeader to accept backTo prop for displaying BackButton when navigating from subpages. - Created useGoBack hook to handle navigation logic, determining whether to go back in history or redirect to a fallback page. - Added tests for BackButton and its integration with PageHeader to ensure expected behavior.
This commit is contained in:
@@ -139,13 +139,24 @@ Theming: **dark mode** overrides via `[data-theme="dark"]`; **compact density**
|
||||
Reuse these before building new ones:
|
||||
|
||||
`DataTable` (sortable, search, skeleton loading, empty state, bulk) · `Modal` · `ConfirmDialog` ·
|
||||
`PageHeader` (title + breadcrumb + action) · `StatCard` · `StatusBadge` · `Pagination` ·
|
||||
`SearchableSelect` · `AppointmentStatusDropdown` · `PersianDateInput` / `PersianDatePicker` /
|
||||
`PageHeader` (title + breadcrumb + action + `backTo`) · `BackButton` · `StatCard` · `StatusBadge` ·
|
||||
`Pagination` · `SearchableSelect` · `AppointmentStatusDropdown` · `PersianDateInput` / `PersianDatePicker` /
|
||||
`PersianCalendar` · `MobileInput` · `PriceInput` · `Portal` · `FeatureGate` · `Altcha` ·
|
||||
`InviteDoctorModal` · `PwaInstallBanner` / `PwaLoginCard` / `NotificationMobileCard`.
|
||||
|
||||
Feature composites (not generic) live one level up in `components/*.tsx`.
|
||||
|
||||
### دکمهٔ بازگشت — الزامی در صفحات زیرمجموعه
|
||||
|
||||
هر صفحهای که از دل صفحهٔ دیگری باز میشود (جزئیات، فرم ساخت/ویرایش، زیرصفحههای تنظیمات)
|
||||
باید دکمهٔ «بازگشت» داشته باشد، با یک ظاهر و یک رفتار:
|
||||
|
||||
- صفحاتی که `PageHeader` دارند: فقط `backTo="/admin/…"` بدهید.
|
||||
- بقیه: `<BackButton fallback="/admin/…" />` بالای هدر صفحه.
|
||||
- دکمهٔ دستساز نسازید — ظاهر مرجع `cp-btn-secondary` با ارتفاع ۳۶ و آیکون `ChevronRightIcon` است
|
||||
(همان دکمهٔ صفحهٔ سرویسها) و رفتارش در `hooks/useGoBack.ts` متمرکز است: یک قدم عقب در تاریخچهٔ
|
||||
پنل، و در ورود مستقیم/رفرش (`location.key === 'default'`) رفتن به `fallback`.
|
||||
|
||||
---
|
||||
|
||||
## Conventions
|
||||
|
||||
Reference in New Issue
Block a user