Files
clinicpro/assets/admin/components/paymentMethods/StatusToggle.tsx
T
hamed 0e7970d6e0 feat: replace checkboxes with Switch component for better UI consistency
- Updated DoctorDetailPage, MySecretariesPage, RecordNumberSettingsPage, RepresentationsPage, ResourcePoolsPage, ResourceTypesPage, SecretariesPage, SecretaryDetailPage, SettingsPage, SkillsPage, SmsWalletPage, and TagsSettingsPage to use the new Switch component instead of native checkboxes.
- Enhanced accessibility by ensuring the Switch component uses appropriate roles and labels.
- Added tests for the new Switch component to ensure functionality and accessibility compliance.
- Updated styles to accommodate the new Switch component design.
2026-08-05 16:09:46 +03:30

27 lines
819 B
TypeScript

import React from 'react';
import Switch from '../ui/Switch';
/**
* سوییچ وضعیت فعال/غیرفعال — معادل MUI Switch مبدأ با دیزاین‌سیستم مقصد.
* برچسب فعال/غیرفعال کنار سوییچ نمایش داده می‌شود (مثل مبدأ).
*/
export default function StatusToggle({
active,
onToggle,
disabled,
}: {
active: boolean;
onToggle: () => void;
disabled?: boolean;
}) {
const label = active ? 'فعال' : 'غیرفعال';
return (
<div style={{ display: 'flex', alignItems: 'center', gap: 8 }}>
<span title={label}>
<Switch checked={active} onChange={onToggle} disabled={disabled} ariaLabel={label} />
</span>
<span style={{ fontSize: 13, color: 'var(--text-2)' }}>{label}</span>
</div>
);
}