hamed
f619449167
- Implement SettlementsPage for managing settlement requests with approval and rejection functionalities. - Create SmsPage for handling SMS templates, including creation, approval, rejection, and logging. - Add UserDetailPage to display detailed information about users. - Develop UsersPage for listing users with search, view, edit, and delete options. - Introduce new types for User, SmsTemplate, SmsLog, and Settlement to support the new features.
41 lines
1.1 KiB
TypeScript
41 lines
1.1 KiB
TypeScript
import React from 'react';
|
|
import { Link } from 'react-router-dom';
|
|
|
|
interface Crumb {
|
|
label: string;
|
|
to?: string;
|
|
}
|
|
|
|
interface Props {
|
|
title: string;
|
|
breadcrumbs?: Crumb[];
|
|
action?: React.ReactNode;
|
|
}
|
|
|
|
export default function PageHeader({ title, breadcrumbs, action }: Props) {
|
|
return (
|
|
<div className="flex items-start justify-between mb-6">
|
|
<div>
|
|
<h1 className="text-xl font-bold text-gray-900">{title}</h1>
|
|
{breadcrumbs && breadcrumbs.length > 0 && (
|
|
<nav className="flex items-center gap-1 mt-1 text-sm text-gray-500">
|
|
{breadcrumbs.map((crumb, i) => (
|
|
<React.Fragment key={i}>
|
|
{i > 0 && <span className="text-gray-300">/</span>}
|
|
{crumb.to ? (
|
|
<Link to={crumb.to} className="hover:text-primary-600 transition-colors">
|
|
{crumb.label}
|
|
</Link>
|
|
) : (
|
|
<span className="text-gray-700">{crumb.label}</span>
|
|
)}
|
|
</React.Fragment>
|
|
))}
|
|
</nav>
|
|
)}
|
|
</div>
|
|
{action && <div>{action}</div>}
|
|
</div>
|
|
);
|
|
}
|