Files
clinicpro/assets/admin/components/layout/SettingsLayout.tsx
T
hamed 6ab7ed38b8 feat: refactor clinic management into a dedicated settings tab
- Removed MyClinicPage and redirected its functionality to a new ClinicDoctorsPage.
- Created ClinicDoctorsManager component for managing doctors and invitations within the settings layout.
- Updated backend permissions to allow clinic owners to detach doctors, alongside admins.
- Adjusted API documentation to reflect new permission structure.
- Updated tests to cover new functionality and permissions.
- Modified sidebar and settings menu to reflect the new structure and role-based visibility.
2026-07-17 21:56:27 +03:30

61 lines
3.7 KiB
TypeScript

import React from 'react';
import {
CreditCardIcon, UserIcon, CalendarDaysIcon, BuildingOffice2Icon,
BanknotesIcon, UsersIcon, ShieldCheckIcon,
TagIcon, ChatBubbleLeftRightIcon, UserCircleIcon, UserPlusIcon, ReceiptPercentIcon,
} from '@heroicons/react/24/outline';
import PurchaseSubscriptionSidebar from './PurchaseSubscriptionSidebar';
// ── Settings menu configuration ─────────────────────────────────────────────
// Source of truth for the *mobile* settings list (SettingsMenuPage). The desktop
// shell renders the shared PurchaseSubscriptionSidebar instead, so there is a
// single settings sidebar across all settings pages (no duplicate menu).
export type SettingsMenuItem = {
key: string;
label: string;
icon: React.ElementType;
to?: string;
/** when set, the item is only shown to these roles (omit = every role) */
roles?: string[];
};
export const SETTINGS_MENU: SettingsMenuItem[] = [
{ key: 'subscription', label: 'خرید اشتراک', icon: CreditCardIcon, to: '/admin/subscription' },
{ key: 'doctor', label: 'مدیریت پزشک', icon: UserIcon, to: '/admin/profile', roles: ['doctor'] },
{ key: 'appointment', label: 'مدیریت نوبت دهی', icon: CalendarDaysIcon, to: '/admin/appointment-settings', roles: ['doctor'] },
{ key: 'clinic-doctors', label: 'پزشکان کلینیک', icon: BuildingOffice2Icon, to: '/admin/settings/clinic-doctors', roles: ['clinic'] },
{ key: 'payment', label: 'مدیریت پرداخت', icon: BanknotesIcon, to: '/admin/my-financial' },
{ key: 'secretary', label: 'مدیریت منشی', icon: UsersIcon, to: '/admin/my-secretaries' },
{ key: 'staff', label: 'پرسنل', icon: UserPlusIcon, to: '/admin/staff' },
{ key: 'insurance', label: 'مدیریت بیمه', icon: ShieldCheckIcon, to: '/admin/insurance-pricing' },
{ key: 'discounts', label: 'مدیریت تخفیف‌ها', icon: ReceiptPercentIcon, to: '/admin/discounts', roles: ['doctor', 'clinic'] },
{ key: 'tags', label: 'برچسب‌ها', icon: TagIcon, to: '/admin/tags-settings' },
{ key: 'sms', label: 'پیامک‌ها', icon: ChatBubbleLeftRightIcon, to: '/admin/sms-wallet' },
{ key: 'account', label: 'حساب کاربری', icon: UserCircleIcon, to: '/admin/account-settings' },
];
/** Menu items visible to the given role (items without `roles` are shown to all). */
export function menuForRole(role: string | null | undefined): SettingsMenuItem[] {
return SETTINGS_MENU.filter((i) => !i.roles || (role != null && i.roles.includes(role)));
}
/**
* SettingsLayout — presentational shell for the doctor/clinic settings area.
* Renders the shared settings sidebar (PurchaseSubscriptionSidebar) beside the
* page content, so every settings page shows the exact same menu as the
* subscription page. Full-width so the sidebar sits flush against the main nav.
*
* @param active key of the currently-open settings section (highlighted)
* @param children the section content (e.g. subscription plans)
*/
export default function SettingsLayout({ active, children }: { active: string; children: React.ReactNode }) {
return (
<div className="fade-in settings-shell" dir="rtl" style={{ width: '100%' }}>
<div className="grid grid-cols-1 lg:grid-cols-[248px_minmax(0,1fr)] gap-5">
<PurchaseSubscriptionSidebar active={active} />
<div style={{ minWidth: 0 }}>{children}</div>
</div>
</div>
);
}