poduck/smoothschedule
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Add ticket permission UI and fix assignee dropdown

Browse Source 
Assignee Dropdown:
- Fix useUsers hook to fetch from /api/staff/ endpoint
- Add useStaffForAssignment hook for formatted dropdown data
- Update TicketModal to use new hook for assignee selection

Staff Permissions UI:
- Add "Can access support tickets" permission to invite modal for both managers and staff
- Add permission to edit modal for both managers and staff
- Managers default to having ticket access enabled
- Staff default to having ticket access disabled (must be explicitly granted)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
poduck
2025-11-28 05:49:40 -05:00
parent 9dabb0cb83
commit 4acea4f876
3 changed files with 139 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

80
frontend/src/pages/Staff.tsx
View File

@@ -661,6 +661,26 @@ const Staff: React.FC<StaffProps> = ({ onMasquerade, effectiveUser }) => {
</p>
</div>
</label>
{/* Can Access Tickets */}
<label className="flex items-start gap-3 p-3 bg-blue-50 dark:bg-blue-900/20 rounded-lg border border-blue-200 dark:border-blue-800 cursor-pointer hover:bg-blue-100 dark:hover:bg-blue-900/30 transition-colors">
<input
type="checkbox"
checked={invitePermissions.can_access_tickets ?? true}
onChange={(e) =>
setInvitePermissions({ ...invitePermissions, can_access_tickets: e.target.checked })
}
className="w-4 h-4 mt-0.5 rounded border-gray-300 text-brand-600 focus:ring-brand-500"
/>
<div>
<span className="text-sm font-medium text-gray-900 dark:text-white">
{t('staff.canAccessTickets', 'Can access support tickets')}
</span>
<p className="text-xs text-gray-500 dark:text-gray-400 mt-0.5">
{t('staff.canAccessTicketsHint', 'View and manage customer support tickets')}
</p>
</div>
</label>
</div>
)}
@@ -710,6 +730,26 @@ const Staff: React.FC<StaffProps> = ({ onMasquerade, effectiveUser }) => {
</p>
</div>
</label>
{/* Can Access Tickets */}
<label className="flex items-start gap-3 p-3 bg-gray-50 dark:bg-gray-700/50 rounded-lg border border-gray-200 dark:border-gray-600 cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors">
<input
type="checkbox"
checked={invitePermissions.can_access_tickets ?? false}
onChange={(e) =>
setInvitePermissions({ ...invitePermissions, can_access_tickets: e.target.checked })
}
className="w-4 h-4 mt-0.5 rounded border-gray-300 text-brand-600 focus:ring-brand-500"
/>
<div>
<span className="text-sm font-medium text-gray-900 dark:text-white">
{t('staff.canAccessTickets', 'Can access support tickets')}
</span>
<p className="text-xs text-gray-500 dark:text-gray-400 mt-0.5">
{t('staff.canAccessTicketsHint', 'View and manage customer support tickets')}
</p>
</div>
</label>
</div>
)}
@@ -959,6 +999,26 @@ const Staff: React.FC<StaffProps> = ({ onMasquerade, effectiveUser }) => {
</p>
</div>
</label>
{/* Can Access Tickets */}
<label className="flex items-start gap-3 p-3 bg-blue-50 dark:bg-blue-900/20 rounded-lg border border-blue-200 dark:border-blue-800 cursor-pointer hover:bg-blue-100 dark:hover:bg-blue-900/30 transition-colors">
<input
type="checkbox"
checked={editPermissions.can_access_tickets ?? true}
onChange={(e) =>
setEditPermissions({ ...editPermissions, can_access_tickets: e.target.checked })
}
className="w-4 h-4 mt-0.5 rounded border-gray-300 text-brand-600 focus:ring-brand-500"
/>
<div>
<span className="text-sm font-medium text-gray-900 dark:text-white">
{t('staff.canAccessTickets', 'Can access support tickets')}
</span>
<p className="text-xs text-gray-500 dark:text-gray-400 mt-0.5">
{t('staff.canAccessTicketsHint', 'View and manage customer support tickets')}
</p>
</div>
</label>
</div>
)}
@@ -1008,6 +1068,26 @@ const Staff: React.FC<StaffProps> = ({ onMasquerade, effectiveUser }) => {
</p>
</div>
</label>
{/* Can Access Tickets */}
<label className="flex items-start gap-3 p-3 bg-gray-50 dark:bg-gray-700/50 rounded-lg border border-gray-200 dark:border-gray-600 cursor-pointer hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors">
<input
type="checkbox"
checked={editPermissions.can_access_tickets ?? false}
onChange={(e) =>
setEditPermissions({ ...editPermissions, can_access_tickets: e.target.checked })
}
className="w-4 h-4 mt-0.5 rounded border-gray-300 text-brand-600 focus:ring-brand-500"
/>
<div>
<span className="text-sm font-medium text-gray-900 dark:text-white">
{t('staff.canAccessTickets', 'Can access support tickets')}
</span>
<p className="text-xs text-gray-500 dark:text-gray-400 mt-0.5">
{t('staff.canAccessTicketsHint', 'View and manage customer support tickets')}
</p>
</div>
</label>
</div>
)}