fix(secretary): gate CRUD action buttons across all panel pages by permission

Backend already returned 403 for ungranted secretary actions, but the UI still
showed the add/edit/delete buttons (e.g. clinic-services showed «بخش جدید» to a
secretary without services.create). Sweep every secretary-reachable page so each
create/edit/delete/manage control renders only when the matching
usePermissions().can(resource, action) is true. Owner/doctor/clinic are
unaffected — can() returns true when there is no permission context — so this
restricts only secretaries and mirrors the server checks.

Pages/components gated (resource):
- services: ClinicServicesPage, ServiceDetailPage (+ its tabs)
- inventory: InventoryPage, InventoryItemsTable, InventoryActionsMenu, PackagesView
- tags: TagsSettingsPage · staff: StaffPage · discounts: DiscountTab
- sms: SmsWalletPage · insurances: TenantInsuranceContracts
- clinic_doctors: ClinicDoctorsPage + ClinicDoctorsManager (props, default true)
- patients: PatientsListPage, MyPatientsPage, PatientDetailPage (records/notes/
  sessions/attachments/calls/wallet — create/update/delete split)
- appointments: AppointmentsPage (add + empty-slot booking gated by create),
  TurnsTable (status dropdown → read-only badge without update_status; actions
  menu hidden without manage/cancel)
- appointment_settings: AppointmentSettingsPage + ClinicAppointmentSettingsPage
  pass readOnly to ScheduleSection + FreeVisitPrice (new readOnly prop)

Not gated: view/read, search, filter, tabs, navigation, export, and modal
submit buttons reachable only via an already-gated trigger.

tsc clean; full frontend suite 501/501 passes.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

assets/admin/components/inventory/InventoryActionsMenu.tsx

@@ -2,6 +2,7 @@ import React, { useLayoutEffect, useRef, useState } from 'react';
 import { EllipsisHorizontalCircleIcon, PencilSquareIcon, TrashIcon } from '@heroicons/react/24/outline';
 import Portal from '../ui/Portal';
 import type { InventoryItem } from '../../hooks/useInventory';
+import { usePermissions } from '../../hooks/usePermissions';
 
 interface Props {
   item: InventoryItem;
@@ -17,7 +18,14 @@ const MENU_W = 160;
  * table container's `overflow: hidden`.
  */
 export default function InventoryActionsMenu({ item, onEdit, onDelete }: Props) {
+  const { can } = usePermissions();
+  const canUpdate = can('inventory', 'update');
+  const canDelete = can('inventory', 'delete');
   const [open, setOpen] = useState(false);
+
+  // منشیِ بدون هیچ مجوزِ ویرایش/حذف، منوی «عملیات» را اصلاً نبیند.
+  if (!canUpdate && !canDelete) return null;
+
   const [pos, setPos] = useState<{ top: number; left: number }>({ top: 0, left: 0 });
   const triggerRef = useRef<HTMLButtonElement>(null);
 
@@ -65,32 +73,36 @@ export default function InventoryActionsMenu({ item, onEdit, onDelete }: Props)
               borderRadius: 12, boxShadow: 'var(--shadow-lg)', overflow: 'hidden',
             }}
           >
-            <button
-              type="button"
-              role="menuitem"
-              onClick={() => { setOpen(false); onEdit(item); }}
-              style={{
-                display: 'flex', alignItems: 'center', gap: 8, width: '100%',
-                padding: '12px 16px', background: 'var(--primary-soft)', border: 'none',
-                cursor: 'pointer', fontSize: 14, fontWeight: 600, color: 'var(--text)',
-              }}
-            >
-              <PencilSquareIcon style={{ width: 20, height: 20 }} />
-              ویرایش
-            </button>
-            <button
-              type="button"
-              role="menuitem"
-              onClick={() => { setOpen(false); onDelete(item); }}
-              style={{
-                display: 'flex', alignItems: 'center', gap: 8, width: '100%',
-                padding: '12px 16px', background: 'transparent', border: 'none',
-                cursor: 'pointer', fontSize: 14, color: 'var(--danger)',
-              }}
-            >
-              <TrashIcon style={{ width: 20, height: 20 }} />
-              حذف
-            </button>
+            {canUpdate && (
+              <button
+                type="button"
+                role="menuitem"
+                onClick={() => { setOpen(false); onEdit(item); }}
+                style={{
+                  display: 'flex', alignItems: 'center', gap: 8, width: '100%',
+                  padding: '12px 16px', background: 'var(--primary-soft)', border: 'none',
+                  cursor: 'pointer', fontSize: 14, fontWeight: 600, color: 'var(--text)',
+                }}
+              >
+                <PencilSquareIcon style={{ width: 20, height: 20 }} />
+                ویرایش
+              </button>
+            )}
+            {canDelete && (
+              <button
+                type="button"
+                role="menuitem"
+                onClick={() => { setOpen(false); onDelete(item); }}
+                style={{
+                  display: 'flex', alignItems: 'center', gap: 8, width: '100%',
+                  padding: '12px 16px', background: 'transparent', border: 'none',
+                  cursor: 'pointer', fontSize: 14, color: 'var(--danger)',
+                }}
+              >
+                <TrashIcon style={{ width: 20, height: 20 }} />
+                حذف
+              </button>
+            )}
           </div>
         </Portal>
       )}

