hamed
e0e8fbd1e4
- 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.
24 lines
1012 B
TypeScript
24 lines
1012 B
TypeScript
import { ChevronRightIcon } from '@heroicons/react/24/outline';
|
|
import { useGoBack } from '../../hooks/useGoBack';
|
|
|
|
interface Props {
|
|
/** مقصد وقتی تاریخچهای برای برگشتن نیست (ورود مستقیم/رفرش) — معمولاً صفحهٔ لیستِ همان بخش. */
|
|
fallback: string;
|
|
label?: string;
|
|
}
|
|
|
|
/**
|
|
* دکمهٔ «بازگشت» — یک ظاهر و یک رفتار در همهٔ صفحاتی که از دل صفحهٔ دیگری باز میشوند.
|
|
* ظاهر مرجع، همان دکمهٔ بازگشتِ صفحهٔ سرویسهاست (`cp-btn-secondary` با ارتفاع ۳۶).
|
|
* در RTL، فلشِ «قبلی» راستسو است.
|
|
*/
|
|
export default function BackButton({ fallback, label = 'بازگشت' }: Props) {
|
|
const goBack = useGoBack(fallback);
|
|
|
|
return (
|
|
<button type="button" className="cp-btn-secondary" style={{ height: 36 }} onClick={goBack}>
|
|
<ChevronRightIcon style={{ width: 16 }} /> {label}
|
|
</button>
|
|
);
|
|
}
|