assets/admin/components/inventory/InventoryItemsTable.tsx

@@ -4,6 +4,7 @@ import { formatRial, formatNumber } from '../../lib/utils';
 import type { InventoryItem } from '../../hooks/useInventory';
 import InventoryStatusBadge from './InventoryStatusBadge';
 import InventoryActionsMenu from './InventoryActionsMenu';
+import { usePermissions } from '../../hooks/usePermissions';
 
 interface Props {
   items: InventoryItem[];
@@ -15,6 +16,9 @@ const HEAD = ['نام کالا', 'دسته‌بندی', 'موجودی', 'واح
 
 /** Consumable-items list: desktop table + mobile card grid (tauri InventoryList). */
 export default function InventoryItemsTable({ items, onEdit, onDelete }: Props) {
+  const { can } = usePermissions();
+  const canUpdate = can('inventory', 'update');
+  const canDelete = can('inventory', 'delete');
   return (
     <div style={{ width: '100%' }}>
       {/* Desktop table */}
@@ -75,14 +79,20 @@ export default function InventoryItemsTable({ items, onEdit, onDelete }: Props)
                 )}
               </div>
             ))}
-            <div style={{ display: 'flex', justifyContent: 'flex-end', gap: 8, marginTop: 12 }}>
-              <button className="btn sm ghost" aria-label="ویرایش" onClick={() => onEdit(item)} style={{ color: 'var(--text-2)' }}>
-                <PencilSquareIcon style={{ width: 16 }} />
-              </button>
-              <button className="btn sm ghost" aria-label="حذف" onClick={() => onDelete(item)} style={{ color: 'var(--danger)' }}>
-                <TrashIcon style={{ width: 16 }} />
-              </button>
-            </div>
+            {(canUpdate || canDelete) && (
+              <div style={{ display: 'flex', justifyContent: 'flex-end', gap: 8, marginTop: 12 }}>
+                {canUpdate && (
+                  <button className="btn sm ghost" aria-label="ویرایش" onClick={() => onEdit(item)} style={{ color: 'var(--text-2)' }}>
+                    <PencilSquareIcon style={{ width: 16 }} />
+                  </button>
+                )}
+                {canDelete && (
+                  <button className="btn sm ghost" aria-label="حذف" onClick={() => onDelete(item)} style={{ color: 'var(--danger)' }}>
+                    <TrashIcon style={{ width: 16 }} />
+                  </button>
+                )}
+              </div>
+            )}
           </li>
         ))}
       </ul>

assets/admin/components/inventory/PackagesView.tsx

@@ -2,6 +2,7 @@ import React, { useState } from 'react';
 import { ChevronDownIcon, PencilSquareIcon, TrashIcon } from '@heroicons/react/24/outline';
 import { formatRial } from '../../lib/utils';
 import type { InventoryPackage } from '../../hooks/useInventory';
+import { usePermissions } from '../../hooks/usePermissions';
 
 interface Props {
   packages: InventoryPackage[];
@@ -21,6 +22,9 @@ export default function PackagesView({ packages, onEdit, onDelete }: Props) {
 }
 
 function PackageCard({ pkg, onEdit, onDelete }: { pkg: InventoryPackage } & Pick<Props, 'onEdit' | 'onDelete'>) {
+  const { can } = usePermissions();
+  const canUpdate = can('inventory', 'update');
+  const canDelete = can('inventory', 'delete');
   const [expanded, setExpanded] = useState(false);
   const divider = <div style={{ height: 1, background: '#d7d7d7', margin: '8px 0' }} className="inv-divider" />;
 
@@ -91,20 +95,24 @@ function PackageCard({ pkg, onEdit, onDelete }: { pkg: InventoryPackage } & Pick
           قیمت پکیج: {formatRial(pkg.total)}
         </span>
         <div style={{ display: 'flex', gap: 8 }}>
-          <button
-            className="btn sm ghost"
-            onClick={() => onDelete(pkg)}
-            style={{ height: 40, width: 78, border: '1px solid var(--border)', color: 'var(--danger)', gap: 6 }}
-          >
-            <TrashIcon style={{ width: 16 }} /> حذف
-          </button>
-          <button
-            className="btn sm ghost"
-            onClick={() => onEdit(pkg)}
-            style={{ height: 40, width: 78, border: '1px solid var(--border)', color: 'var(--text-2)', gap: 6 }}
-          >
-            <PencilSquareIcon style={{ width: 16 }} /> ویرایش
-          </button>
+          {canDelete && (
+            <button
+              className="btn sm ghost"
+              onClick={() => onDelete(pkg)}
+              style={{ height: 40, width: 78, border: '1px solid var(--border)', color: 'var(--danger)', gap: 6 }}
+            >
+              <TrashIcon style={{ width: 16 }} /> حذف
+            </button>
+          )}
+          {canUpdate && (
+            <button
+              className="btn sm ghost"
+              onClick={() => onEdit(pkg)}
+              style={{ height: 40, width: 78, border: '1px solid var(--border)', color: 'var(--text-2)', gap: 6 }}
+            >
+              <PencilSquareIcon style={{ width: 16 }} /> ویرایش
+            </button>
+          )}
         </div>
       </div>
     </div>